You are here

Home » API reference » Sassy 7.3

docs.css in Sassy 7.3 

/* Add additional stylesheets below
-------------------------------------------------- */
/*
  Bootstrap's documentation styles
  Special styles for presenting Bootstrap's documentation and examples
*/

/* Body and structure
-------------------------------------------------- */
body {
  background-color: #fff;
  position: relative;
}
section {
  padding-top: 60px;
}
section > .row {
  margin-bottom: 10px;
}


/* Jumbotrons
-------------------------------------------------- */
.jumbotron {
  min-width: 940px;
  padding-top: 40px;
}
.jumbotron .inner {
  background: transparent url(../img/grid-18px.png) top center;
  padding: 45px 0;
  -webkit-box-shadow: inset 0 10px 30px rgba(0,0,0,.3);
     -moz-box-shadow: inset 0 10px 30px rgba(0,0,0,.3);
/*          box-shadow: inset 0 10px 30px rgba(0,0,0,.3);
*/}
.jumbotron h1,
.jumbotron p {
  margin-bottom: 9px;
  color: #fff;
  text-align: center;
  text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
.jumbotron h1 {
  font-size: 54px;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
}
.jumbotron p {
  font-weight: 300;
}
.jumbotron .lead {
  font-size: 20px;
  line-height: 27px;
}
.jumbotron p a {
  color: #fff;
  font-weight: bold;
}

/* Specific jumbotrons
------------------------- */
/* main docs page */
.masthead {
  background-color: #049cd9;
  background-repeat: no-repeat;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9));
  background-image: -webkit-linear-gradient(#004D9F, #049cd9);
  background-image: -moz-linear-gradient(#004D9F, #049cd9);
  background-image: -o-linear-gradient(top, #004D9F, #049cd9);
  background-image: -khtml-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9));
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004D9F', endColorstr='#049cd9', GradientType=0); /* IE8 and down */
}
/* supporting docs pages */
.subhead {
  background-color: #767d80;
  background-repeat: no-repeat;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#565d60), to(#767d80));
  background-image: -webkit-linear-gradient(#565d60, #767d80);
  background-image: -moz-linear-gradient(#565d60, #767d80);
  background-image: -o-linear-gradient(top, #565d60, #767d80);
  background-image: -khtml-gradient(linear, left top, left bottom, from(#565d60), to(#767d80));
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#565d60', endColorstr='#767d80', GradientType=0); /* IE8 and down */
}
.subhead .inner {
  padding: 36px 0 27px;
}
.subhead h1,
.subhead p {
  text-align: left;
}
.subhead h1 {
  font-size: 40px;
}
.subhead p a {
  font-weight: normal;
}


/* Footer
-------------------------------------------------- */
.footer {
  background-color: #eee;
  min-width: 940px;
  padding: 30px 0;
  text-shadow: 0 1px 0 #fff;
  border-top: 1px solid #e5e5e5;
  -webkit-box-shadow: inset 0 5px 15px rgba(0,0,0,.025);
     -moz-box-shadow: inset 0 5px 15px rgba(0,0,0,.025);
/*          box-shadow: inset 0 5px 15px rgba(0,0,0,.025);
*/}
.footer p {
  color: #555;
}


/* Quickstart section for getting le code
-------------------------------------------------- */
.quickstart {
  background-color: #f5f5f5;
  background-repeat: repeat-x;
  background-image: -khtml-gradient(linear, left top, left bottom, from(#f9f9f9), to(#f5f5f5));
  background-image: -moz-linear-gradient(#f9f9f9, #f5f5f5);
  background-image: -ms-linear-gradient(#f9f9f9, #f5f5f5);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #f5f5f5));
  background-image: -webkit-linear-gradient(#f9f9f9, #f5f5f5);
  background-image: -o-linear-gradient(#f9f9f9, #f5f5f5);
  -ms-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);
  border-top: 1px solid #fff;
  border-bottom: 1px solid #eee;
}
.quickstart .container {
  margin-bottom: 0;
}
.quickstart .row {
  margin: 0 -20px;
  -webkit-box-shadow: 1px 0 0 #f9f9f9;
     -moz-box-shadow: 1px 0 0 #f9f9f9;
          box-shadow: 1px 0 0 #f9f9f9;
}
.quickstart [class*="span"] {
  width: 285px;
  height: 117px;
  margin-left: 0;
  padding: 17px 20px 26px;
  border-left: 1px solid #eee;
  -webkit-box-shadow: inset 1px 0 0 #f9f9f9;
     -moz-box-shadow: inset 1px 0 0 #f9f9f9;
          box-shadow: inset 1px 0 0 #f9f9f9;
}
.quickstart [class*="span"]:last-child {
  border-right: 1px solid #eee;
  width: 286px;
}
.quickstart h6,
.quickstart p {
  line-height: 18px;
  text-align: center;
  margin-bottom: 9px;
  color: #333;
}
.quickstart .current-version,
.quickstart .current-version a {
  color: #999;
}
.quickstart h6 {
  color: #999;
}
.quickstart textarea {
  display: block;
  width: 275px;
  height: auto;
  margin: 0 0 9px;
  line-height: 21px;
  white-space: nowrap;
  overflow: hidden;
}


/* Special grid styles
-------------------------------------------------- */
.show-grid {
  margin-top: 10px;
  margin-bottom: 10px;
}
.show-grid [class*="span"] {
  background: #eee;
  text-align: center;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  min-height: 30px;
  line-height: 30px;
}
.show-grid:hover [class*="span"] {
  background: #ddd;
}
.show-grid .show-grid {
  margin-top: 0;
  margin-bottom: 0;
}
.show-grid .show-grid [class*="span"] {
  background-color: #ccc;
}


/* Render mini layout previews
-------------------------------------------------- */
.mini-layout {
  border: 1px solid #ddd;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075);
     -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075);
          box-shadow: 0 1px 2px rgba(0,0,0,.075);
}
.mini-layout {
  height: 240px;
  margin-bottom: 20px;
  padding: 9px;
}
.mini-layout div {
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}
.mini-layout .mini-layout-body {
  background-color: #dceaf4;
  margin: 0 auto;
  width: 240px;
  height: 240px;
}
.mini-layout.fluid .mini-layout-sidebar,
.mini-layout.fluid .mini-layout-header,
.mini-layout.fluid .mini-layout-body {
  float: left;
}
.mini-layout.fluid .mini-layout-sidebar {
  background-color: #bbd8e9;
  width: 90px;
  height: 240px;
}
.mini-layout.fluid .mini-layout-body {
  width: 300px;
  margin-left: 10px;
}


/* Topbar special styles
-------------------------------------------------- */
.topbar-wrapper {
  position: relative;
  height: 40px;
  margin: 5px 0 15px;
}
.topbar-wrapper .topbar {
  position: absolute;
  margin: 0 -20px;
}
.topbar-wrapper .topbar .topbar-inner {
  padding-left: 20px;
  padding-right: 20px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}

/* Topbar in js docs
------------------------- */
#bootstrap-js .topbar-wrapper {
  z-index: 1;
}
#bootstrap-js .topbar-wrapper .topbar {
  position: absolute;
  margin: 0 -20px;
}
#bootstrap-js .topbar-wrapper .topbar .topbar-inner {
  padding-left: 20px;
  padding-right: 20px;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
#bootstrap-js .topbar-wrapper .container {
  width: auto;
}


/* Popover docs
-------------------------------------------------- */
.popover-well {
  min-height: 160px;
}
.popover-well .popover {
  display: block;
}
.popover-well .popover-wrapper {
  width: 50%;
  height: 160px;
  float: left;
  margin-left: 55px;
  position: relative;
}
.popover-well .popover-menu-wrapper {
  height: 80px;
}
img.large-bird {
  margin: 5px 0 0 310px;
  opacity: .1;
}

/* Pretty Print
-------------------------------------------------- */
pre.prettyprint {
  overflow: hidden;
}

File

sassy_bootstrap/bootstrap/docs/assets/css/docs.css
View source 
  1. /* Add additional stylesheets below

  2. -------------------------------------------------- */

  3. /*

  4.   Bootstrap's documentation styles

  5.   Special styles for presenting Bootstrap's documentation and examples

  6. */

  7. 

  8. /* Body and structure

  9. -------------------------------------------------- */

  10. body {

  11.   background-color: #fff;

  12.   position: relative;

  13. }

  14. section {

  15.   padding-top: 60px;

  16. }

  17. section > .row {

  18.   margin-bottom: 10px;

  19. }

  20. 

  21. 

  22. /* Jumbotrons

  23. -------------------------------------------------- */

  24. .jumbotron {

  25.   min-width: 940px;

  26.   padding-top: 40px;

  27. }

  28. .jumbotron .inner {

  29.   background: transparent url(../img/grid-18px.png) top center;

  30.   padding: 45px 0;

  31.   -webkit-box-shadow: inset 0 10px 30px rgba(0,0,0,.3);

  32.      -moz-box-shadow: inset 0 10px 30px rgba(0,0,0,.3);

  33. /*          box-shadow: inset 0 10px 30px rgba(0,0,0,.3);

  34. */}

  35. .jumbotron h1,

  36. .jumbotron p {

  37.   margin-bottom: 9px;

  38.   color: #fff;

  39.   text-align: center;

  40.   text-shadow: 0 1px 1px rgba(0,0,0,.3);

  41. }

  42. .jumbotron h1 {

  43.   font-size: 54px;

  44.   line-height: 1;

  45.   text-shadow: 0 1px 2px rgba(0,0,0,.5);

  46. }

  47. .jumbotron p {

  48.   font-weight: 300;

  49. }

  50. .jumbotron .lead {

  51.   font-size: 20px;

  52.   line-height: 27px;

  53. }

  54. .jumbotron p a {

  55.   color: #fff;

  56.   font-weight: bold;

  57. }

  58. 

  59. /* Specific jumbotrons

  60. ------------------------- */

  61. /* main docs page */

  62. .masthead {

  63.   background-color: #049cd9;

  64.   background-repeat: no-repeat;

  65.   background-image: -webkit-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9));

  66.   background-image: -webkit-linear-gradient(#004D9F, #049cd9);

  67.   background-image: -moz-linear-gradient(#004D9F, #049cd9);

  68.   background-image: -o-linear-gradient(top, #004D9F, #049cd9);

  69.   background-image: -khtml-gradient(linear, left top, left bottom, from(#004D9F), to(#049cd9));

  70.   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004D9F', endColorstr='#049cd9', GradientType=0); /* IE8 and down */

  71. }

  72. /* supporting docs pages */

  73. .subhead {

  74.   background-color: #767d80;

  75.   background-repeat: no-repeat;

  76.   background-image: -webkit-gradient(linear, left top, left bottom, from(#565d60), to(#767d80));

  77.   background-image: -webkit-linear-gradient(#565d60, #767d80);

  78.   background-image: -moz-linear-gradient(#565d60, #767d80);

  79.   background-image: -o-linear-gradient(top, #565d60, #767d80);

  80.   background-image: -khtml-gradient(linear, left top, left bottom, from(#565d60), to(#767d80));

  81.   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#565d60', endColorstr='#767d80', GradientType=0); /* IE8 and down */

  82. }

  83. .subhead .inner {

  84.   padding: 36px 0 27px;

  85. }

  86. .subhead h1,

  87. .subhead p {

  88.   text-align: left;

  89. }

  90. .subhead h1 {

  91.   font-size: 40px;

  92. }

  93. .subhead p a {

  94.   font-weight: normal;

  95. }

  96. 

  97. 

  98. /* Footer

  99. -------------------------------------------------- */

  100. .footer {

  101.   background-color: #eee;

  102.   min-width: 940px;

  103.   padding: 30px 0;

  104.   text-shadow: 0 1px 0 #fff;

  105.   border-top: 1px solid #e5e5e5;

  106.   -webkit-box-shadow: inset 0 5px 15px rgba(0,0,0,.025);

  107.      -moz-box-shadow: inset 0 5px 15px rgba(0,0,0,.025);

  108. /*          box-shadow: inset 0 5px 15px rgba(0,0,0,.025);

  109. */}

  110. .footer p {

  111.   color: #555;

  112. }

  113. 

  114. 

  115. /* Quickstart section for getting le code

  116. -------------------------------------------------- */

  117. .quickstart {

  118.   background-color: #f5f5f5;

  119.   background-repeat: repeat-x;

  120.   background-image: -khtml-gradient(linear, left top, left bottom, from(#f9f9f9), to(#f5f5f5));

  121.   background-image: -moz-linear-gradient(#f9f9f9, #f5f5f5);

  122.   background-image: -ms-linear-gradient(#f9f9f9, #f5f5f5);

  123.   background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f9f9f9), color-stop(100%, #f5f5f5));

  124.   background-image: -webkit-linear-gradient(#f9f9f9, #f5f5f5);

  125.   background-image: -o-linear-gradient(#f9f9f9, #f5f5f5);

  126.   -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0)";

  127.   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#f5f5f5', GradientType=0);

  128.   background-image: linear-gradient(#f9f9f9, #f5f5f5);

  129.   border-top: 1px solid #fff;

  130.   border-bottom: 1px solid #eee;

  131. }

  132. .quickstart .container {

  133.   margin-bottom: 0;

  134. }

  135. .quickstart .row {

  136.   margin: 0 -20px;

  137.   -webkit-box-shadow: 1px 0 0 #f9f9f9;

  138.      -moz-box-shadow: 1px 0 0 #f9f9f9;

  139.           box-shadow: 1px 0 0 #f9f9f9;

  140. }

  141. .quickstart [class*="span"] {

  142.   width: 285px;

  143.   height: 117px;

  144.   margin-left: 0;

  145.   padding: 17px 20px 26px;

  146.   border-left: 1px solid #eee;

  147.   -webkit-box-shadow: inset 1px 0 0 #f9f9f9;

  148.      -moz-box-shadow: inset 1px 0 0 #f9f9f9;

  149.           box-shadow: inset 1px 0 0 #f9f9f9;

  150. }

  151. .quickstart [class*="span"]:last-child {

  152.   border-right: 1px solid #eee;

  153.   width: 286px;

  154. }

  155. .quickstart h6,

  156. .quickstart p {

  157.   line-height: 18px;

  158.   text-align: center;

  159.   margin-bottom: 9px;

  160.   color: #333;

  161. }

  162. .quickstart .current-version,

  163. .quickstart .current-version a {

  164.   color: #999;

  165. }

  166. .quickstart h6 {

  167.   color: #999;

  168. }

  169. .quickstart textarea {

  170.   display: block;

  171.   width: 275px;

  172.   height: auto;

  173.   margin: 0 0 9px;

  174.   line-height: 21px;

  175.   white-space: nowrap;

  176.   overflow: hidden;

  177. }

  178. 

  179. 

  180. /* Special grid styles

  181. -------------------------------------------------- */

  182. .show-grid {

  183.   margin-top: 10px;

  184.   margin-bottom: 10px;

  185. }

  186. .show-grid [class*="span"] {

  187.   background: #eee;

  188.   text-align: center;

  189.   -webkit-border-radius: 3px;

  190.      -moz-border-radius: 3px;

  191.           border-radius: 3px;

  192.   min-height: 30px;

  193.   line-height: 30px;

  194. }

  195. .show-grid:hover [class*="span"] {

  196.   background: #ddd;

  197. }

  198. .show-grid .show-grid {

  199.   margin-top: 0;

  200.   margin-bottom: 0;

  201. }

  202. .show-grid .show-grid [class*="span"] {

  203.   background-color: #ccc;

  204. }

  205. 

  206. 

  207. /* Render mini layout previews

  208. -------------------------------------------------- */

  209. .mini-layout {

  210.   border: 1px solid #ddd;

  211.   -webkit-border-radius: 6px;

  212.      -moz-border-radius: 6px;

  213.           border-radius: 6px;

  214.   -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075);

  215.      -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075);

  216.           box-shadow: 0 1px 2px rgba(0,0,0,.075);

  217. }

  218. .mini-layout {

  219.   height: 240px;

  220.   margin-bottom: 20px;

  221.   padding: 9px;

  222. }

  223. .mini-layout div {

  224.   -webkit-border-radius: 3px;

  225.      -moz-border-radius: 3px;

  226.           border-radius: 3px;

  227. }

  228. .mini-layout .mini-layout-body {

  229.   background-color: #dceaf4;

  230.   margin: 0 auto;

  231.   width: 240px;

  232.   height: 240px;

  233. }

  234. .mini-layout.fluid .mini-layout-sidebar,

  235. .mini-layout.fluid .mini-layout-header,

  236. .mini-layout.fluid .mini-layout-body {

  237.   float: left;

  238. }

  239. .mini-layout.fluid .mini-layout-sidebar {

  240.   background-color: #bbd8e9;

  241.   width: 90px;

  242.   height: 240px;

  243. }

  244. .mini-layout.fluid .mini-layout-body {

  245.   width: 300px;

  246.   margin-left: 10px;

  247. }

  248. 

  249. 

  250. /* Topbar special styles

  251. -------------------------------------------------- */

  252. .topbar-wrapper {

  253.   position: relative;

  254.   height: 40px;

  255.   margin: 5px 0 15px;

  256. }

  257. .topbar-wrapper .topbar {

  258.   position: absolute;

  259.   margin: 0 -20px;

  260. }

  261. .topbar-wrapper .topbar .topbar-inner {

  262.   padding-left: 20px;

  263.   padding-right: 20px;

  264.   -webkit-border-radius: 4px;

  265.      -moz-border-radius: 4px;

  266.           border-radius: 4px;

  267. }

  268. 

  269. /* Topbar in js docs

  270. ------------------------- */

  271. #bootstrap-js .topbar-wrapper {

  272.   z-index: 1;

  273. }

  274. #bootstrap-js .topbar-wrapper .topbar {

  275.   position: absolute;

  276.   margin: 0 -20px;

  277. }

  278. #bootstrap-js .topbar-wrapper .topbar .topbar-inner {

  279.   padding-left: 20px;

  280.   padding-right: 20px;

  281.   -webkit-border-radius: 4px;

  282.      -moz-border-radius: 4px;

  283.           border-radius: 4px;

  284. }

  285. #bootstrap-js .topbar-wrapper .container {

  286.   width: auto;

  287. }

  288. 

  289. 

  290. /* Popover docs

  291. -------------------------------------------------- */

  292. .popover-well {

  293.   min-height: 160px;

  294. }

  295. .popover-well .popover {

  296.   display: block;

  297. }

  298. .popover-well .popover-wrapper {

  299.   width: 50%;

  300.   height: 160px;

  301.   float: left;

  302.   margin-left: 55px;

  303.   position: relative;

  304. }

  305. .popover-well .popover-menu-wrapper {

  306.   height: 80px;

  307. }

  308. img.large-bird {

  309.   margin: 5px 0 0 310px;

  310.   opacity: .1;

  311. }

  312. 

  313. /* Pretty Print

  314. -------------------------------------------------- */

  315. pre.prettyprint {

  316.   overflow: hidden;

  317. }