mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
redo most of the css for the masthead, page headers, and ads
This commit is contained in:
Mark Otto
parent
2d094f9d0f
commit
6b1c9ee8d5
3 changed files with 105 additions and 117 deletions
|
|
@ -6,20 +6,20 @@
|
|||
width: auto !important;
|
||||
height: auto !important;
|
||||
padding: 1.25rem !important;
|
||||
margin: 0 -1rem 2rem !important;
|
||||
overflow: hidden; /* clearfix */
|
||||
margin: 0 -1.5rem 2rem !important;
|
||||
overflow: hidden; // clearfix
|
||||
font-size: .8rem !important;
|
||||
line-height: 1rem !important;
|
||||
color: $gray !important;
|
||||
text-align: left;
|
||||
background: #f5f5f5 !important;
|
||||
border: 0 !important;
|
||||
// border: solid #e5e5e5 !important;
|
||||
// border-width: 1px 0 !important;
|
||||
}
|
||||
|
||||
.carbonad-img {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.carbonad-text,
|
||||
.carbonad-tag {
|
||||
display: block !important;
|
||||
|
|
@ -29,13 +29,16 @@
|
|||
margin-left: 145px !important;
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
|
||||
}
|
||||
|
||||
.carbonad-text {
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
|
||||
.carbonad-tag {
|
||||
color: inherit !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.carbonad-text a,
|
||||
.carbonad-tag a {
|
||||
color: $gray !important;
|
||||
|
|
@ -44,58 +47,17 @@
|
|||
color: $brand-primary !important;
|
||||
}
|
||||
}
|
||||
|
||||
.carbonad #azcarbon > img {
|
||||
display: none; // hide what I assume are tracking images
|
||||
}
|
||||
|
||||
// In the lighter page headers
|
||||
// .bd-header .carbonad {
|
||||
// color: #777;
|
||||
// background-color: #fff !important;
|
||||
// border-color: #eee !important;
|
||||
// }
|
||||
// .bd-header .carbonad-text a,
|
||||
// .bd-header .carbonad-tag a {
|
||||
// color: $bd-purple !important;
|
||||
// }
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
.carbonad {
|
||||
width: 330px !important;
|
||||
margin: 1.5rem auto !important;
|
||||
border-width: 1px !important;
|
||||
padding: 1rem !important;
|
||||
margin-right: auto !important;
|
||||
margin-left: auto !important;
|
||||
border-radius: .25rem;
|
||||
}
|
||||
.bd-masthead .carbonad {
|
||||
margin: 3rem auto 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(md) {
|
||||
.carbonad {
|
||||
margin-right: 0 !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
.carbonad {
|
||||
float: right;
|
||||
width: 330px !important;
|
||||
padding: 1rem !important;
|
||||
margin: .5rem 0 1rem 2rem !important;
|
||||
}
|
||||
.bd-masthead {
|
||||
.carbonad {
|
||||
float: none;
|
||||
margin: 0 auto !important;
|
||||
// color: $bd-purple-light !important;
|
||||
// background: transparent !important;
|
||||
// border: 1px solid #866ab3 !important;
|
||||
}
|
||||
// .carbonad-text a,
|
||||
// .carbonad-tag a {
|
||||
// color: #fff !important;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -50,23 +50,33 @@
|
|||
|
||||
.bd-header-mark {
|
||||
float: left;
|
||||
padding-top: .6em;
|
||||
padding-bottom: .6em;
|
||||
padding-top: .6rem;
|
||||
padding-bottom: .6rem;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-header-nav {
|
||||
float: right;
|
||||
padding-bottom: 1rem;
|
||||
margin-bottom: 2rem;
|
||||
border-bottom: .0625rem solid #eee;
|
||||
|
||||
.nav-link {
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 1.2rem .75rem;
|
||||
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
float: right;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: 0;
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -76,38 +86,33 @@
|
|||
|
||||
.bd-masthead {
|
||||
position: relative;
|
||||
padding: 2rem 0;
|
||||
// color: #cdbfe3;
|
||||
padding: ($grid-gutter-width / 2);
|
||||
text-align: center;
|
||||
// text-shadow: 0 1px 0 rgba(0,0,0,.1);
|
||||
// background-color: #6f5499;
|
||||
// @include gradient-vertical($bd-purple, #6f5499);
|
||||
// background-image: linear-gradient(135deg, #a8b7be, #cdd1d4, #d4d5d7, #cecfd1);
|
||||
}
|
||||
|
||||
.bd-masthead .bd-booticon {
|
||||
.bd-booticon {
|
||||
margin: 0 auto 2rem;
|
||||
color: $gray;
|
||||
border-color: $gray;
|
||||
}
|
||||
.bd-masthead h1 {
|
||||
color: $bd-purple;
|
||||
border-color: $bd-purple;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
// color: #fff;
|
||||
}
|
||||
.bd-masthead .lead {
|
||||
}
|
||||
|
||||
.lead {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 2rem;
|
||||
font-size: 1.25rem;
|
||||
// color: #fff;
|
||||
}
|
||||
.bd-masthead .version {
|
||||
}
|
||||
|
||||
.version {
|
||||
margin-top: -1rem;
|
||||
margin-bottom: 2rem;
|
||||
// color: #9783b9;
|
||||
}
|
||||
.bd-masthead .btn {
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
padding: 1rem 2rem;
|
||||
font-size: 1.25rem;
|
||||
|
|
@ -119,35 +124,51 @@
|
|||
color: #fff;
|
||||
background-color: $gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 480px) {
|
||||
.bd-masthead .btn {
|
||||
.carbonad {
|
||||
margin-bottom: -2rem !important;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
|
||||
.btn {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.bd-masthead {
|
||||
padding: 2rem 0 4rem;
|
||||
// padding: 5rem 0;
|
||||
.carbonad {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(md) {
|
||||
padding-bottom: 4rem;
|
||||
|
||||
.bd-header {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
.bd-masthead h1 {
|
||||
|
||||
h1 {
|
||||
font-size: 4rem;
|
||||
}
|
||||
.bd-masthead .lead {
|
||||
|
||||
.lead {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.bd-masthead .lead {
|
||||
.carbonad {
|
||||
margin-top: 3rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(lg) {
|
||||
.lead {
|
||||
width: 80%;
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -9,12 +9,17 @@
|
|||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
|
||||
@media (min-width: 768px) {
|
||||
@include media-breakpoint-up(md) {
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding: 4rem;
|
||||
|
||||
.carbonad {
|
||||
float: right !important;
|
||||
margin: .5rem 0 1rem 2rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
> table {
|
||||
|
|
|
|||
Loading…
Reference in a new issue