updated docs and docs css to not use rgba colors on the layout modules so IE can see that shiz

This commit is contained in:
Mark Otto 2011-08-20 01:11:48 -07:00
parent 4f2b0d8aa4
commit 4a567fcb10
2 changed files with 33 additions and 28 deletions

View File

@ -11,8 +11,7 @@ body {
position: relative; position: relative;
} }
section { section {
padding-top: 80px; padding-top: 60px;
margin-bottom: -40px;
} }
#masthead, #footer { #masthead, #footer {
background-color: #049cd9; background-color: #049cd9;
@ -29,8 +28,8 @@ section {
background: transparent url(../img/grid-18px.png) top center; background: transparent url(../img/grid-18px.png) top center;
padding: 45px 0; padding: 45px 0;
-webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); -moz-box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3);
box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3); box-shadow: inset 0 10px 30px rgba(0, 0, 0, 0.3);
} }
#masthead h1, #masthead h1,
#footer h1, #footer h1,
@ -77,15 +76,14 @@ div.quickstart {
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0)"; -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0)";
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0);
background-image: linear-gradient(#f9f9f9, #f5f5f5); background-image: linear-gradient(#f9f9f9, #f5f5f5);
margin-bottom: -36px;
border-top: 1px solid #fff; border-top: 1px solid #fff;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
div.quickstart div.row { div.quickstart div.row {
margin: 0 -20px; margin: 0 -20px;
-webkit-box-shadow: 1px 0 0 #f9f9f9; -webkit-box-shadow: 1px 0 0 #f9f9f9;
-moz-box-shadow: 1px 0 0 #f9f9f9; -moz-box-shadow: 1px 0 0 #f9f9f9;
box-shadow: 1px 0 0 #f9f9f9; box-shadow: 1px 0 0 #f9f9f9;
} }
div.quickstart div.columns { div.quickstart div.columns {
width: 285px; width: 285px;
@ -94,8 +92,8 @@ div.quickstart div.columns {
padding: 17px 20px 26px; padding: 17px 20px 26px;
border-left: 1px solid #eee; border-left: 1px solid #eee;
-webkit-box-shadow: inset 1px 0 0 #f9f9f9; -webkit-box-shadow: inset 1px 0 0 #f9f9f9;
-moz-box-shadow: inset 1px 0 0 #f9f9f9; -moz-box-shadow: inset 1px 0 0 #f9f9f9;
box-shadow: inset 1px 0 0 #f9f9f9; box-shadow: inset 1px 0 0 #f9f9f9;
} }
div.quickstart div.columns:last-child { div.quickstart div.columns:last-child {
border-right: 1px solid #eee; border-right: 1px solid #eee;
@ -137,10 +135,11 @@ div.quickstart form textarea {
margin-bottom: 20px; margin-bottom: 20px;
} }
.show-grid .column, .show-grid .columns { .show-grid .column, .show-grid .columns {
background: rgba(0, 0, 0, 0.1); background-color: #eee;
text-align: center; text-align: center;
-moz-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; -moz-border-radius: 3px;
border-radius: 3px;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
} }
@ -181,19 +180,21 @@ div.mini-layout {
height: 340px; height: 340px;
margin-bottom: 20px; margin-bottom: 20px;
padding: 9px; padding: 9px;
border: 1px solid rgba(0, 0, 0, 0.25); border: 1px solid #ccc;
-moz-border-radius: 6px; -webkit-border-radius: 6px;
border-radius: 6px; -moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.125);
} }
div.mini-layout div { div.mini-layout div {
-moz-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; -moz-border-radius: 3px;
border-radius: 3px;
} }
div.mini-layout div.mini-layout-body { div.mini-layout div.mini-layout-body {
background-color: rgba(141, 192, 219, 0.25); background-color: #dceaf4;
margin: 0 auto; margin: 0 auto;
width: 450px; width: 450px;
height: 340px; height: 340px;
@ -202,7 +203,7 @@ div.mini-layout.fluid div.mini-layout-sidebar, div.mini-layout.fluid div.mini-la
float: left; float: left;
} }
div.mini-layout.fluid div.mini-layout-sidebar { div.mini-layout.fluid div.mini-layout-sidebar {
background-color: rgba(141, 192, 219, 0.5); background-color: #bbd8e9;
width: 90px; width: 90px;
height: 340px; height: 340px;
} }
@ -222,8 +223,9 @@ div.topbar-wrapper div.topbar {
margin: 0 -20px; margin: 0 -20px;
padding-left: 20px; padding-left: 20px;
padding-right: 20px; padding-right: 20px;
-moz-border-radius: 4px; -webkit-border-radius: 4px;
border-radius: 4px; -moz-border-radius: 4px;
border-radius: 4px;
} }
/* Popover docs /* Popover docs
@ -241,7 +243,7 @@ div.popover-well div.popover-wrapper {
height: 160px; height: 160px;
float: left; float: left;
margin-left: 55px; margin-left: 55px;
position:relative; position: relative;
} }
div.popover-well div.popover-menu-wrapper { div.popover-well div.popover-menu-wrapper {
@ -250,5 +252,5 @@ div.popover-well div.popover-menu-wrapper {
img.large-bird { img.large-bird {
margin: 5px 0 0 310px; margin: 5px 0 0 310px;
opacity:.1; opacity: .1;
} }

View File

@ -4,6 +4,11 @@
<meta charset="utf-8"> <meta charset="utf-8">
<title>Bootstrap, from Twitter</title> <title>Bootstrap, from Twitter</title>
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le styles --> <!-- Le styles -->
<link href="../bootstrap-1.0.0.css" rel="stylesheet"> <link href="../bootstrap-1.0.0.css" rel="stylesheet">
<link href="assets/css/docs.css" rel="stylesheet"> <link href="assets/css/docs.css" rel="stylesheet">
@ -20,9 +25,7 @@
<div class="topbar"> <div class="topbar">
<div class="container fixed"> <div class="container fixed">
<h3><a href="#"> <h3><a href="#">Bootstrap</a></h3>
Bootstrap
</a></h3>
<ul> <ul>
<li class="active"><a href="#masthead">Overview</a></li> <li class="active"><a href="#masthead">Overview</a></li>
<li><a href="#grid-system">Grid</a></li> <li><a href="#grid-system">Grid</a></li>