header menu

This commit is contained in:
2021-12-13 17:29:16 +01:00
parent 9237a38979
commit 99b202a810
4 changed files with 145 additions and 27 deletions
+53 -11
View File
@@ -122,6 +122,9 @@
.path-faq {
margin: 0; }
.path-ressources {
margin: 0; }
.main-content {
margin-top: 7rem; }
@@ -1166,12 +1169,36 @@ a {
background-color: #009ee3;
text-transform: uppercase; }
.page-node-type-ressource .block-contenudelapageprincipale {
display: flex; }
.page-node-type-ressource .block-contenudelapageprincipale span {
flex: 0 1 100%; }
.page-node-type-ressource .block-contenudelapageprincipale .node-type-ressource {
flex: 0 1 100%; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale span h2 {
font-family: "Source Code Pro";
font-size: 2rem;
font-weight: 500; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div {
display: grid;
grid-template-areas: "contact contact contact" "ancre texte liens"; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-type-de-ressource {
text-transform: uppercase; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-type-de-ressource a {
color: #009ee3;
font-size: 0.8rem;
font-weight: 800; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-auteur-s- {
grid-area: contact;
font-size: 1.2rem;
font-weight: 900; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-edition {
grid-area: contact; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-images {
display: none; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-textes {
grid-area: texte; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-fichiers {
grid-area: liens; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-actu-liee {
grid-area: liens; }
.path-node.page-node-type-ressource #block-contenudelapageprincipale .node-type-ressource div .field--name-field-liens {
grid-area: liens; }
.node-type-offre_de_service {
display: flex; }
@@ -1231,16 +1258,19 @@ a {
#header-top .region-header-top-left #block-logoeql img {
width: 80%;
height: auto; }
#header-top .region-header-top-left #block-headermenu {
align-self: baseline;
width: 70%; }
#header-top .region-header-top-left ul {
font-size: 1.2rem;
font-size: 1rem;
list-style: none;
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%; }
#header-top .region-header-top-left ul :is(.sous-liste) {
display: flex;
flex-direction: column;
padding: 1rem; }
flex-direction: column; }
#header-top .region-header-top-left ul li a {
color: black; }
#header-top .region-header-top-left ul li .is-active {
@@ -1249,10 +1279,14 @@ a {
color: #009ee3; }
#header-top .region-header-top-left ul div:first-child li div {
display: none; }
#header-top .region-header-top-left ul div:nth-child(2) li div {
display: none; }
#header-top .region-header-top-left ul:is(.ul1 .sous-liste .ul2) {
display: none; }
#header-top .region-header-top-left :hover ul div:first-child li div {
display: block;
background-color: white;
padding: 1rem; }
padding: 0.2rem; }
#header-top .region-header-top-left :hover ul div:first-child li div a {
color: black; }
#header-top .region-header-top-left :hover ul div:first-child li div a:hover {
@@ -1260,11 +1294,19 @@ a {
#header-top .region-header-top-left :hover ul div:nth-child(2) li div {
display: block;
background-color: white;
padding: 1rem; }
padding: 0.2rem; }
#header-top .region-header-top-left :hover ul div:nth-child(2) li div a {
color: black; }
#header-top .region-header-top-left :hover ul div:nth-child(2) li div a:hover {
color: #009ee3; }
#header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) {
display: block;
background-color: white;
padding: 0.2rem; }
#header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) a {
color: black; }
#header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) a:hover {
color: #009ee3; }
#header-top #block-socialnetwork-2 {
position: relative;
top: -33px;
@@ -34,6 +34,9 @@
.path-faq{
margin: 0;
}
.path-ressources{
margin: 0;
}
.main-content{
margin-top: 7rem;
}
@@ -1,13 +1,65 @@
.page-node-type-ressource{
.path-node.page-node-type-ressource{
.block-contenudelapageprincipale{
display: flex;
#block-contenudelapageprincipale{
// display: grid;
// grid-template-areas: "contact"
// "ancre texte liens"
span{
flex: 0 1 100%;
// grid-column: 2 / span 6;
// grid-area: contact;
h2{
font-family: "Source Code Pro";
font-size: 2rem;
font-weight: 500;
}
}
.node-type-ressource{
flex:0 1 100%;
div{
display: grid;
grid-template-areas: "contact contact contact"
"ancre texte liens" ;
// display: flex;
// flex-direction: column;
.field--name-field-type-de-ressource{
// grid-area: contact;
text-transform: uppercase;
a{
color: $blue-light;
font-size: 0.8rem;
font-weight: 800;
}
}
.field--name-field-auteur-s-{
grid-area: contact;
font-size: 1.2rem;
font-weight: 900;
}
.field--name-field-edition {
grid-area: contact;
}
.field--name-field-date-de-parution{
}
.field--name-field-images{
display:none;
}
.field--name-field-textes{
grid-area: texte;
}
.field--name-field-fichiers{
grid-area: liens;
}
.field--name-field-actu-liee{
grid-area: liens;
}
.field--name-field-liens{
grid-area: liens;
}
}
// flex:0 1 100%;
}
}
}
@@ -62,16 +62,25 @@
}
}
#block-headermenu{
align-self: baseline;
width: 70%;
.block-headermenu-menu{
}
}
ul{
font-size: 1.2rem;
font-size: 1rem;
list-style: none;
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%;
:is(.sous-liste){
display: flex;
flex-direction: column;
padding: 1rem;
// padding: 1rem;
}
li{
@@ -89,17 +98,17 @@
ul div:first-child li div{
display: none;
}
// ul div:nth-child(2) li div{
// display: none;
// }
// ul:is(.ul1 .sous-liste .ul2){
// display: none;
// }
:hover ul {
ul div:nth-child(2) li div{
display: none;
}
ul:is(.ul1 .sous-liste .ul2){
display: none;
}
:hover ul{
div:first-child li div{
display: block;
background-color: $white;
padding: 1rem;
padding: 0.2rem;
a{
color: $black;
&:hover{
@@ -112,7 +121,7 @@
div:nth-child(2) li div{
display: block;
background-color: $white;
padding: 1rem;
padding: 0.2rem;
a{
color: $black;
&:hover{
@@ -121,6 +130,18 @@
}
}
}
:hover ul:is(.ul1 .sous-liste .ul2){
display: block;
background-color: $white;
padding: 0.2rem;
a{
color: $black;
&:hover{
color: $blue-light;
}
}
}
}
// reseaux sociaux