diff options
| author | Mark Otto <[email protected]> | 2019-07-16 16:00:46 -0700 |
|---|---|---|
| committer | XhmikosR <[email protected]> | 2019-07-17 16:21:47 +0300 |
| commit | ebcc3ff9af096ab95e473328159d6c6dc2843d67 (patch) | |
| tree | 13e221a41d9a7c284432265db6458b308c3bd89a | |
| parent | 8bc6692082207e661a6a8606f3ff28e389110090 (diff) | |
| download | bootstrap-ebcc3ff9af096ab95e473328159d6c6dc2843d67.tar.xz bootstrap-ebcc3ff9af096ab95e473328159d6c6dc2843d67.zip | |
Move sidebar icon to CSS
| -rw-r--r-- | site/layouts/partials/docs-sidebar.html | 5 | ||||
| -rw-r--r-- | site/layouts/partials/icons/arrow.svg | 1 | ||||
| -rw-r--r-- | site/static/docs/4.3/assets/scss/_sidebar.scss | 25 |
3 files changed, 21 insertions, 10 deletions
diff --git a/site/layouts/partials/docs-sidebar.html b/site/layouts/partials/docs-sidebar.html index 200f8cd41..7f6f1eb20 100644 --- a/site/layouts/partials/docs-sidebar.html +++ b/site/layouts/partials/docs-sidebar.html @@ -17,7 +17,6 @@ <li class="bd-sidenav-group my-1{{ if $active_group }} active{{ end }} js-sidenav-group"> <a class="d-inline-flex align-items-center bd-sidenav-group-link" href="/docs/{{ $.Site.Params.docs_version }}/{{ $group_slug }}/{{ if $group.pages }}{{ $link_slug }}/{{ end }}"> - {{- partial "icons/arrow.svg" (dict "class" "bd-sidenav-group-link-icon" "width" "16" "height" "16") -}} <div>{{- $group.title -}}</div> </a> @@ -38,7 +37,9 @@ <li class="my-3 mx-4 border-top"></li> <li class="bd-sidenav-group pl-3"> - <a class="d-inline-flex bd-sidenav-group-link" href="/docs/{{ $.Site.Params.docs_version }}/migration/">Migration</a> + <a class="d-inline-flex align-items-center bd-sidenav-group-link" href="/docs/{{ $.Site.Params.docs_version }}/migration/"> + <div>Migration</div> + </a> </li> </ul> </nav> diff --git a/site/layouts/partials/icons/arrow.svg b/site/layouts/partials/icons/arrow.svg deleted file mode 100644 index 097c1a2d5..000000000 --- a/site/layouts/partials/icons/arrow.svg +++ /dev/null @@ -1 +0,0 @@ -<svg xmlns="http://www.w3.org/2000/svg"{{ with .width }} width="{{ . }}"{{ end }}{{ with .height }} height="{{ . }}"{{ end }}{{ with .class }} class="{{ . }}"{{ end }} viewBox="0 0 16 16"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 14l6-6-6-6"/></svg> diff --git a/site/static/docs/4.3/assets/scss/_sidebar.scss b/site/static/docs/4.3/assets/scss/_sidebar.scss index c18a42053..834300057 100644 --- a/site/static/docs/4.3/assets/scss/_sidebar.scss +++ b/site/static/docs/4.3/assets/scss/_sidebar.scss @@ -43,6 +43,18 @@ color: rgba(0, 0, 0, .65); @include border-radius(.25rem); + &::before { + display: inline-block; + width: .875rem; + height: .875rem; + margin-right: .25rem; + content: ""; + background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" role="img"><path stroke="currentColor" stroke-width="2" d="M5 14l6-6-6-6" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"/></svg>'); + background-repeat: no-repeat; + background-position: center center; + opacity: .5; + } + > * { pointer-events: none; } &:hover { @@ -52,15 +64,9 @@ } } -.bd-sidenav-group-link-icon { - width: .875rem; - margin-right: .25rem; - opacity: .5; -} - .bd-sidenav-group { &.active { - .bd-sidenav-group-link-icon { + .bd-sidenav-group-link::before { transform: rotate(90deg); } @@ -74,6 +80,11 @@ } } +// Hide icon on last item +.bd-sidenav-group:last-child .bd-sidenav-group-link::before { + display: none; +} + // All levels of nav .bd-sidebar .nav { padding-left: 1.25rem; |
