style(examples): nav bar

This commit is contained in:
moklick
2020-07-21 17:32:41 +02:00
parent 3677319871
commit d5035dfa69
+11 -9
View File
@@ -48,8 +48,8 @@ header a:hover {
.menu { .menu {
margin-left: auto; margin-left: auto;
background: rgb(255, 96, 96); background: #f3f3f3;
color: white; color: #333;
border: none; border: none;
padding: 5px 12px; padding: 5px 12px;
border-radius: 5px; border-radius: 5px;
@@ -74,25 +74,26 @@ nav.is-open {
nav a { nav a {
text-decoration: none; text-decoration: none;
font-size: 14px; font-size: 14px;
background: rgb(255, 96, 96); background: #f3f3f3;
color: white; color: white;
padding: 5px 12px; padding: 6px 12px;
border-radius: 5px; border-radius: 5px;
position: relative; position: relative;
display: block; display: block;
margin-bottom: 5px; margin-bottom: 5px;
text-align: center;
} }
nav a, nav a,
nav a:focus, nav a:focus,
nav a:active, nav a:active,
nav a:visited { nav a:visited {
color: #fff; color: #333;
} }
nav a:hover { nav a:hover {
color: #fff; color: #333;
box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.12); box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.08);
} }
nav a.active:before { nav a.active:before {
@@ -101,7 +102,7 @@ nav a.active:before {
width: 6px; width: 6px;
height: 6px; height: 6px;
background: white; background: white;
opacity: 0.5; opacity: 0.8;
left: 0; left: 0;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
@@ -165,6 +166,7 @@ nav a.active:before {
font-size: 12px; font-size: 12px;
display: inline-block; display: inline-block;
margin-bottom: 0; margin-bottom: 0;
padding: 5px 12px;
} }
.menu { .menu {
@@ -174,4 +176,4 @@ nav a.active:before {
.overview-example__add { .overview-example__add {
display: block; display: block;
} }
} }