This commit is contained in:
Janis
2023-01-07 08:52:59 +01:00
parent 6ed3cc22f3
commit dd121030e4
30 changed files with 7745 additions and 8665 deletions

View File

@@ -0,0 +1,37 @@
@import "../variables.scss";
.article {
display: grid;
gap: 70px;
grid-template-columns: $tutorial-content-table-width minmax(0px, 1fr) $tutorial-sidebar-width;
margin: 0px auto;
max-width: 1800px;
padding: 0px 24px;
@media (max-width: $tutorial-breakpoint-1) {
grid-template-columns: $tutorial-content-table-width 1fr;
}
@media (max-width: $tutorial-breakpoint-2) {
grid-template-columns: 1fr;
}
.header {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px 0px 10px 0px;
gap: 10px 0px;
h1 {
}
img {
width: min(100%, 750px);
height: auto;
aspect-ratio: 15/7;
}
}
.tutorialContent {
min-width: 0;
}
}

View File

@@ -0,0 +1,29 @@
@import "../variables.scss";
.articleContentTable {
@media (max-width: $tutorial-breakpoint-2) {
display: none;
}
.stickyContainer {
position: sticky;
top: $tutorial-grid-sticky-top;
.list {
align-items: flex-start;
display: flex;
flex-direction: column;
margin-bottom: 16px;
padding-bottom: 16px;
row-gap: 10px;
}
.adContainer {
background-color: #ff00003e;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
}
}

View File

@@ -1,4 +1,5 @@
@import "../variables.scss";
.nav {
background-color: var(--color-background-nav);
height: $nav-height-inital;

View File

@@ -1,21 +0,0 @@
@import "../variables.scss";
.tutorial {
display: grid;
gap: 70px;
grid-template-columns: $tutorial-content-table-width minmax(0px, 1fr) $tutorial-sidebar-width;
margin: 0px auto;
max-width: 1800px;
padding: 0px 24px;
@media (max-width: $tutorial-breakpoint-1) {
grid-template-columns: $tutorial-content-table-width 1fr;
}
@media (max-width: $tutorial-breakpoint-2) {
grid-template-columns: 1fr;
}
.tutorialContent {
min-width: 0;
}
}

View File

@@ -1,29 +0,0 @@
@import "../variables.scss";
.tutorialContentTable {
@media (max-width: $tutorial-breakpoint-2) {
display: none;
}
.stickyContainer {
position: sticky;
top: $tutorial-grid-sticky-top;
.list {
align-items: flex-start;
display: flex;
flex-direction: column;
margin-bottom: 16px;
padding-bottom: 16px;
row-gap: 10px;
}
.adContainer {
background-color: #ff00003e;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
}
}