Permalink
Browse files

🍣 style scopedのテスト

  • Loading branch information...
1 parent 9ae6c64 commit 896d4eec1ccb82d1ade0329bc81f000703da0d82 @tumbling-dice committed Sep 10, 2016
Showing with 21 additions and 8 deletions.
  1. +21 −8 public/components/global-nav.tag
@@ -2,7 +2,14 @@
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<nav-header></nav-header>
- <navbar></navbar>
+ <div id="navbar" class="navbar-collapse collapse">
+ <navbar></navbar>
+ <ul class="nav navbar-nav navbar-right">
+ <li class="active">
+ <a href="./">scope test</a>
+ </li>
+ </ul>
+ </div>
</div>
</nav>
</global-nav>
@@ -20,13 +27,19 @@
</nav-header>
<navbar>
- <div id="navbar" class="navbar-collapse collapse">
- <ul class="nav navbar-nav">
- <li each="{ nav in navs }" class="{ active: isActive(nav.link) }">
- <a href="{ nav.link }">{ nav.title }</a>
- </li>
- </ul>
- </div>
+ <ul class="nav navbar-nav">
+ <li each="{ nav in navs }" class="{ active: isActive(nav.link) }">
+ <a href="{ nav.link }">{ nav.title }</a>
+ </li>
+ </ul>
+
+ <style scoped>
+ /* bootstrapの指定が複雑すぎるので!importantで強制的に上書き */
+ .active > a {
+ background-color: #BBDEFB !important;
+ }
+
+ </style>
<script>
this.navs = [

0 comments on commit 896d4ee

Please sign in to comment.