From 39a258ddfe91a509ff4448dda414f132069d1fa8 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 30 May 2017 12:03:24 -0700 Subject: [PATCH] redo button styles - rename .btn-bs to .btn-bd-purple - abstract yellow masthead button into .btn-bd-yellow and use it the new docs navbar --- _includes/nav-home.html | 2 +- assets/scss/_buttons.scss | 16 ++++++++++++++-- assets/scss/_masthead.scss | 9 --------- docs/4.0/getting-started/download.md | 4 ++-- index.html | 12 ++++++------ 5 files changed, 23 insertions(+), 20 deletions(-) diff --git a/_includes/nav-home.html b/_includes/nav-home.html index 409077b084..834b6061ad 100644 --- a/_includes/nav-home.html +++ b/_includes/nav-home.html @@ -61,5 +61,5 @@ - Download + Download diff --git a/assets/scss/_buttons.scss b/assets/scss/_buttons.scss index a7fa5a4c18..82027459fa 100644 --- a/assets/scss/_buttons.scss +++ b/assets/scss/_buttons.scss @@ -2,16 +2,28 @@ // // Custom buttons for the docs. -.btn-bs { +.btn-bd-purple { font-weight: 500; color: $bd-purple-bright; border-color: $bd-purple-bright; &:hover, - &:focus, &:active { color: #fff; background-color: $bd-purple-bright; border-color: $bd-purple-bright; } } + +.btn-bd-yellow { + font-weight: 500; + color: $bd-yellow; + border-color: $bd-yellow; + + &:hover, + &:active { + color: $bd-graphite; + background-color: $bd-yellow; + border-color: $bd-yellow; + } +} diff --git a/assets/scss/_masthead.scss b/assets/scss/_masthead.scss index a457cb0e18..ba3a945d88 100644 --- a/assets/scss/_masthead.scss +++ b/assets/scss/_masthead.scss @@ -36,15 +36,6 @@ padding: 1rem 2rem; font-size: 1.25rem; font-weight: 500; - color: $bd-yellow; - border-color: $bd-yellow; - - &:hover, - &:focus { - color: $bd-graphite; - background-color: $bd-yellow; - border-color: $bd-yellow; - } } .carbonad { diff --git a/docs/4.0/getting-started/download.md b/docs/4.0/getting-started/download.md index 75e3609a54..9af5392701 100644 --- a/docs/4.0/getting-started/download.md +++ b/docs/4.0/getting-started/download.md @@ -12,12 +12,12 @@ toc: true **Current version:** v{{ site.current_version}} -Download Bootstrap +Download Bootstrap ## Source files **Want to compile Bootstrap with your project's asset pipeline?** Choose this option to download our source Sass, JavaScript, and documentation files. Requires a Sass compiler, [Autoprefixer](https://github.com/postcss/autoprefixer), [postcss-flexbugs-fixes](https://github.com/luisrudge/postcss-flexbugs-fixes), and [some setup]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/build-tools/#tooling-setup). -Download source +Download source ## Bootstrap CDN diff --git a/index.html b/index.html index 559d5063ce..42b8980a82 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ layout: home {% include icons/bootstrap.svg class="mb-3" width="128" height="128" %}

Bootstrap is the most popular HTML, CSS, and JS framework in the world for building responsive, mobile-first projects on the web.

- Download Bootstrap + Download Bootstrap

Currently v{{ site.current_version }}

{% include ads.html %} @@ -24,7 +24,7 @@ layout: home

Managed dependencies

Include Bootstrap's source Sass and JavaScript files via Bower, Composer, Meteor, or npm. Package managed installs don't include documentation, but do include our build system and readme.

- View install methods + View install methods

@@ -42,7 +42,7 @@ layout: home

Looking for something else? Compiled builds of Bootstrap's CSS and JS are also available.

- More download options + More download options
@@ -72,7 +72,7 @@ layout: home

Bootstrap is open source! It's hosted, developed, and maintained on GitHub by folks like you.

- View the GitHub project + View the GitHub project @@ -84,7 +84,7 @@ layout: home

- Browse themes + Browse themes

Bootstrap Themes @@ -109,6 +109,6 @@ layout: home

We showcase dozens of inspiring projects built with Bootstrap on the Bootstrap Expo.

- Explore the Expo + Explore the Expo -- 2.47.2