You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hi shadeed, thank you for your afford providing this excellent components!
I want to suggest adding another style: the navigation with the centered logo. For me then would be everything covered.
I am a bit new to github so here is the code:
Hi shadeed, thank you for your afford providing this excellent components!
I want to suggest adding another style: the navigation with the centered logo. For me then would be everything covered.
I am a bit new to github so here is the code:
html (pastebin, because github breaks html here)
https://pastebin.com/raw/g4U4EGex
css
.container {
display: -webkit-box;
display: flex;
justify-content: space-around;
-webkit-box-align: center;
align-items: center;
background: #111;
margin: 25px 0;
box-shadow: 0 5px 15px -10px #111;
}
.logo {
-webkit-box-ordinal-group: 2;
order: 1;
border-radius: 100%;
background: #4382d6;
box-shadow: 0 0 0 3px #fff, 0 0 0 15px #111;
font-size: 24px;
color: #fff;
line-height: 32px;
padding: 10px;
}
.item {
color: rgba(255, 255, 255, 0.88);
text-decoration: none;
font-family: sans-serif;
padding: 24px;
}
.item:hover{
color: #fff;
background: rgba(255, 255, 255, 0.15);
}
.item:nth-of-type(n+4) {
-webkit-box-ordinal-group: 3;
order: 2;
}
@media all and (max-width: 800px) {
.container {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-align: stretch;
align-items: stretch;
}
.logo {
-webkit-box-ordinal-group: 1;
order: 0;
text-align: center;
width: 100px;
margin: auto auto 20px;
}
.item {
text-align: center;
border-bottom: 1px solid #111;
}
}
The text was updated successfully, but these errors were encountered: