made all navaar items expand to full width

This commit is contained in:
2023-06-04 10:24:20 +01:00
parent 32724fdeb7
commit cd90b22569

View File

@@ -53,11 +53,11 @@
.bar { .bar {
width: 100%; width: 100%;
position: fixed; position: fixed;
display: flex;
list-style-type: none; list-style-type: none;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
background-color: rgba(255, 255, 255, 0.25); background-color: rgba(255, 255, 255, 0.25);
list-style-type: none;
-webkit-backdrop-filter: blur(2.5px); -webkit-backdrop-filter: blur(2.5px);
-moz-backdrop-filter: blur(2.5px); -moz-backdrop-filter: blur(2.5px);
@@ -69,12 +69,13 @@
} }
.barItem { .barItem {
float: left; float: left;
flex: 1;
text-align: center; text-align: center;
} }
.barItem * { .barItem * {
display: block;
color: #222; color: #222;
text-decoration: none; text-decoration: none;
display: block;
font-size: 16px; font-size: 16px;
padding: 12px; padding: 12px;
} }
@@ -89,8 +90,7 @@
-moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); -moz-box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25); box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.25);
} }
.bar:has(#barItem1:hover) #barItem2 { .bar:has(a:hover) .barItem {
} }
/* Bar styling*/ /* Bar styling*/
@@ -125,17 +125,3 @@
width: 100%; width: 100%;
} }
} }
/* flexbox waffle */
.flexContainer {
height: 300px;
display: flex;
}
.flexItem {
margin: 10px;
background: orangered;
color: white;
flex-grow: 1;
background: purple;
}