Stretch nav links
This commit is contained in:
parent
6f3fc6daab
commit
37c0f26fd6
1 changed files with 6 additions and 1 deletions
|
|
@ -42,6 +42,7 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
||||||
#app {
|
#app {
|
||||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
|
|
@ -70,6 +71,10 @@ export default {
|
||||||
background-color: #333;
|
background-color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.nav li {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
/* Style the links inside the navigation bar */
|
/* Style the links inside the navigation bar */
|
||||||
.nav a {
|
.nav a {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|
@ -80,7 +85,7 @@ export default {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Have active route use different color */
|
/* Have active route use different color */
|
||||||
.nav a.active {
|
.nav li:has(> a.active) {
|
||||||
background-color: #4CAF50;
|
background-color: #4CAF50;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue