autonomic-cooperative/hubl
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feature : css for about page : colors & make clean on mobile

Browse Source
This commit is contained in:
maxime_senza 2020-05-29 00:28:53 +02:00
parent 7725350ca1
commit bf2bddeb32
2 changed files with 28 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/page-about.pug
View File

@ -13,5 +13,5 @@
h3 Contacte-nous h3 Contacte-nous
p Tu veux contribuer, nous remonter un bug, nous suggérer une amélioration, travailler avec nous ? p Tu veux contribuer, nous remonter un bug, nous suggérer une amélioration, travailler avec nous ?
div sib-link.main-cta
p Contact p Contact

29
src/styles/base/about.scss
View File

@ -1,9 +1,14 @@
#about{ #about{
$main-color: rgb(236, 94, 92);
$second-color: white;
h2,h3{ h2,h3{
text-transform: uppercase; text-transform: uppercase;
} }
.flex-content-white{ .flex-content-white{
display: flex; display: flex;
@media only screen and (max-width: 768px) {
flex-direction: column;
}
>div{ >div{
padding: 4.2em 4.7em; padding: 4.2em 4.7em;
text-align: center; text-align: center;
@ -16,12 +21,32 @@
justify-content: space-between; justify-content: space-between;
} }
} }
>div:first-child{ >div:first-child{
width: 100%; width: 60%;
} }
>div:last-child{ >div:last-child{
width: 35%; width: 35%;
@media only screen and (max-width: 768px) {
width: 60%;
} }
} }
} }
.main-cta{
background: $second-color none repeat scroll 0% 0%;
border: 1px solid $main-color;
border-radius: 55px;
color: $main-color;
cursor: pointer;
font-weight: bold;
text-transform: uppercase;
width: 25%;
font-size: 1rem;
}
.main-cta:hover{
background: $main-color none repeat scroll 0% 0%;
border : 1px solid $second-color;
color: $second-color;
}
}