rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

Update subnav to remove breadcrumb and just keep versions and search (#29368)

Browse Source
This commit is contained in:
Mark Otto 2019-09-05 11:43:31 -07:00 committed by XhmikosR
parent c6a82fcc6f
commit eb49bd11c9
5 changed files with 20 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
site/layouts/partials/docs-subnav.html
View File

@ -1,19 +1,11 @@
<nav class="bd-subnavbar pt-2 pb-3 pb-md-2">
<div class="container-xl d-flex align-items-md-center flex-wrap">
<div class="d-flex align-items-center mr-sm-auto order-2 order-md-0">
<div class="d-none d-md-block">
<a class="link-dark" href="/" onclick="ga('send', 'event', 'Subnav', 'click', 'Bootstrap');">Bootstrap</a>
{{ partial "icons/booticon-chevron-right.svg" (dict "class" "booticon d-inline-block mx-2 flex-shrink-0" "width" "12px" "height" "12px") }}
</div>
<a class="link-dark" href="/docs/{{ .Site.Params.docs_version }}/getting-started/introduction/" onclick="ga('send', 'event', 'Subnav', 'click', 'Documentation');">Documentation</a>
{{ partial "icons/booticon-chevron-right.svg" (dict "class" "booticon d-inline-block mx-2 flex-shrink-0" "width" "12px" "height" "12px") }}
{{ partial "docs-versions" . }}
</div>
<form class="bd-search d-flex align-items-center mb-2 mb-md-0">
<input type="search" class="form-control" id="search-input" placeholder="Search..." aria-label="Search for..." autocomplete="off" data-docs-version="{{ .Site.Params.docs_version }}">
<input type="search" class="form-control" id="search-input" placeholder="Search docs..." aria-label="Search docs for..." autocomplete="off" data-docs-version="{{ .Site.Params.docs_version }}">
</form>
<button class="btn btn-link bd-search-docs-toggle d-md-none p-0 ml-3 order-3 ml-auto" type="button" data-toggle="collapse" data-target="#bd-docs-nav" aria-controls="bd-docs-nav" aria-expanded="false" aria-label="Toggle docs navigation">

4
site/layouts/partials/docs-versions.html
View File

@ -1,6 +1,6 @@
<div class="dropdown">
<button class="btn btn-link dropdown-toggle p-0 link-dark" id="bd-versions" data-toggle="dropdown" aria-expanded="false">
v{{ .Site.Params.docs_version }}
<button class="btn btn-bd-light dropdown-toggle" id="bd-versions" data-toggle="dropdown" aria-expanded="false">
Bootstrap v{{ .Site.Params.docs_version }}
</button>
<div class="dropdown-menu dropdown-menu-md-right" aria-labelledby="bd-versions">
<a class="dropdown-item active" href="/docs/{{ .Site.Params.docs_version }}/">Latest (5.0.x)</a>

1
site/layouts/partials/icons/booticon-chevron-right.svg
View File

@ -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" role="img"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 14l6-6-6-6"/></svg>
Side by Side

Before

Width:  |  Height:  |  Size: 329 B

17
site/static/docs/4.3/assets/scss/_buttons.scss
View File

@ -35,3 +35,20 @@
box-shadow: 0 0 0 3px rgba($bd-download, .25);
}
}
.btn-bd-light {
color: $gray-600;
border-color: $gray-300;
.show > &,
&:hover,
&:active {
color: $bd-purple-bright;
background-color: $white;
border-color: $bd-purple-bright;
}
&:focus {
box-shadow: 0 0 0 3px rgba($bd-purple-bright, .25);
}
}

4
site/static/docs/4.3/assets/scss/_subnav.scss
View File

@ -3,10 +3,6 @@
backdrop-filter: blur(1rem);
box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .05), inset 0 -1px 0 rgba(0, 0, 0, .15);
.booticon {
opacity: .25;
}
.dropdown-menu {
@include font-size(.875rem);
box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .05);