root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 1 Packages Projects Releases Wiki Activity

redo hella docs scss 

- clean out commented out code
- break apart homepage.scss into sub files by component
- rename a few files to reflect their new component names
This commit is contained in:
Mark Otto 2015-08-17 21:31:17 -07:00
parent 38efe5ae59
commit b68acc8938
12 changed files with 277 additions and 381 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
docs/assets/scss/_component-examples.scss
View File

@ -149,16 +149,6 @@
margin-left: .5rem;
}
}
// .bd-example > .img-circle,
// .bd-example > .img-rounded,
// .bd-example > .img-thumbnail {
// margin: .25rem;
// }
// Tables
// .bd-example > .table-responsive > .table {
// background-color: #fff;
// }
// Buttons
.bd-example > .btn-group {

59
docs/assets/scss/_layout.scss → docs/assets/scss/_content.scss
View File

@ -1,3 +1,7 @@
//
// Automatically style Markdown-based tables like a Bootstrap `.table`.
//
.bd-content {
> table {
display: block;
@ -32,61 +36,6 @@
}
}
.bd-pageheader {
padding: 2rem .75rem;
margin-bottom: 1.5rem;
color: $bd-purple-light;
text-align: center;
background-color: $bd-purple;
.container {
position: relative;
}
h1 {
font-size: 3rem;
font-weight: normal;
color: #fff;
}
p {
margin-bottom: 0;
font-size: 1.5rem;
}
@include media-breakpoint-up(sm) {
padding-top: 4rem;
padding-bottom: 4rem;
margin-bottom: 3rem;
text-align: left;
.carbonad {
margin: 2rem 0 0 !important;
}
}
@include media-breakpoint-up(md) {
h1 {
font-size: 4rem;
}
}
@include media-breakpoint-up(lg) {
h1,
p {
margin-right: 380px;
}
.carbonad {
position: absolute;
top: 0;
right: .75rem; // offset from the .container's padding
margin: 0 !important;
}
}
}
//
// Docs sections
//

21
docs/assets/scss/_featured-sites.scss Normal file
View File

@ -0,0 +1,21 @@
.bd-featured-sites {
margin-right: -1px;
margin-left: -1px;
}
.bd-featured-sites .col-xs-6 {
padding: 1px;
}
.bd-featured-sites .img-responsive {
margin-top: 0;
}
@media (min-width: 768px) {
.bd-featured-sites .col-sm-3:first-child img {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.bd-featured-sites .col-sm-3:last-child img {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
}

81
docs/assets/scss/_featurettes.scss Normal file
View File

@ -0,0 +1,81 @@
.bd-featurette {
padding-top: 3rem;
padding-bottom: 3rem;
font-size: 1rem;
line-height: 1.5;
color: #555;
// text-align: center;
background-color: #fff;
border-top: 1px solid #eee;
.highlight {
text-align: left;
}
@include media-breakpoint-up(md) {
.col-sm-6:first-child {
padding-right: ($grid-gutter-width * 1.5);
};
.col-sm-6:last-child {
padding-left: ($grid-gutter-width * 1.5);
}
}
}
.bd-featurette-title {
margin-bottom: .5rem;
font-size: 2rem;
font-weight: normal;
color: #333;
+ .lead {
font-size: 1.5rem;
margin-bottom: 2rem;
}
}
.half-rule {
width: 6rem;
margin: 2.5rem 0;
}
.bd-featurette h4 {
margin-top: 1rem;
margin-bottom: .5rem;
font-weight: normal;
color: #333;
}
.bd-featurette-img {
display: block;
margin-bottom: 1.25rem;
color: #333;
}
.bd-featurette-img:hover {
color: $brand-primary;
text-decoration: none;
}
.bd-featurette-img img {
display: block;
margin-bottom: 1rem;
}
@media (min-width: 480px) {
.bd-featurette .img-responsive {
margin-top: 2rem;
}
}
@media (min-width: 768px) {
.bd-featurette {
padding-top: 6rem;
padding-bottom: 6rem;
}
.bd-featurette-title {
font-size: 2.5rem;
}
.bd-featurette .lead {
max-width: 80%;
// margin-right: auto;
// margin-left: auto;
}
.bd-featurette .img-responsive {
margin-top: 0;
}
}

236
docs/assets/scss/_homepage.scss
View File

@ -1,236 +0,0 @@
//
// Main navbar
//
.bd-navbar {
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 0;
// background-color: $bd-graphite;
.nav-link {
color: $bd-graphite-light;
&.active,
&:hover,
&:focus {
color: $gray-dark;
background-color: transparent;
}
&.active {
font-weight: 500;
}
}
}
//
// Masthead (headings and download button)
//
.bd-masthead {
position: relative;
padding: ($grid-gutter-width / 2);
color: $bd-purple-light;
text-align: center;
background: -webkit-linear-gradient(135deg, darken($bd-purple, 20%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
background: linear-gradient(135deg, darken($bd-purple, 20%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
.bd-booticon {
margin: 0 auto 2rem;
color: $bd-purple-light;
border-color: $bd-purple-light;
}
h1 {
font-weight: 300;
line-height: 1;
}
.lead {
margin-left: auto;
margin-right: auto;
margin-bottom: 2rem;
font-size: 1rem;
color: #fff;
}
.version {
margin-top: -1rem;
margin-bottom: 2rem;
}
.btn {
width: 100%;
padding: 1rem 2rem;
font-size: 1.25rem;
font-weight: 500;
color: $bd-yellow;
border-color: $bd-yellow;
&:hover {
color: $bd-graphite;
background-color: $bd-yellow;
border-color: $bd-yellow;
}
}
.carbonad {
margin-bottom: -2rem !important;
}
@include media-breakpoint-up(sm) {
padding-top: 8rem;
padding-bottom: 2rem;
.btn {
width: auto;
}
.carbonad {
margin-bottom: 0 !important;
}
}
@include media-breakpoint-up(md) {
padding-bottom: 4rem;
.bd-header {
margin-bottom: 4rem;
}
h1 {
font-size: 4rem;
}
.lead {
font-size: 1.5rem;
}
.carbonad {
margin-top: 3rem !important;
}
}
@include media-breakpoint-up(lg) {
.lead {
width: 85%;
font-size: 2rem;
}
}
}
//
// Homepage featurettes
//
.bd-featurette {
padding-top: 3rem;
padding-bottom: 3rem;
font-size: 1rem;
line-height: 1.5;
color: #555;
// text-align: center;
background-color: #fff;
border-top: 1px solid #eee;
.highlight {
text-align: left;
}
@include media-breakpoint-up(md) {
.col-sm-6:first-child {
padding-right: ($grid-gutter-width * 1.5);
};
.col-sm-6:last-child {
padding-left: ($grid-gutter-width * 1.5);
}
}
}
.bd-featurette-title {
margin-bottom: .5rem;
font-size: 2rem;
font-weight: normal;
color: #333;
+ .lead {
font-size: 1.5rem;
margin-bottom: 2rem;
}
}
.half-rule {
width: 6rem;
margin: 2.5rem 0;
}
.bd-featurette h4 {
margin-top: 1rem;
margin-bottom: .5rem;
font-weight: normal;
color: #333;
}
.bd-featurette-img {
display: block;
margin-bottom: 1.25rem;
color: #333;
}
.bd-featurette-img:hover {
color: $brand-primary;
text-decoration: none;
}
.bd-featurette-img img {
display: block;
margin-bottom: 1rem;
}
@media (min-width: 480px) {
.bd-featurette .img-responsive {
margin-top: 2rem;
}
}
@media (min-width: 768px) {
.bd-featurette {
padding-top: 6rem;
padding-bottom: 6rem;
}
.bd-featurette-title {
font-size: 2.5rem;
}
.bd-featurette .lead {
max-width: 80%;
// margin-right: auto;
// margin-left: auto;
}
.bd-featurette .img-responsive {
margin-top: 0;
}
}
//
// Featured Expo sites
//
.bd-featured-sites {
margin-right: -1px;
margin-left: -1px;
}
.bd-featured-sites .col-xs-6 {
padding: 1px;
}
.bd-featured-sites .img-responsive {
margin-top: 0;
}
@media (min-width: 768px) {
.bd-featured-sites .col-sm-3:first-child img {
border-top-left-radius: .25rem;
border-bottom-left-radius: .25rem;
}
.bd-featured-sites .col-sm-3:last-child img {
border-top-right-radius: .25rem;
border-bottom-right-radius: .25rem;
}
}

91
docs/assets/scss/_masthead.scss Normal file
View File

@ -0,0 +1,91 @@
.bd-masthead {
position: relative;
padding: ($grid-gutter-width / 2);
color: $bd-purple-light;
text-align: center;
background: -webkit-linear-gradient(135deg, darken($bd-purple, 20%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
background: linear-gradient(135deg, darken($bd-purple, 20%), $bd-purple, lighten(saturate($bd-purple, 5%), 15%));
.bd-booticon {
margin: 0 auto 2rem;
color: $bd-purple-light;
border-color: $bd-purple-light;
}
h1 {
font-weight: 300;
line-height: 1;
}
.lead {
margin-left: auto;
margin-right: auto;
margin-bottom: 2rem;
font-size: 1rem;
color: #fff;
}
.version {
margin-top: -1rem;
margin-bottom: 2rem;
}
.btn {
width: 100%;
padding: 1rem 2rem;
font-size: 1.25rem;
font-weight: 500;
color: $bd-yellow;
border-color: $bd-yellow;
&:hover {
color: $bd-graphite;
background-color: $bd-yellow;
border-color: $bd-yellow;
}
}
.carbonad {
margin-bottom: -2rem !important;
}
@include media-breakpoint-up(sm) {
padding-top: 8rem;
padding-bottom: 2rem;
.btn {
width: auto;
}
.carbonad {
margin-bottom: 0 !important;
}
}
@include media-breakpoint-up(md) {
padding-bottom: 4rem;
.bd-header {
margin-bottom: 4rem;
}
h1 {
font-size: 4rem;
}
.lead {
font-size: 1.5rem;
}
.carbonad {
margin-top: 3rem !important;
}
}
@include media-breakpoint-up(lg) {
.lead {
width: 85%;
font-size: 2rem;
}
}
}

25
docs/assets/scss/_nav.scss Normal file
View File

@ -0,0 +1,25 @@
//
// Main navbar
//
.bd-navbar {
padding-top: 1rem;
padding-bottom: 1rem;
margin-bottom: 0;
// background-color: $bd-graphite;
.nav-link {
color: $bd-graphite-light;
&.active,
&:hover,
&:focus {
color: $gray-dark;
background-color: transparent;
}
&.active {
font-weight: 500;
}
}
}

82
docs/assets/scss/_page-header.scss
View File

@ -1,45 +1,53 @@
//
// Page headers
//
.bd-pageheader {
padding: 2rem .75rem;
margin-bottom: 1.5rem;
color: $bd-purple-light;
text-align: center;
background-color: $bd-purple;
// .bd-header {
// padding-top: 2rem;
// padding-bottom: 2rem;
// margin-bottom: 2rem;
// text-align: center;
// background-color: $bd-purple;
.container {
position: relative;
}
// .container {
// position: relative;
// }
h1 {
font-size: 3rem;
font-weight: normal;
color: #fff;
}
// h1 {
// margin-top: 0;
// color: #fff;
// }
p {
margin-bottom: 0;
font-size: 1.5rem;
}
// p {
// margin-bottom: 0;
// font-weight: 300;
// color: rgba(255,255,255,.65);
// }
@include media-breakpoint-up(sm) {
padding-top: 4rem;
padding-bottom: 4rem;
margin-bottom: 3rem;
text-align: left;
// @media (min-width: 768px) {
// text-align: left;
.carbonad {
margin: 2rem 0 0 !important;
}
}
// h1 {
// font-size: 4rem;
// line-height: 1;
// }
// }
@include media-breakpoint-up(md) {
h1 {
font-size: 4rem;
}
}
// @media (min-width: 992px) {
// padding-top: 4rem;
// padding-bottom: 4rem;
@include media-breakpoint-up(lg) {
h1,
p {
margin-right: 380px;
}
// h1,
// p {
// margin-right: 380px;
// }
// }
// }
.carbonad {
position: absolute;
top: 0;
right: .75rem; // offset from the .container's padding
margin: 0 !important;
}
}
}

31
docs/assets/scss/_social-buttons.scss
View File

@ -1,31 +0,0 @@
//
// Social buttons
//
.bd-social {
margin-bottom: 1.5rem;
margin-left: -.5rem;
}
.bd-social-buttons {
display: inline-block;
padding-left: 0;
margin-bottom: 0;
list-style: none;
}
.bd-social-buttons li {
display: inline-block;
padding: .25rem .5rem;
line-height: 1;
}
.bd-social-buttons .twitter-follow-button {
width: 225px !important;
}
.bd-social-buttons .twitter-share-button {
width: 98px !important;
}
// Style the GitHub buttons via CSS instead of inline attributes
.github-btn {
overflow: hidden;
border: 0;
}

4
docs/assets/scss/_team.scss
View File

@ -1,7 +1,3 @@
//
// Team members
//
.bd-team {
margin-bottom: 1.5rem;

4
docs/assets/scss/_zeroclipboard.scss
View File

@ -1,6 +1,6 @@
// ZeroClipboard
//
// ZeroClipboard styles
//
// Flash-based `Copy` buttons for code snippets.
.zero-clipboard {
position: relative;

12
docs/assets/scss/docs.scss
View File

@ -38,14 +38,16 @@ $bd-warning: #f0ad4e;
$bd-info: #5bc0de;
// Load docs components
@import "layout";
@import "sidebar";
@import "booticon";
@import "homepage";
@import "nav";
@import "masthead";
@import "featurettes";
@import "featured-sites";
@import "ads";
@import "footer";
@import "social-buttons";
@import "content";
@import "page-header";
@import "sidebar";
@import "footer";
@import "component-examples";
@import "responsive-tests";
@import "buttons";