Ajouter responsiveness au header #93
2 changed files with 53 additions and 23 deletions
|
@ -25,19 +25,58 @@ body{
|
|||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.heading1 {
|
||||
font-family: "Poppins";
|
||||
font-weight: 600; /*semi-bold*/
|
||||
font-size: 3rem; /*48px*/
|
||||
color: #394596; /*Bleu AGECEM*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.heading2 {
|
||||
font-family: "Poppins";
|
||||
font-weight: 300; /*light*/
|
||||
font-size: 1rem; /*16px*/
|
||||
color: #394596; /*Bleu AGECEM*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
|
||||
.wrapper{
|
||||
max-width: 768px;
|
||||
width: calc(100% - var(15px));
|
||||
|
||||
}
|
||||
|
||||
.heading1 {
|
||||
font-size: 4rem; /*64px*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.heading2 {
|
||||
font-size: 1.5rem; /*24px*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1140px) {
|
||||
|
||||
.wrapper{
|
||||
max-width: 1140px;
|
||||
width: calc(100% - var(30px));
|
||||
}
|
||||
|
||||
.heading1 {
|
||||
font-size: 4rem; /*64px*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.heading2 {
|
||||
font-size: 1.5rem; /*24px*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*Utilisation du css Layout Grid pour faire le wrapper*/
|
||||
|
@ -51,18 +90,7 @@ width: calc(100% - var(30px));
|
|||
grid-column: 2/3;
|
||||
}
|
||||
|
||||
.heading1 {
|
||||
font-family: "Poppins";
|
||||
font-weight: 600; /*semi-bold*/
|
||||
font-size: 6rem; /*96px*/
|
||||
color: #394596; /*Bleu AGECEM*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.heading2 {
|
||||
font-family: "Poppins";
|
||||
font-weight: 600; /*semi-bold*/
|
||||
font-size: 1.5rem; /*24px*/
|
||||
color: #394596; /*Bleu AGECEM*/
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -9,7 +9,9 @@
|
|||
</head>
|
||||
<body>
|
||||
{{ template "header-html" }}
|
||||
<h1 class="heading1">Association Générale Étudiante du Cégep Édouard-Montpetit</h1>
|
||||
<h1 class="heading1">AGECEM</h1>
|
||||
<h2 class="heading2">Association Générale Étudiante du Cégep Édouard-Montpetit</h2>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
{{ end }}
|
||||
|
|
Loading…
Reference in a new issue