diff options
Diffstat (limited to 'docs/assets/css/src')
| -rw-r--r-- | docs/assets/css/src/docs.css | 202 |
1 files changed, 135 insertions, 67 deletions
diff --git a/docs/assets/css/src/docs.css b/docs/assets/css/src/docs.css index 65977fead..5323232b9 100644 --- a/docs/assets/css/src/docs.css +++ b/docs/assets/css/src/docs.css @@ -9,27 +9,6 @@ /* * Bootstrap Documentation * Special styles for presenting Bootstrap's documentation and code examples. - * - * Table of contents: - * - * Scaffolding - * Main navigation - * Footer - * Social buttons - * Homepage - * Page headers - * Old docs callout - * Ads - * Side navigation - * Docs sections - * Callouts - * Grid styles - * Examples - * Code snippets (highlight) - * Responsive tests - * Glyphicons - * Customizer - * Miscellaneous */ @@ -249,6 +228,7 @@ body { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6f5499', GradientType=0); background-repeat: repeat-x; } + .bs-docs-masthead .bs-docs-booticon { margin: 0 auto 30px; } @@ -281,8 +261,7 @@ body { @media (min-width: 768px) { .bs-docs-masthead { - padding-top: 80px; - padding-bottom: 80px; + padding: 80px 0; } .bs-docs-masthead h1 { font-size: 60px; @@ -492,16 +471,6 @@ body { margin-bottom: 15px; } -/* Featured sites */ -.bs-docs-featured-sites { - margin-right: -1px; - margin-left: -1px; -} -.bs-docs-featured-sites .col-sm-3 { - padding-right: 1px; - padding-left: 1px; -} - @media (min-width: 480px) { .bs-docs-featurette .img-responsive { margin-top: 30px; @@ -520,6 +489,30 @@ body { margin-right: auto; margin-left: auto; } + .bs-docs-featurette .img-responsive { + margin-top: 0; + } +} + + +/* + * Featured sites + * + * Homepage thumbnails from the Expo. + */ + +.bs-docs-featured-sites { + margin-right: -1px; + margin-left: -1px; +} +.bs-docs-featured-sites .col-xs-6 { + padding: 1px; +} +.bs-docs-featured-sites .img-responsive { + margin-top: 0; +} + +@media (min-width: 768px) { .bs-docs-featured-sites .col-sm-3:first-child img { border-top-left-radius: 4px; border-bottom-left-radius: 4px; @@ -528,9 +521,33 @@ body { border-top-right-radius: 4px; border-bottom-right-radius: 4px; } +} - .bs-docs-featurette .img-responsive { - margin-top: 0; + +/* + * Examples + * + * Linked docs examples. + */ + +.bs-examples .thumbnail { + margin-bottom: 10px; +} +.bs-examples h4 { + margin-bottom: 5px; +} +.bs-examples p { + margin-bottom: 20px; +} + +@media (max-width: 480px) { + .bs-examples { + margin-right: -10px; + margin-left: -10px; + } + .bs-examples > [class^="col-"] { + padding-right: 10px; + padding-left: 10px; } } @@ -680,8 +697,37 @@ body { /* Nav: second level (shown on .active) */ .bs-docs-sidebar .nav .nav { + display: none; /* Hide by default, but at >768px, show it */ + padding-bottom: 10px; +} +.bs-docs-sidebar .nav .nav > li > a { + padding-top: 1px; + padding-bottom: 1px; + padding-left: 30px; + font-size: 12px; + font-weight: normal; +} +.bs-docs-sidebar .nav .nav > li > a:hover, +.bs-docs-sidebar .nav .nav > li > a:focus { + padding-left: 29px; +} +.bs-docs-sidebar .nav .nav > .active > a, +.bs-docs-sidebar .nav .nav > .active:hover > a, +.bs-docs-sidebar .nav .nav > .active:focus > a { + padding-left: 28px; + font-weight: 500; +} + +/* Back to top (hidden on mobile) */ +.back-to-top, +.bs-docs-theme-toggle { display: none; } +.back-to-top:hover, +.bs-docs-theme-toggle:hover { + color: #563d7c; + text-decoration: none; +} .bs-docs-sidebar .nav > .active > .nav { display: block; } @@ -724,7 +770,9 @@ h1[id] { .bs-callout { padding: 20px; margin: 20px 0; - border-left: 3px solid #eee; + border: 1px solid #eee; + border-left-width: 5px; + border-radius: 3px; } .bs-callout h4 { margin-top: 0; @@ -734,28 +782,29 @@ h1[id] { margin-bottom: 0; } .bs-callout code { - background-color: #fff; border-radius: 3px; } +/* Tighten up space between multiple callouts */ +.bs-callout + .bs-callout { + margin-top: -5px; +} + /* Variations */ .bs-callout-danger { - background-color: #fdf7f7; - border-color: #d9534f; + border-left-color: #d9534f; } .bs-callout-danger h4 { color: #d9534f; } .bs-callout-warning { - background-color: #fcf8f2; - border-color: #f0ad4e; + border-left-color: #f0ad4e; } .bs-callout-warning h4 { color: #f0ad4e; } .bs-callout-info { - background-color: #f4f8fa; - border-color: #5bc0de; + border-left-color: #5bc0de; } .bs-callout-info h4 { color: #5bc0de; @@ -893,7 +942,6 @@ h1[id] { position: relative; padding: 45px 15px 15px; margin: 0 -15px 15px; - background-color: #fafafa; border-color: #e5e5e5 #eee #eee; border-style: solid; border-width: 1px 0; @@ -907,7 +955,7 @@ h1[id] { left: 15px; font-size: 12px; font-weight: bold; - color: #bbb; + color: #959595; text-transform: uppercase; letter-spacing: 1px; content: "Example"; @@ -1077,12 +1125,6 @@ h1[id] { .bs-navbar-bottom-example .navbar-fixed-bottom { position: absolute; } - .bs-navbar-top-example { - border-radius: 0 0 4px 4px; - } - .bs-navbar-bottom-example { - border-radius: 4px 4px 0 0; - } } /* Pagination */ @@ -1116,10 +1158,14 @@ h1[id] { } /* Example dropdowns */ +.bs-example > .dropdown > .dropdown-toggle { + float: left; +} .bs-example > .dropdown > .dropdown-menu { position: static; display: block; margin-bottom: 5px; + clear: left; } /* Example tabbable tabs */ @@ -1175,6 +1221,8 @@ h1[id] { padding: 0; margin-top: 0; margin-bottom: 0; + word-break: normal; + word-wrap: nowrap; white-space: nowrap; background-color: transparent; border: 0; @@ -1183,13 +1231,9 @@ h1[id] { font-size: inherit; color: #333; /* Effectively the base text color */ } -.highlight pre .lineno { +.highlight pre code:first-child { display: inline-block; - width: 22px; - padding-right: 5px; - margin-right: 10px; - color: #bebec5; - text-align: right; + padding-right: 45px; } @@ -1491,22 +1535,46 @@ h1[id] { /* - * Miscellaneous - * - * Odds and ends for optimum docs display. + * ZeroClipboard styles */ -/* Examples gallery: space out content better */ -.bs-examples .thumbnail { - margin-bottom: 10px; +.zero-clipboard { + position: relative; + display: none; } -.bs-examples h4 { - margin-bottom: 5px; +.btn-clipboard { + position: absolute; + top: 0; + right: 0; + z-index: 10; + display: block; + padding: 5px 8px; + font-size: 12px; + color: #777; + cursor: pointer; + background-color: #fff; + border: 1px solid #e1e1e8; + border-radius: 0 4px 0 4px; } -.bs-examples p { - margin-bottom: 20px; +.btn-clipboard-hover { + color: #fff; + background-color: #563d7c; + border-color: #563d7c; +} + +@media (min-width: 768px) { + .zero-clipboard { + display: block; + } } + +/* + * Miscellaneous + * + * Odds and ends for optimum docs display. + */ + /* Pseudo :focus state for showing how it looks in the docs */ #focusedInput { border-color: rgb(204,204,204); /* Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback*/ |