Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit 350fbce8 authored by peter_rabbit's avatar peter_rabbit
Browse files

change page container layout

parent 780b95bc
No related branches found
No related tags found
No related merge requests found
/* Error: Undefined variable.
* ,
* 15 | color: $light_2;
* | ^^^^^^^^
* 16 | color: $medium_grey;
* | ^^^^^^^^^^^^
* '
* src/pages/education/education.scss 15:16 root stylesheet */
* src/pages/education/education.scss 16:16 root stylesheet */
body::before {
font-family: "Source Code Pro", "SF Mono", Monaco, Inconsolata, "Fira Mono",
......@@ -13,5 +13,5 @@ body::before {
padding: 1em;
margin-bottom: 1em;
border-bottom: 2px solid black;
content: "Error: Undefined variable.\a \2577 \a 15 \2502 color: $light_2;\a \2502 ^^^^^^^^\a \2575 \a src/pages/education/education.scss 15:16 root stylesheet";
content: "Error: Undefined variable.\a \2577 \a 16 \2502 color: $medium_grey;\a \2502 ^^^^^^^^^^^^\a \2575 \a src/pages/education/education.scss 16:16 root stylesheet";
}
......@@ -12,14 +12,14 @@ body ul {
list-style-type: none;
}
body a {
color: #34a0b3;
color: #4baabb;
text-decoration: none;
}
body a:hover {
color: #17cff0;
color: #72e3f0;
}
body blue {
color: #34a0b3;
color: #4baabb;
}
main {
......@@ -36,7 +36,7 @@ main header nav {
display: flex;
align-items: center;
height: 60px;
background-color: #fffb;
background-color: #fffa;
}
main header nav .home {
margin: 0 10px;
......@@ -162,29 +162,30 @@ main header nav .burger {
}
}
main #page-container {
background-color: white;
width: 1200px;
max-width: 100%;
width: 100%;
flex: 1;
}
main #page-container #education-page h1 {
margin: 15px 40px 0;
padding: 15px 40px 0;
font-size: 25px;
margin: 0;
background-color: white;
}
main #page-container #education-page h3.big {
font-size: 30px;
}
main #page-container #education-page .edu-philo {
margin: 15px 40px 15px 100px;
max-width: 800px;
padding: 15px 40px 15px 100px;
font-style: italic;
color: #aabbc8;
color: #6b7880;
margin: 0;
background-color: white;
}
main #page-container #education-page .title-banner {
display: flex;
justify-content: flex-end;
flex-direction: column;
height: 15vw;
height: 20vw;
min-height: 250px;
background-size: cover;
background-repeat: no-repeat;
......@@ -203,11 +204,15 @@ main #page-container #education-page .title-banner h2 {
text-shadow: 0 0 6px #0003;
}
main #page-container #education-page .section-contents {
margin: 20px 40px 60px;
padding: 20px 40px 60px;
margin: 0 auto;
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
height: auto;
width: 1300px;
max-width: 100%;
background-color: white;
}
main #page-container #education-page .section-contents .full-row {
grid-column: 1/span 2;
......@@ -256,7 +261,7 @@ main #page-container #education-page .section-contents .list-wrapper ul.learning
display: block;
position: absolute;
background-color: #fffa;
padding: 3px 25px;
padding: 3px 10px;
width: 100%;
}
main #page-container #education-page .section-contents .list-wrapper ul.learning-themes li.learning-theme img {
......@@ -367,14 +372,14 @@ main #page-container #education-page .section-contents .infos-inscriptions .pric
}
@media screen and (max-width: 560px) {
main #page-container #education-page h1 {
margin: 15px 20px 0;
padding: 15px 20px 0;
font-size: 25px;
}
main #page-container #education-page h3.big {
font-size: 22px;
}
main #page-container #education-page .edu-philo {
margin: 15px;
padding: 15px;
max-width: unset;
}
main #page-container #education-page .title-banner {
......@@ -387,7 +392,7 @@ main #page-container #education-page .section-contents .infos-inscriptions .pric
text-shadow: 0 0 4px #000b;
}
main #page-container #education-page .section-contents {
margin: 20px 10px 40px;
padding: 20px 10px 40px;
grid-template-columns: 1fr;
}
main #page-container #education-page .section-contents .full-row {
......
#education-page {
h1 {
margin: 15px 40px 0;
padding: 15px 40px 0;
font-size: 25px;
margin: 0;
background-color: white;
}
h3 {
&.big {
......@@ -9,16 +11,17 @@
}
}
.edu-philo {
margin: 15px 40px 15px 100px;
max-width: 800px;
padding: 15px 40px 15px 100px;
font-style: italic;
color: $light_2;
color: $medium_grey;
margin: 0;
background-color: white;
}
.title-banner {
display: flex;
justify-content: flex-end;
flex-direction: column;
height: 15vw;
height: 20vw;
min-height: 250px;
&.game-banner {
background-image: url("/assets/images/game_studio_banner.png");
......@@ -37,11 +40,15 @@
}
}
.section-contents {
margin: 20px 40px 60px;
padding: 20px 40px 60px;
margin: 0 auto;
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
height: auto;
width:1300px;
max-width: 100%;
background-color: white;
.full-row {
grid-column: 1 / span 2;
}
......@@ -86,7 +93,7 @@
display: block;
position: absolute;
background-color: #fffa;
padding: 3px 25px;
padding: 3px 10px;
width: 100%;
}
img {
......@@ -208,7 +215,7 @@
@media screen and (max-width: $screen_s) {
h1 {
margin: 15px 20px 0;
padding: 15px 20px 0;
font-size: 25px;
}
h3 {
......@@ -217,7 +224,7 @@
}
}
.edu-philo {
margin: 15px;
padding: 15px;
max-width: unset;
}
.title-banner {
......@@ -230,7 +237,7 @@
}
}
.section-contents {
margin: 20px 10px 40px;
padding: 20px 10px 40px;
grid-template-columns: 1fr;
.full-row {
grid-column: 1;
......
......@@ -37,7 +37,7 @@ main {
display: flex;
align-items: center;
height: $navbar_height;
background-color: #fffb;
background-color: #fffa;
.home {
margin: 0 10px;
a {
......@@ -178,9 +178,7 @@ main {
}
}
#page-container {
background-color: white;
width: 1200px;
max-width: 100%;
width: 100%;
flex: 1;
@import "./pages/education/education.scss";
}
......
......@@ -10,8 +10,8 @@ $purple: #902f90;
$green: #00ff00;
$kaki: #368736;
$blue_1: #1c3db2;
$blue_2: #34a0b3;
$blue_3: #17cff0;
$blue_2: #4baabb;
$blue_3: #72e3f0;
$red_1: #9c3030;
$red_2: #e74949;
$yellow_1: #e5a002;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment