Skip to content

brainfood / bootflat

Go to a project
Toggle navigation
Toggle navigation pinning
ed151127 by bootflat
Options

update sass 3.3.3 support

1 parent ab644282
Expand all
Inline Side-by-side
Showing 22 changed files with 119 additions and 124 deletions
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
2 2
3 BOOTFLAT is an open source Flat UI KIT based on Bootstrap 3.1.0 CSS framework. It provides a faster, easier and less repetitive way for web developers to create elegant web apps. 3 BOOTFLAT is an open source Flat UI KIT based on Bootstrap 3.1.0 CSS framework. It provides a faster, easier and less repetitive way for web developers to create elegant web apps.
4 4
5 Bootflat is built on the foundations of Bootstrap, visioned in a stunning flat design. Bootstrap itself is a trusted, reliable and proven tool for developers. Built with `Sass 3.3.0.rc.2`. 5 Bootflat is built on the foundations of Bootstrap, visioned in a stunning flat design. Bootstrap itself is a trusted, reliable and proven tool for developers. Built with `Sass 3.3.3`.
6 6
7 Bootflat is compatible with the following browsers: `IE8, IE9, IE10, Firefox, Safari, Opera, Chrome`. 7 Bootflat is compatible with the following browsers: `IE8, IE9, IE10, Firefox, Safari, Opera, Chrome`.
8 8
......
...@@ -231,7 +231,7 @@ blockquote { ...@@ -231,7 +231,7 @@ blockquote {
231 background-color: #ffce54; 231 background-color: #ffce54;
232 } 232 }
233 .btn-danger, .btn-danger:active, .btn-danger.active, .btn-danger.disabled, .btn-danger[disabled], 233 .btn-danger, .btn-danger:active, .btn-danger.active, .btn-danger.disabled, .btn-danger[disabled],
234 .btn-danger .open .dropdown-toggle.btn-danger { 234 .btn-danger .open .dropdown-toggle.btn {
235 border-color: #da4453; 235 border-color: #da4453;
236 background-color: #da4453; 236 background-color: #da4453;
237 } 237 }
...@@ -406,22 +406,22 @@ blockquote { ...@@ -406,22 +406,22 @@ blockquote {
406 -moz-box-shadow: none; 406 -moz-box-shadow: none;
407 box-shadow: none; 407 box-shadow: none;
408 } 408 }
409 .progress .progress-bar { 409 .progress-bar {
410 background-color: #3bafda; 410 background-color: #3bafda;
411 -webkit-box-shadow: none; 411 -webkit-box-shadow: none;
412 -moz-box-shadow: none; 412 -moz-box-shadow: none;
413 box-shadow: none; 413 box-shadow: none;
414 } 414 }
415 .progress .progress-bar-success { 415 .progress-bar-success {
416 background-color: #8cc152; 416 background-color: #8cc152;
417 } 417 }
418 .progress .progress-bar-info { 418 .progress-bar-info {
419 background-color: #37bc9b; 419 background-color: #37bc9b;
420 } 420 }
421 .progress .progress-bar-warning { 421 .progress-bar-warning {
422 background-color: #f6bb42; 422 background-color: #f6bb42;
423 } 423 }
424 .progress .progress-bar-danger { 424 .progress-bar-danger {
425 background-color: #da4453; 425 background-color: #da4453;
426 } 426 }
427 427
...@@ -798,7 +798,7 @@ blockquote { ...@@ -798,7 +798,7 @@ blockquote {
798 margin-bottom: 10px; 798 margin-bottom: 10px;
799 font-weight: bold; 799 font-weight: bold;
800 } 800 }
801 .alert .alert-dismissable .close { 801 .alert-dismissable .close {
802 color: black; 802 color: black;
803 opacity: 0.7; 803 opacity: 0.7;
804 filter: alpha(opacity=70); 804 filter: alpha(opacity=70);
...@@ -1321,7 +1321,7 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1321,7 +1321,7 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1321 * modal 1321 * modal
1322 * -------------------------------------------------- 1322 * --------------------------------------------------
1323 */ 1323 */
1324 .modal .modal-content { 1324 .modal-content {
1325 border: none; 1325 border: none;
1326 -webkit-border-radius: 4px; 1326 -webkit-border-radius: 4px;
1327 -moz-border-radius: 4px; 1327 -moz-border-radius: 4px;
...@@ -1331,13 +1331,13 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1331,13 +1331,13 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1331 -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); 1331 -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
1332 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); 1332 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
1333 } 1333 }
1334 .modal .modal-header { 1334 .modal-header {
1335 border-bottom: none; 1335 border-bottom: none;
1336 } 1336 }
1337 .modal .modal-body { 1337 .modal-body {
1338 padding: 0 15px; 1338 padding: 0 15px;
1339 } 1339 }
1340 .modal .modal-footer { 1340 .modal-footer {
1341 border-top: none; 1341 border-top: none;
1342 } 1342 }
1343 1343
...@@ -1473,17 +1473,17 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1473,17 +1473,17 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1473 .panel .list-group-item:first-child { 1473 .panel .list-group-item:first-child {
1474 border-top: 1px solid #e6e9ed; 1474 border-top: 1px solid #e6e9ed;
1475 } 1475 }
1476 .panel .panel-heading { 1476 .panel-heading {
1477 -webkit-border-radius: 4px 4px 0 0; 1477 -webkit-border-radius: 4px 4px 0 0;
1478 -moz-border-radius: 4px 4px 0 0; 1478 -moz-border-radius: 4px 4px 0 0;
1479 border-radius: 4px 4px 0 0; 1479 border-radius: 4px 4px 0 0;
1480 } 1480 }
1481 .panel .panel-title { 1481 .panel-title {
1482 font-size: 14px; 1482 font-size: 14px;
1483 color: #434a54; 1483 color: #434a54;
1484 font-weight: normal; 1484 font-weight: normal;
1485 } 1485 }
1486 .panel .panel-footer { 1486 .panel-footer {
1487 background-color: #e6e9ed; 1487 background-color: #e6e9ed;
1488 border-top-color: #e6e9ed; 1488 border-top-color: #e6e9ed;
1489 -webkit-border-radius: 0 0 4px 4px; 1489 -webkit-border-radius: 0 0 4px 4px;
...@@ -1538,11 +1538,7 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1538,11 +1538,7 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1538 background-color: #da4453; 1538 background-color: #da4453;
1539 border-color: #da4453; 1539 border-color: #da4453;
1540 } 1540 }
1541 .panel-primary > .panel-heading > .panel-title, 1541 .panel-primary > .panel-heading > .panel-title, .panel-success > .panel-heading > .panel-title, .panel-info > .panel-heading > .panel-title, .panel-warning > .panel-heading > .panel-title, .panel-danger > .panel-heading > .panel-title {
1542 .panel-success > .panel-heading > .panel-title,
1543 .panel-info > .panel-heading > .panel-title,
1544 .panel-warning > .panel-heading > .panel-title,
1545 .panel-danger > .panel-heading > .panel-title {
1546 color: white; 1542 color: white;
1547 } 1543 }
1548 .panel > .list-group:first-child .list-group-item:first-child, .panel > .table:first-child, .panel > .table-responsive:first-child > .table:first-child { 1544 .panel > .list-group:first-child .list-group-item:first-child, .panel > .table:first-child, .panel > .table-responsive:first-child > .table:first-child {
...@@ -1675,54 +1671,52 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1675,54 +1671,52 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1675 padding: 40px 0; 1671 padding: 40px 0;
1676 background-color: #434a54; 1672 background-color: #434a54;
1677 } 1673 }
1678 .footer .footer-logo, 1674 .footer-logo, .footer-nav {
1679 .footer .footer-nav {
1680 float: left; 1675 float: left;
1681 padding: 0 20px; 1676 padding: 0 20px;
1682 width: 20%; 1677 width: 20%;
1683 } 1678 }
1684 @media (max-width: 768px) { 1679 @media (max-width: 768px) {
1685 .footer .footer-logo { 1680 .footer-logo {
1686 margin-bottom: 20px; 1681 margin-bottom: 20px;
1687 } 1682 }
1688 .footer .footer-logo, 1683 .footer-logo, .footer-nav {
1689 .footer .footer-nav {
1690 float: none; 1684 float: none;
1691 display: block; 1685 display: block;
1692 width: 100%; 1686 width: 100%;
1693 } 1687 }
1694 } 1688 }
1695 .footer .footer-logo { 1689 .footer-logo {
1696 margin-top: -5px; 1690 margin-top: -5px;
1697 height: 32px; 1691 height: 32px;
1698 line-height: 32px; 1692 line-height: 32px;
1699 } 1693 }
1700 .footer .footer-logo img { 1694 .footer-logo img {
1701 margin-right: 10px; 1695 margin-right: 10px;
1702 } 1696 }
1703 .footer .footer-logo a { 1697 .footer-logo a {
1704 font-size: 20px; 1698 font-size: 20px;
1705 font-weight: bold; 1699 font-weight: bold;
1706 color: white; 1700 color: white;
1707 } 1701 }
1708 .footer .footer-logo a:hover, .footer .footer-logo a:active { 1702 .footer-logo a:hover, .footer-logo a:active {
1709 text-decoration: none; 1703 text-decoration: none;
1710 } 1704 }
1711 .footer .footer-nav .nav-title { 1705 .footer-nav .nav-title {
1712 margin-bottom: 15px; 1706 margin-bottom: 15px;
1713 color: #e6e9ed; 1707 color: #e6e9ed;
1714 } 1708 }
1715 .footer .footer-nav .nav-item { 1709 .footer-nav .nav-item {
1716 line-height: 28px; 1710 line-height: 28px;
1717 } 1711 }
1718 .footer .footer-nav .nav-item > a { 1712 .footer-nav .nav-item > a {
1719 color: #aab2bd; 1713 color: #aab2bd;
1720 } 1714 }
1721 .footer .footer-nav .nav-item > a:hover, .footer .footer-nav .nav-item > a:active { 1715 .footer-nav .nav-item > a:hover, .footer-nav .nav-item > a:active {
1722 color: #ccd1d9; 1716 color: #ccd1d9;
1723 text-decoration: none; 1717 text-decoration: none;
1724 } 1718 }
1725 .footer .footer-copyright { 1719 .footer-copyright {
1726 color: #aab2bd; 1720 color: #aab2bd;
1727 } 1721 }
1728 1722
...@@ -1822,4 +1816,4 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it ...@@ -1822,4 +1816,4 @@ a.list-group-item-danger.active, a.list-group-item-danger:hover, a.list-group-it
1822 border-radius: 4px 0 4px 4px; 1816 border-radius: 4px 0 4px 4px;
1823 } 1817 }
1824 1818
1825 /*# sourceMappingURL=bootflat.css.map */
...\ No newline at end of file ...\ No newline at end of file
1819 /*# sourceMappingURL=bootflat.css.map */
......
...@@ -22,7 +22,7 @@ $accordion-panel-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -22,7 +22,7 @@ $accordion-panel-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
22 */ 22 */
23 23
24 .accordion { 24 .accordion {
25 & #{&}-header { 25 & &-header {
26 margin-top: 0; 26 margin-top: 0;
27 font-size: 16px; 27 font-size: 16px;
28 display: block; 28 display: block;
......
...@@ -26,29 +26,29 @@ $alert-link-color: $mediumgray-light !default; ...@@ -26,29 +26,29 @@ $alert-link-color: $mediumgray-light !default;
26 font-weight: bold; 26 font-weight: bold;
27 } 27 }
28 28
29 #{&}-dismissable .close { 29 &-dismissable .close {
30 color: $alert-close-color; 30 color: $alert-close-color;
31 @include opacity($opacity: 70, $filter: true); 31 @include opacity($opacity: 70, $filter: true);
32 } 32 }
33 33
34 @at-root #{&}-info { 34 @at-root &-info {
35 background-color: lighten($alert-primary, 10%); 35 background-color: lighten($alert-primary, 10%);
36 border: $alert-primary; 36 border: $alert-primary;
37 } 37 }
38 @at-root #{&}-warning { 38 @at-root &-warning {
39 background-color: lighten($alert-warning, 10%); 39 background-color: lighten($alert-warning, 10%);
40 border: $alert-warning; 40 border: $alert-warning;
41 } 41 }
42 @at-root #{&}-danger { 42 @at-root &-danger {
43 background-color: lighten($alert-danger, 10%); 43 background-color: lighten($alert-danger, 10%);
44 border: $alert-danger; 44 border: $alert-danger;
45 } 45 }
46 @at-root #{&}-success { 46 @at-root &-success {
47 background-color: lighten($alert-success, 10%); 47 background-color: lighten($alert-success, 10%);
48 border: $alert-success; 48 border: $alert-success;
49 } 49 }
50 50
51 @at-root & #{&}-link { 51 @at-root & &-link {
52 cursor: pointer; 52 cursor: pointer;
53 text-decoration: underline; 53 text-decoration: underline;
54 @include opacity($opacity: 65, $filter: true); 54 @include opacity($opacity: 65, $filter: true);
......
...@@ -58,7 +58,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -58,7 +58,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
58 @include opacity($opacity: $button-opacity, $filter: true); 58 @include opacity($opacity: $button-opacity, $filter: true);
59 } 59 }
60 60
61 @at-root #{&}-link { 61 @at-root &-link {
62 &, 62 &,
63 &:hover, 63 &:hover,
64 &:focus, 64 &:focus,
...@@ -77,7 +77,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -77,7 +77,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
77 } 77 }
78 } 78 }
79 79
80 @at-root #{&}-default { 80 @at-root &-default {
81 color: $button-font-color-dark; 81 color: $button-font-color-dark;
82 border-color: $button-normal !important; 82 border-color: $button-normal !important;
83 83
...@@ -94,12 +94,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -94,12 +94,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
94 background-color: $button-default; 94 background-color: $button-default;
95 } 95 }
96 } 96 }
97 @at-root .open .dropdown-toggle#{&}-default { 97 @at-root .open .dropdown-toggle.btn-default {
98 border-color: $button-normal-hover; 98 border-color: $button-normal-hover;
99 background-color: $button-normal-hover; 99 background-color: $button-normal-hover;
100 } 100 }
101 101
102 @at-root #{&}-primary { 102 @at-root &-primary {
103 &, 103 &,
104 &:active, 104 &:active,
105 &.active, 105 &.active,
...@@ -114,12 +114,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -114,12 +114,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
114 background-color: $button-primary-hover; 114 background-color: $button-primary-hover;
115 } 115 }
116 } 116 }
117 @at-root .open .dropdown-toggle#{&}-primary { 117 @at-root .open .dropdown-toggle.btn-primary {
118 border-color: $button-primary-hover; 118 border-color: $button-primary-hover;
119 background-color: $button-primary-hover; 119 background-color: $button-primary-hover;
120 } 120 }
121 121
122 @at-root #{&}-info { 122 @at-root &-info {
123 &, 123 &,
124 &:active, 124 &:active,
125 &.active, 125 &.active,
...@@ -134,12 +134,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -134,12 +134,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
134 background-color: $button-info-hover; 134 background-color: $button-info-hover;
135 } 135 }
136 } 136 }
137 @at-root .open .dropdown-toggle#{&}-info { 137 @at-root .open .dropdown-toggle.btn-info {
138 border-color: $button-info-hover; 138 border-color: $button-info-hover;
139 background-color: $button-info-hover; 139 background-color: $button-info-hover;
140 } 140 }
141 141
142 @at-root #{&}-success { 142 @at-root &-success {
143 &, 143 &,
144 &:active, 144 &:active,
145 &.active, 145 &.active,
...@@ -154,12 +154,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -154,12 +154,12 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
154 background-color: $button-success-hover; 154 background-color: $button-success-hover;
155 } 155 }
156 } 156 }
157 @at-root .open .dropdown-toggle#{&}-success { 157 @at-root .open .dropdown-toggle.btn-success {
158 border-color: $button-success-hover; 158 border-color: $button-success-hover;
159 background-color: $button-success-hover; 159 background-color: $button-success-hover;
160 } 160 }
161 161
162 @at-root #{&}-warning { 162 @at-root &-warning {
163 &, 163 &,
164 &:active, 164 &:active,
165 &.active, 165 &.active,
...@@ -174,18 +174,18 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -174,18 +174,18 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
174 background-color: $button-warning-hover; 174 background-color: $button-warning-hover;
175 } 175 }
176 } 176 }
177 @at-root .open .dropdown-toggle#{&}-warning { 177 @at-root .open .dropdown-toggle.btn-warning {
178 border-color: $button-warning-hover; 178 border-color: $button-warning-hover;
179 background-color: $button-warning-hover; 179 background-color: $button-warning-hover;
180 } 180 }
181 181
182 @at-root #{&}-danger { 182 @at-root &-danger {
183 &, 183 &,
184 &:active, 184 &:active,
185 &.active, 185 &.active,
186 &.disabled, 186 &.disabled,
187 &[disabled], 187 &[disabled],
188 .open .dropdown-toggle#{&} { 188 .open .dropdown-toggle.btn {
189 border-color: $button-danger; 189 border-color: $button-danger;
190 background-color: $button-danger; 190 background-color: $button-danger;
191 } 191 }
...@@ -195,7 +195,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default; ...@@ -195,7 +195,7 @@ $button-shaodw: inset 0 1px 2px rgba(0, 0, 0, .125) !default;
195 background-color: $button-danger-hover; 195 background-color: $button-danger-hover;
196 } 196 }
197 } 197 }
198 @at-root .open .dropdown-toggle#{&}-danger { 198 @at-root .open .dropdown-toggle.btn-danger {
199 border-color: $button-danger-hover; 199 border-color: $button-danger-hover;
200 background-color: $button-danger-hover; 200 background-color: $button-danger-hover;
201 } 201 }
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
8 * -------------------------------------------------- 8 * --------------------------------------------------
9 */ 9 */
10 .btn-group { 10 .btn-group {
11 @at-root #{&}.open .dropdown-toggle { 11 @at-root &.open .dropdown-toggle {
12 @include box-shadow($value: inset 0 1px 2px rgba(0, 0, 0, .125)); 12 @include box-shadow($value: inset 0 1px 2px rgba(0, 0, 0, .125));
13 } 13 }
14 14
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
16 border-left-color: darken($button-normal, 7%); 16 border-left-color: darken($button-normal, 7%);
17 } 17 }
18 18
19 @at-root #{&}.open .btn-default.dropdown-toggle, 19 @at-root &.open .btn-default.dropdown-toggle,
20 & .btn-default:focus, 20 & .btn-default:focus,
21 & .btn-default:active, 21 & .btn-default:active,
22 & .btn-default.active { 22 & .btn-default.active {
......
...@@ -22,24 +22,24 @@ $footer-logo-color: $white !default; ...@@ -22,24 +22,24 @@ $footer-logo-color: $white !default;
22 padding: 40px 0; 22 padding: 40px 0;
23 background-color: $footer-background-color; 23 background-color: $footer-background-color;
24 24
25 #{&}-logo, 25 &-logo,
26 #{&}-nav { 26 &-nav {
27 float: left; 27 float: left;
28 padding: 0 20px; 28 padding: 0 20px;
29 width: 20%; 29 width: 20%;
30 } 30 }
31 @media (max-width: 768px) { 31 @media (max-width: 768px) {
32 #{&}-logo { 32 &-logo {
33 margin-bottom: 20px; 33 margin-bottom: 20px;
34 } 34 }
35 #{&}-logo, 35 &-logo,
36 #{&}-nav { 36 &-nav {
37 float: none; 37 float: none;
38 display: block; 38 display: block;
39 width: 100%; 39 width: 100%;
40 } 40 }
41 } 41 }
42 #{&}-logo { 42 &-logo {
43 margin-top: -5px; 43 margin-top: -5px;
44 height: 32px; 44 height: 32px;
45 line-height: 32px; 45 line-height: 32px;
...@@ -57,11 +57,11 @@ $footer-logo-color: $white !default; ...@@ -57,11 +57,11 @@ $footer-logo-color: $white !default;
57 text-decoration: none; 57 text-decoration: none;
58 } 58 }
59 } 59 }
60 #{&}-nav .nav-title { 60 &-nav .nav-title {
61 margin-bottom: 15px; 61 margin-bottom: 15px;
62 color: $footer-menu-title-color; 62 color: $footer-menu-title-color;
63 } 63 }
64 #{&}-nav .nav-item { 64 &-nav .nav-item {
65 line-height: 28px; 65 line-height: 28px;
66 & > a { 66 & > a {
67 color: $footer-menu-item-color; 67 color: $footer-menu-item-color;
...@@ -72,7 +72,7 @@ $footer-logo-color: $white !default; ...@@ -72,7 +72,7 @@ $footer-logo-color: $white !default;
72 text-decoration: none; 72 text-decoration: none;
73 } 73 }
74 } 74 }
75 #{&}-copyright { 75 &-copyright {
76 color: $footer-menu-item-color; 76 color: $footer-menu-item-color;
77 } 77 }
78 } 78 }
......
1 // Global Variables 1 // Global Variables
2 //------------------------------------------------------ 2 //------------------------------------------------------
3 $modules: () !global; 3 $modules: () !default;
4 4
5 $experimental: true !default; 5 $experimental: true !default;
6 6
...@@ -34,8 +34,8 @@ $bittersweet-light: #FC6E51 !default; ...@@ -34,8 +34,8 @@ $bittersweet-light: #FC6E51 !default;
34 $grapefruit-dark: #DA4453 !default; 34 $grapefruit-dark: #DA4453 !default;
35 $grapefruit-light: #ED5565 !default; 35 $grapefruit-light: #ED5565 !default;
36 36
37 $lavander-dark: #967ADC !default; 37 $lavender-dark: #967ADC !default;
38 $lavander-light: #AC92EC !default; 38 $lavender-light: #AC92EC !default;
39 39
40 $pinkrose-dark: #D770AD !default; 40 $pinkrose-dark: #D770AD !default;
41 $pinkrose-light: #EC87C0 !default; 41 $pinkrose-light: #EC87C0 !default;
...@@ -54,7 +54,8 @@ $darkgray-light: #656D78 !default; ...@@ -54,7 +54,8 @@ $darkgray-light: #656D78 !default;
54 54
55 // We use this to loading scss files 55 // We use this to loading scss files
56 @mixin exports($name) { 56 @mixin exports($name) {
57 @if (index($modules, $name) == false) { 57 @if index($modules, $name) {
58 } @else {
58 $modules: append($modules, $name); 59 $modules: append($modules, $name);
59 @content; 60 @content;
60 } 61 }
......
...@@ -28,12 +28,12 @@ $jumbotron-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default; ...@@ -28,12 +28,12 @@ $jumbotron-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
28 @include radius($type: border-radius, $value: $jumbotron-radius); 28 @include radius($type: border-radius, $value: $jumbotron-radius);
29 } 29 }
30 30
31 & > #{&}-photo img { 31 & > &-photo img {
32 @include radius($type: border-radius, $value: $jumbotron-radius $jumbotron-radius 0 0); 32 @include radius($type: border-radius, $value: $jumbotron-radius $jumbotron-radius 0 0);
33 width: 100%; 33 width: 100%;
34 } 34 }
35 35
36 & #{&}-contents { 36 & &-contents {
37 padding: 20px; 37 padding: 20px;
38 color: $jumbotron-font-color; 38 color: $jumbotron-font-color;
39 } 39 }
......
...@@ -36,12 +36,12 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -36,12 +36,12 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
36 .list-group { 36 .list-group {
37 @include radius($type: border-radius, $value: $list-radius); 37 @include radius($type: border-radius, $value: $list-radius);
38 @include box-shadow($value: $list-shadow); 38 @include box-shadow($value: $list-shadow);
39 @at-root #{&}-item { 39 @at-root &-item {
40 border-top-color: $list-border-color; 40 border-top-color: $list-border-color;
41 &:first-child { 41 &:first-child {
42 border-top: none; 42 border-top: none;
43 } 43 }
44 @at-root #{&}-heading { 44 @at-root &-heading {
45 color: $list-font-color; 45 color: $list-font-color;
46 } 46 }
47 } 47 }
...@@ -79,7 +79,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -79,7 +79,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
79 &:first-child { 79 &:first-child {
80 border-color: transparent; 80 border-color: transparent;
81 } 81 }
82 @at-root a#{&} { 82 @at-root a.list-group-item-primary {
83 color: darken($list-primary, 30%); 83 color: darken($list-primary, 30%);
84 &:hover, 84 &:hover,
85 &:focus { 85 &:focus {
...@@ -101,7 +101,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -101,7 +101,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
101 &:first-child { 101 &:first-child {
102 border-color: transparent; 102 border-color: transparent;
103 } 103 }
104 @at-root a#{&} { 104 @at-root a.list-group-item-success {
105 color: darken($list-success, 30%); 105 color: darken($list-success, 30%);
106 &:hover, 106 &:hover,
107 &:focus { 107 &:focus {
...@@ -123,7 +123,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -123,7 +123,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
123 &:first-child { 123 &:first-child {
124 border-color: transparent; 124 border-color: transparent;
125 } 125 }
126 @at-root a#{&} { 126 @at-root a.list-group-item-warning {
127 color: darken($list-warning, 40%); 127 color: darken($list-warning, 40%);
128 &:hover, 128 &:hover,
129 &:focus { 129 &:focus {
...@@ -145,7 +145,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -145,7 +145,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
145 &:first-child { 145 &:first-child {
146 border-color: transparent; 146 border-color: transparent;
147 } 147 }
148 @at-root a#{&} { 148 @at-root a.list-group-item-info {
149 color: darken($list-info, 30%); 149 color: darken($list-info, 30%);
150 &:hover, 150 &:hover,
151 &:focus { 151 &:focus {
...@@ -167,7 +167,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa ...@@ -167,7 +167,7 @@ $list-shadow: 0 1px 2px rgba(0, 0, 0, .2) !defa
167 &:first-child { 167 &:first-child {
168 border-color: transparent; 168 border-color: transparent;
169 } 169 }
170 @at-root a#{&} { 170 @at-root a.list-group-item-danger {
171 color: darken($list-danger, 30%); 171 color: darken($list-danger, 30%);
172 &:hover, 172 &:hover,
173 &:focus { 173 &:focus {
......
...@@ -17,19 +17,19 @@ $modal-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default; ...@@ -17,19 +17,19 @@ $modal-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
17 */ 17 */
18 18
19 .modal { 19 .modal {
20 #{&}-content { 20 &-content {
21 border: none; 21 border: none;
22 @include radius($type: border-radius, $value: $modal-radius); 22 @include radius($type: border-radius, $value: $modal-radius);
23 color: $modal-font-color; 23 color: $modal-font-color;
24 @include box-shadow($value: $modal-shadow); 24 @include box-shadow($value: $modal-shadow);
25 } 25 }
26 #{&}-header { 26 &-header {
27 border-bottom: none; 27 border-bottom: none;
28 } 28 }
29 #{&}-body { 29 &-body {
30 padding: 0 15px; 30 padding: 0 15px;
31 } 31 }
32 #{&}-footer { 32 &-footer {
33 border-top: none; 33 border-top: none;
34 } 34 }
35 } 35 }
......
...@@ -37,21 +37,21 @@ $panel-radius: 4px !default; ...@@ -37,21 +37,21 @@ $panel-radius: 4px !default;
37 border-top: 1px solid $panel-normal; 37 border-top: 1px solid $panel-normal;
38 } 38 }
39 39
40 #{&}-heading { 40 &-heading {
41 @include radius($type: border-radius, $value: $panel-radius $panel-radius 0 0); 41 @include radius($type: border-radius, $value: $panel-radius $panel-radius 0 0);
42 } 42 }
43 #{&}-title { 43 &-title {
44 font-size: 14px; 44 font-size: 14px;
45 color: $panel-font-color; 45 color: $panel-font-color;
46 font-weight: normal; 46 font-weight: normal;
47 } 47 }
48 #{&}-footer { 48 &-footer {
49 background-color: $panel-normal; 49 background-color: $panel-normal;
50 border-top-color: $panel-normal; 50 border-top-color: $panel-normal;
51 @include radius($type: border-radius, $value: 0 0 $panel-radius $panel-radius); 51 @include radius($type: border-radius, $value: 0 0 $panel-radius $panel-radius);
52 } 52 }
53 53
54 @at-root #{&}-default { 54 @at-root &-default {
55 border-color: $panel-normal; 55 border-color: $panel-normal;
56 & > .panel-heading { 56 & > .panel-heading {
57 color: $panel-font-color; 57 color: $panel-font-color;
...@@ -59,7 +59,7 @@ $panel-radius: 4px !default; ...@@ -59,7 +59,7 @@ $panel-radius: 4px !default;
59 border-color: $panel-normal; 59 border-color: $panel-normal;
60 } 60 }
61 } 61 }
62 @at-root #{&}-primary { 62 @at-root &-primary {
63 border-color: $panel-primary; 63 border-color: $panel-primary;
64 & > .panel-heading { 64 & > .panel-heading {
65 color: $panel-default; 65 color: $panel-default;
...@@ -67,7 +67,7 @@ $panel-radius: 4px !default; ...@@ -67,7 +67,7 @@ $panel-radius: 4px !default;
67 border-color: $panel-primary; 67 border-color: $panel-primary;
68 } 68 }
69 } 69 }
70 @at-root #{&}-success { 70 @at-root &-success {
71 border-color: $panel-success; 71 border-color: $panel-success;
72 & > .panel-heading { 72 & > .panel-heading {
73 color: $panel-default; 73 color: $panel-default;
...@@ -75,7 +75,7 @@ $panel-radius: 4px !default; ...@@ -75,7 +75,7 @@ $panel-radius: 4px !default;
75 border-color: $panel-success; 75 border-color: $panel-success;
76 } 76 }
77 } 77 }
78 @at-root #{&}-info { 78 @at-root &-info {
79 border-color: $panel-info; 79 border-color: $panel-info;
80 & > .panel-heading { 80 & > .panel-heading {
81 color: $panel-default; 81 color: $panel-default;
...@@ -83,7 +83,7 @@ $panel-radius: 4px !default; ...@@ -83,7 +83,7 @@ $panel-radius: 4px !default;
83 border-color: $panel-info; 83 border-color: $panel-info;
84 } 84 }
85 } 85 }
86 @at-root #{&}-warning { 86 @at-root &-warning {
87 border-color: $panel-warning; 87 border-color: $panel-warning;
88 & > .panel-heading { 88 & > .panel-heading {
89 color: $panel-default; 89 color: $panel-default;
...@@ -91,7 +91,7 @@ $panel-radius: 4px !default; ...@@ -91,7 +91,7 @@ $panel-radius: 4px !default;
91 border-color: $panel-warning; 91 border-color: $panel-warning;
92 } 92 }
93 } 93 }
94 @at-root #{&}-danger { 94 @at-root &-danger {
95 border-color: $panel-danger; 95 border-color: $panel-danger;
96 & > .panel-heading { 96 & > .panel-heading {
97 color: $panel-default; 97 color: $panel-default;
...@@ -100,11 +100,11 @@ $panel-radius: 4px !default; ...@@ -100,11 +100,11 @@ $panel-radius: 4px !default;
100 } 100 }
101 } 101 }
102 102
103 @at-root #{&}-primary > #{&}-heading > #{&}-title, 103 @at-root &-primary > &-heading > &-title,
104 #{&}-success > #{&}-heading > #{&}-title, 104 &-success > &-heading > &-title,
105 #{&}-info > #{&}-heading > #{&}-title, 105 &-info > &-heading > &-title,
106 #{&}-warning > #{&}-heading > #{&}-title, 106 &-warning > &-heading > &-title,
107 #{&}-danger > #{&}-heading > #{&}-title { 107 &-danger > &-heading > &-title {
108 color: $panel-default; 108 color: $panel-default;
109 } 109 }
110 110
...@@ -160,8 +160,8 @@ $panel-radius: 4px !default; ...@@ -160,8 +160,8 @@ $panel-radius: 4px !default;
160 & > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child { 160 & > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
161 @include radius($type: border-radius, $value: 0 0 $panel-radius 0); 161 @include radius($type: border-radius, $value: 0 0 $panel-radius 0);
162 } 162 }
163 & > #{&}-body + .table, 163 & > &-body + .table,
164 & > #{&}-body + .table-responsive { 164 & > &-body + .table-responsive {
165 border-top-color: $panel-normal; 165 border-top-color: $panel-normal;
166 } 166 }
167 } 167 }
......
...@@ -20,7 +20,7 @@ $popover-title-font-color: $mediumgray-dark !default; ...@@ -20,7 +20,7 @@ $popover-title-font-color: $mediumgray-dark !default;
20 color: $popover-font-color; 20 color: $popover-font-color;
21 border-color: $popover-background-color; 21 border-color: $popover-background-color;
22 22
23 @at-root #{&}-title { 23 @at-root &-title {
24 padding-bottom: 0; 24 padding-bottom: 0;
25 font-weight: bold; 25 font-weight: bold;
26 color: $popover-title-font-color; 26 color: $popover-title-font-color;
......
...@@ -20,20 +20,20 @@ $progress-background-color: $lightgray-dark !default; ...@@ -20,20 +20,20 @@ $progress-background-color: $lightgray-dark !default;
20 background-color: $progress-background-color; 20 background-color: $progress-background-color;
21 @include box-shadow($value: none); 21 @include box-shadow($value: none);
22 22
23 #{&}-bar { 23 &-bar {
24 background-color: $progress-primary; 24 background-color: $progress-primary;
25 @include box-shadow($value: none); 25 @include box-shadow($value: none);
26 } 26 }
27 #{&}-bar-success { 27 &-bar-success {
28 background-color: $progress-success; 28 background-color: $progress-success;
29 } 29 }
30 #{&}-bar-info { 30 &-bar-info {
31 background-color: $progress-info; 31 background-color: $progress-info;
32 } 32 }
33 #{&}-bar-warning { 33 &-bar-warning {
34 background-color: $progress-warning; 34 background-color: $progress-warning;
35 } 35 }
36 #{&}-bar-danger { 36 &-bar-danger {
37 background-color: $progress-danger; 37 background-color: $progress-danger;
38 } 38 }
39 } 39 }
......
...@@ -15,24 +15,24 @@ $tooltip-font-color: $white !default; ...@@ -15,24 +15,24 @@ $tooltip-font-color: $white !default;
15 */ 15 */
16 16
17 .tooltip { 17 .tooltip {
18 @at-root #{&}-inner { 18 @at-root &-inner {
19 color: $tooltip-font-color; 19 color: $tooltip-font-color;
20 background-color: $tooltip-background-color; 20 background-color: $tooltip-background-color;
21 } 21 }
22 &.top #{&}-arrow, 22 &.top &-arrow,
23 &.top-left #{&}-arrow, 23 &.top-left &-arrow,
24 &.top-right #{&}-arrow { 24 &.top-right &-arrow {
25 border-top-color: $tooltip-background-color; 25 border-top-color: $tooltip-background-color;
26 } 26 }
27 &.right #{&}-arrow { 27 &.right &-arrow {
28 border-right-color: $tooltip-background-color; 28 border-right-color: $tooltip-background-color;
29 } 29 }
30 &.left #{&}-arrow { 30 &.left &-arrow {
31 border-left-color: $tooltip-background-color; 31 border-left-color: $tooltip-background-color;
32 } 32 }
33 &.bottom #{&}-arrow, 33 &.bottom &-arrow,
34 &.bottom-left #{&}-arrow, 34 &.bottom-left &-arrow,
35 &.bottom-right #{&}-arrow { 35 &.bottom-right &-arrow {
36 border-bottom-color: $tooltip-background-color; 36 border-bottom-color: $tooltip-background-color;
37 } 37 }
38 } 38 }
......
...@@ -30,10 +30,10 @@ $well-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default; ...@@ -30,10 +30,10 @@ $well-shadow: 0 1px 2px rgba(0, 0, 0, .2) !default;
30 & blockquote { 30 & blockquote {
31 border-color: $well-blockquote-color; 31 border-color: $well-blockquote-color;
32 } 32 }
33 @at-root #{&}-lg { 33 @at-root &-lg {
34 padding: 20px; 34 padding: 20px;
35 } 35 }
36 @at-root #{&}-sm { 36 @at-root &-sm {
37 padding: 5px; 37 padding: 5px;
38 } 38 }
39 } 39 }
......
This diff could not be displayed because it is too large.
...@@ -144,7 +144,7 @@ ...@@ -144,7 +144,7 @@
144 ================================================== --> 144 ================================================== -->
145 <div class="docs-article docs--start" id="css-sass"> 145 <div class="docs-article docs--start" id="css-sass">
146 <h3>CSS/SASS</h3> 146 <h3>CSS/SASS</h3>
147 <p>The CSS can stand on its own, but it is also built to be enhanced by the developer. For simplicity you can always just add in your own CSS and override default properties. And for even more power and flexibility, the core is written with <a href="http://sass-lang.com/" target="_blank" rel="external nofollow">Sass 3.3.0.rc.2</a> and includes easily customized variables and mixins. We feel we’ve left the CSS in a state which can be easily extended to get your own look and feel.</p> 147 <p>The CSS can stand on its own, but it is also built to be enhanced by the developer. For simplicity you can always just add in your own CSS and override default properties. And for even more power and flexibility, the core is written with <a href="http://sass-lang.com/" target="_blank" rel="external nofollow">Sass 3.3.3</a> and includes easily customized variables and mixins. We feel we’ve left the CSS in a state which can be easily extended to get your own look and feel.</p>
148 </div> 148 </div>
149 <!-- Browser Support 149 <!-- Browser Support
150 ================================================== --> 150 ================================================== -->
......
...@@ -71,7 +71,7 @@ ...@@ -71,7 +71,7 @@
71 <div id="learn-more" class="desc container"> 71 <div id="learn-more" class="desc container">
72 <div class="desc__introduces"> 72 <div class="desc__introduces">
73 <h3>Designed for everyone, everywhere.</h3> 73 <h3>Designed for everyone, everywhere.</h3>
74 <p>Bootflat is built on the foundations of Bootstrap, visioned in a stunning flat design. Bootstrap itself is a trusted, reliable and proven tool for developers. Built with <a href="http://sass-lang.com/" target="_blank" rel="external nofollow">Sass 3.3.0.rc.2</a>.</p> 74 <p>Bootflat is built on the foundations of Bootstrap, visioned in a stunning flat design. Bootstrap itself is a trusted, reliable and proven tool for developers. Built with <a href="http://sass-lang.com/" target="_blank" rel="external nofollow">Sass 3.3.3</a>.</p>
75 </div> 75 </div>
76 <div class="desc__features"> 76 <div class="desc__features">
77 <div class="row"> 77 <div class="row">
......
...@@ -6,12 +6,12 @@ ...@@ -6,12 +6,12 @@
6 "author":"Flathemes", 6 "author":"Flathemes",
7 "license": "MIT", 7 "license": "MIT",
8 "devDependencies": { 8 "devDependencies": {
9 "grunt": "~0.4.1", 9 "grunt": "~0.4.4",
10 "grunt-contrib-cssmin": "~0.7.0", 10 "grunt-contrib-cssmin": "~0.9.0",
11 "grunt-contrib-copy": "~0.4.1", 11 "grunt-contrib-copy": "~0.5.0",
12 "grunt-contrib-concat": "~0.3.0", 12 "grunt-contrib-concat": "~0.3.0",
13 "grunt-contrib-uglify": "~0.2.4", 13 "grunt-contrib-uglify": "~0.4.0",
14 "grunt-contrib-sass": "~0.5.0", 14 "grunt-contrib-sass": "~0.7.3",
15 "load-grunt-tasks": "~0.2.0" 15 "load-grunt-tasks": "~0.2.0"
16 } 16 }
17 } 17 }
...\ No newline at end of file ...\ No newline at end of file
......