adding 1200px width responsive to docs

This commit is contained in:
davegandy 2013-06-06 12:21:33 -02:30
parent 015860d654
commit 796f930263
8 changed files with 144 additions and 2 deletions

View file

@ -18,7 +18,7 @@
<i class="icon-quote-left icon-4x pull-left icon-muted"></i>
Use a few of the new styles together ... lots of new possibilities.
{% endhighlight %}
<div class="well well-large well-transparent">
<div class="well well-large well-transparent clearfix">
<i class="icon-flag icon-4x pull-left icon-border"></i>
Use a few of the new styles together, and you've got easy pull quotes or a great introductory article image.
Or spinning icons for loading and refreshing content. Or fun big icons in multi-line buttons. You can combine all

View file

@ -8,7 +8,7 @@
<div>
<div class="alert alert-info">
<i class="icon-info-sign icon-2x pull-left margin-top-small padding-right-small"></i>Attribution is no longer required as of Font Awesome 3.0 but is much appreciated:
<i class="icon-info-sign icon-2x pull-left margin-top-small padding-right-small"></i>Attribution is no longer required as of Font Awesome 3.0 but is much appreciated:<br>
<code>Font Awesome by Dave Gandy - http://fontawesome.io</code>.
</div>
</div>

View file

@ -0,0 +1,56 @@
//
// Responsive: Large desktop and up
// --------------------------------------------------
@media (min-width: 1200px) {
#iconCarousel {
@size: 290px;
font-size: @size;
line-height: @size + 5;
.carousel-control {
top: @size + 20px;
.square(30px);
font-size: 40px;
line-height: 35px;
left: 370/2 - 40px;
&.right {
right: 370/2 - 40px;
}
}
}
.jumbotron-index {
padding: 50px 0;
h1 { font-size: 100px; }
p {
font-size: 40px;
margin: 20px 0;
}
.btn-large {
font-size: 30px;
padding: 21px 35px;
}
.shameless-self-promotion {
margin-top: 30px;
}
}
.jumbotron-ad {
padding: 50px 0;
h1 { font-size: 90px; }
p {
font-size: 35px;
margin: 20px 0;
}
}
.stripe-ad .lead { margin-top: 7px; }
.lead {
font-size: 26px;
line-height: 36px;
}
}

View file

@ -0,0 +1,9 @@
//
// Responsive: Landscape phone to desktop/tablet
// --------------------------------------------------
@media (max-width: 767px) {
}

View file

@ -0,0 +1,9 @@
//
// Responsive: Tablet to desktop
// --------------------------------------------------
@media (min-width: 768px) and (max-width: 979px) {
}

View file

@ -0,0 +1,11 @@
//
// Responsive: Navbar
// --------------------------------------------------
// TABLETS AND BELOW
// -----------------
@media (max-width: @navbarCollapseWidth) {
}

View file

@ -0,0 +1,55 @@
---
---
/*!
* Bootstrap Responsive v2.3.2
*
* Copyright 2012 Twitter, Inc
* Licensed under the Apache License v2.0
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
*/
// Responsive.less
// For phone and tablet devices
// -------------------------------------------------------------
// REPEAT VARIABLES & MIXINS
// -------------------------
// Required since we compile the responsive stuff separately
@import "bootstrap-{{ site.bootstrap.version }}/variables.less"; // Modify this for custom colors, font-sizes, etc
@import "bootstrap-{{ site.bootstrap.version }}/mixins.less";
@import "variables.less"; // Modify this for custom colors, font-sizes, etc
// RESPONSIVE CLASSES
// ------------------
@import "bootstrap-{{ site.bootstrap.version }}/responsive-utilities.less";
// MEDIA QUERIES
// ------------------
// Large desktops
@import "bootstrap-{{ site.bootstrap.version }}/responsive-1200px-min.less";
@import "responsive-1200px-min.less";
// Tablets to regular desktops
@import "bootstrap-{{ site.bootstrap.version }}/responsive-768px-979px.less";
@import "responsive-768px-979px.less";
// Phones to portrait tablets and narrow desktops
@import "bootstrap-{{ site.bootstrap.version }}/responsive-767px-max.less";
@import "responsive-767px-max.less";
// RESPONSIVE NAVBAR
// ------------------
// From 979px and below, show a button to toggle navbar contents
@import "bootstrap-{{ site.bootstrap.version }}/responsive-navbar.less";
@import "responsive-navbar.less";

View file

@ -347,3 +347,5 @@ footer {
&.dropdown-split-right > a { padding-left: 7px; }
&.dropdown-split-left > a { padding-right: 0; }
}
@import "responsive.less";