Convert to SCSS. Pass 1

less/accordion.less → less/accordion.scss

@@ -4,14 +4,14 @@
 
 // Parent container
 .accordion {
-  margin-bottom: @baseLineHeight;
+  margin-bottom: $baseLineHeight;
 }
 
 // Group == heading + body
 .accordion-group {
   margin-bottom: 2px;
   border: 1px solid #e5e5e5;
-  .border-radius(4px);
+  @include border-radius(4px);
 }
 .accordion-heading {
   border-bottom: 0;

less/alerts.less → less/alerts.scss

@@ -4,15 +4,15 @@
 // Base alert styles
 .alert {
   padding: 8px 35px 8px 14px;
-  margin-bottom: @baseLineHeight;
+  margin-bottom: $baseLineHeight;
   text-shadow: 0 1px 0 rgba(255,255,255,.5);
-  background-color: @warningBackground;
-  border: 1px solid @warningBorder;
-  .border-radius(4px);
+  background-color: $warningBackground;
+  border: 1px solid $warningBorder;
+  @include border-radius(4px);
 }
 .alert,
 .alert-heading {
-  color: @warningText;
+  color: $warningText;
 }
 
 // Adjust close link position
@@ -27,31 +27,31 @@
 // ----------------
 
 .alert-success {
-  background-color: @successBackground;
-  border-color: @successBorder;  
+  background-color: $successBackground;
+  border-color: $successBorder;  
 }
 .alert-success,
 .alert-success .alert-heading {
-  color: @successText;
+  color: $successText;
 }
 .alert-danger,
 .alert-error {
-  background-color: @errorBackground;
-  border-color: @errorBorder;
+  background-color: $errorBackground;
+  border-color: $errorBorder;
 }
 .alert-danger,
 .alert-error,
 .alert-danger .alert-heading,
 .alert-error .alert-heading {
-  color: @errorText;
+  color: $errorText;
 }
 .alert-info {
-  background-color: @infoBackground;
-  border-color: @infoBorder;
+  background-color: $infoBackground;
+  border-color: $infoBorder;
 }
 .alert-info,
 .alert-info .alert-heading {
-  color: @infoText;
+  color: $infoText;
 }
 
 

less/bootstrap.scss

@@ -0,0 +1,62 @@
+/*!
+ * Bootstrap v2.0.0
+ *
+ * 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.
+ */
+
+// CSS Reset
+@import "reset.scss";
+
+// Core variables and mixins
+@import "variables.scss"; // Modify this for custom colors, font-sizes, etc
+@import "mixins.scss";
+
+// Grid system and page structure
+@import "scaffolding.scss";
+@import "grid.scss";
+@import "layouts.scss";
+
+// Base CSS
+@import "type.scss";
+@import "code.scss";
+@import "forms.scss";
+@import "tables.scss";
+
+// Components: common
+@import "sprites.scss";
+@import "dropdowns.scss";
+@import "wells.scss";
+@import "component-animations.scss";
+@import "close.scss";
+
+// Components: Buttons & Alerts
+@import "buttons.scss";
+@import "button-groups.scss";
+@import "alerts.scss"; // Note: alerts share common CSS with buttons and thus have styles in buttons.scss
+
+// Components: Nav
+@import "navs.scss";
+@import "navbar.scss";
+@import "breadcrumbs.scss";
+@import "pagination.scss";
+@import "pager.scss";
+
+// Components: Popovers
+@import "modals.scss";
+@import "tooltip.scss";
+@import "popovers.scss";
+
+// Components: Misc
+@import "thumbnails.scss";
+@import "labels.scss";
+@import "progress-bars.scss";
+@import "accordion.scss";
+@import "carousel.scss";
+@import "hero-unit.scss";
+
+// Utility classes
+@import "utilities.scss"; // Has to be last to override when necessary

less/breadcrumbs.scss

@@ -0,0 +1,22 @@
+// BREADCRUMBS
+// -----------
+
+.breadcrumb {
+  padding: 7px 14px;
+  margin: 0 0 $baseLineHeight;
+  @include gradient-vertical($white, #f5f5f5);
+  border: 1px solid #ddd;
+  @include border-radius(3px);
+  @include box-shadow(inset 0 1px 0 $white);
+  li {
+    display: inline;
+    text-shadow: 0 1px 0 $white;
+  }
+  .divider {
+    padding: 0 5px;
+    color: $grayLight;
+  }
+  .active a {
+    color: $grayDark;
+  }
+}

less/button-groups.less → less/button-groups.scss

@@ -5,8 +5,8 @@
 // Make the div behave like a button
 .btn-group {
   position: relative;
-  .clearfix(); // clears the floated buttons
-  .ie7-restore-left-whitespace();
+  @include clearfix(); // clears the floated buttons
+  @include ie7-restore-left-whitespace();
 }
 
 // Space out series of button groups
@@ -16,11 +16,11 @@
 
 // Optional: Group multiple button groups together for a toolbar
 .btn-toolbar {
-  margin-top: @baseLineHeight / 2;
-  margin-bottom: @baseLineHeight / 2;
+  margin-top: $baseLineHeight / 2;
+  margin-bottom: $baseLineHeight / 2;
   .btn-group {
     display: inline-block;
-    .ie7-inline-block();
+    @include ie7-inline-block();
   }
 }
 
@@ -29,7 +29,7 @@
   position: relative;
   float: left;
   margin-left: -1px;
-  .border-radius(0);
+  @include border-radius(0);
 }
 // Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
 .btn-group .btn:first-child {
@@ -93,28 +93,28 @@
 .btn-group .dropdown-toggle {
   padding-left: 8px;
   padding-right: 8px;
-  @shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-  .box-shadow(@shadow);
+  $shadow: inset 1px 0 0 rgba(255,255,255,.125), inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
+  @include box-shadow($shadow);
   *padding-top: 5px;
   *padding-bottom: 5px;
 }
 
 .btn-group.open {
   // IE7's z-index only goes to the nearest positioned ancestor, which would
   // make the menu appear below buttons that appeared later on the page
-  *z-index: @zindexDropdown;
+  *z-index: $zindexDropdown;
 
   // Reposition menu on open and round all corners
   .dropdown-menu {
     display: block;
     margin-top: 1px;
-    .border-radius(5px);
+    @include border-radius(5px);
   }
 
   .dropdown-toggle {
     background-image: none;
-    @shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
-    .box-shadow(@shadow);
+    $shadow: inset 0 1px 6px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
+    @include box-shadow($shadow);
   }
 }
 
@@ -125,7 +125,7 @@
 }
 .btn:hover .caret,
 .open.btn-group .caret {
-  .opacity(100);
+  @include opacity(100);
 }
 
 
@@ -135,8 +135,8 @@
 .btn-info,
 .btn-success {
   .caret {
-    border-top-color: @white;
-    .opacity(75);
+    border-top-color: $white;
+    @include opacity(75);
   }
 }