Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: website improvements #845

Merged
merged 4 commits into from
Oct 18, 2023
Merged

docs: website improvements #845

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5adbb6c
fix: website improvements
mfruehmannext Oct 12, 2023
6bc5f38
fix: attempt to fix pipeline
mfruehmannext Oct 13, 2023
4ce0e74
fix: remove commented-out margin-declaration
mfruehmannext Oct 17, 2023
e6c4912
fix: re-rename custom.css file, hopefully pipeline wont break again
mfruehmannext Oct 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions packages/documentation/docusaurus.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,9 @@ try {
const customCss = [
...libCss,
require.resolve('./src/css/custom.css'),
require.resolve('./src/css/search.css'),
require.resolve('./src/css/api-table.css'),
require.resolve('./src/css/cards.css'),
require.resolve('./src/css/search.scss'),
require.resolve('./src/css/api-table.scss'),
require.resolve('./src/css/cards.scss'),
danielleroux marked this conversation as resolved.
Show resolved Hide resolved
];

const baseUrl = process.env.BASE_URL || '/';
Expand Down
34 changes: 32 additions & 2 deletions packages/documentation/src/components/Card.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,21 +23,51 @@
background-color: var(--theme-color-2);
margin: 0 1.25rem 1.25rem 0;
cursor: pointer;
text-decoration: none;
transition: transform 0.15s ease-in-out;

@media (max-width: 684px) {
width: 100%;
margin-right: 0;
}

@media (min-width: 664px) and (max-width: 684px) {
max-width: 640px;
}

@media (min-width: 997px) and (max-width: 1087px) {
/*margin-right: 0;*/
mfruehmannext marked this conversation as resolved.
Show resolved Hide resolved
width: 100%;
}

&:hover {
transform: scale(1.07);
text-decoration: none !important;
}

}



.Card.Auto__Width {
width: auto;
}

.Card_big {
display: flex;
flex-direction: column;
width: 640px;
max-width: 640px;
width: 100%;
min-width: 19.375rem;
height: 60px;
background-color: var(--theme-color-2);
margin: 0 1.25rem 1.25rem 0;
margin: 0 0 1.25rem 0;
cursor: pointer;

@media (min-width: 994px) {
margin-right: 1.25rem;
}

}

.Card.With__Icon {
Expand Down
54 changes: 25 additions & 29 deletions packages/documentation/src/components/Card.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,39 +45,35 @@ export function Card(
return (
<Link
to={link()}
style={{
textDecoration: 'none',
}}
className={clsx(
styles.Card,
{
[styles.Card__Primary]: props.isPrimary,
[styles.With__Icon]: props.icon,
[styles.Auto__Width]: props.autoWidth,
},
props.size === 'big' ? styles.Card_big : styles.Card
)}
style={props.style}
>

<div
className={clsx(
styles.Card,
{
[styles.Card__Primary]: props.isPrimary,
[styles.With__Icon]: props.icon,
[styles.Auto__Width]: props.autoWidth,
},
props.size === 'big' ? styles.Card_big : styles.Card
)}
style={props.style}
className={clsx(styles.Label, 'text-h2', {
[styles.Full__Height]: !props.icon,
})}
>
<div
className={clsx(styles.Label, 'text-h2', {
[styles.Full__Height]: !props.icon,
})}
>
{props.label}
{props.children}
</div>
{props.icon ? (
<>
<div className={styles.Splitter}></div>
<div className={styles.Icon}>
<IxIcon name={props.icon} size="32"></IxIcon>
</div>
</>
) : null}
{props.label}
{props.children}
</div>
{props.icon ? (
<>
<div className={styles.Splitter}></div>
<div className={styles.Icon}>
<IxIcon name={props.icon} size="32"></IxIcon>
</div>
</>
) : null}

</Link>
);
}
Expand Down
0 packages/documentation/src/css/api-table.css → ...ages/documentation/src/css/api-table.scss
View file
Open in desktop
File renamed without changes.
0 packages/documentation/src/css/cards.css → packages/documentation/src/css/cards.scss
View file
Open in desktop
File renamed without changes.
12 changes: 12 additions & 0 deletions packages/documentation/src/css/search.css → packages/documentation/src/css/search.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,3 +52,15 @@
.aa-Label {
margin-bottom: 0px !important;
}

@media (max-width: 500px) {
#search_input_react {
width: 4em;
}
}

@media (max-width: 400px) {
.navbar__search {
display: none;
}
}
2 changes: 1 addition & 1 deletion packages/documentation/src/theme/Navbar/Logo/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ export default function NavbarLogo() {
return (
<div className="navbar__brand">
<a href={base} target="_self">
<img className="navbar__logo" src={logo}></img>
<img className="navbar__logo" src={logo} alt={"Siemens Industrial Experience"} aria-label={"Siemens Industrial Experience"}></img>
</a>
</div>
);
Expand Down