geekyll 0.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/LICENSE.txt +21 -0
- data/README.md +48 -0
- data/_includes/footer.html +20 -0
- data/_includes/head.html +27 -0
- data/_includes/header.html +18 -0
- data/_includes/image.html +14 -0
- data/_includes/javascripts.html +7 -0
- data/_includes/navigation.html +16 -0
- data/_includes/social.html +15 -0
- data/_layouts/default.html +10 -0
- data/_layouts/index.html +48 -0
- data/_layouts/page.html +23 -0
- data/_layouts/post.html +5 -0
- data/_layouts/root.html +14 -0
- data/_sass/geekyll/_icons.scss +9 -0
- data/_sass/geekyll/_layout.scss +233 -0
- data/_sass/geekyll/_pages.scss +232 -0
- data/_sass/geekyll/_typography.scss +4 -0
- data/_sass/geekyll/bootstrap4alpha4/_alert.scss +56 -0
- data/_sass/geekyll/bootstrap4alpha4/_animation.scss +27 -0
- data/_sass/geekyll/bootstrap4alpha4/_breadcrumb.scss +38 -0
- data/_sass/geekyll/bootstrap4alpha4/_button-group.scss +234 -0
- data/_sass/geekyll/bootstrap4alpha4/_buttons.scss +176 -0
- data/_sass/geekyll/bootstrap4alpha4/_card.scss +320 -0
- data/_sass/geekyll/bootstrap4alpha4/_carousel.scss +253 -0
- data/_sass/geekyll/bootstrap4alpha4/_close.scss +31 -0
- data/_sass/geekyll/bootstrap4alpha4/_code.scss +57 -0
- data/_sass/geekyll/bootstrap4alpha4/_custom-forms.scss +265 -0
- data/_sass/geekyll/bootstrap4alpha4/_custom.scss +4 -0
- data/_sass/geekyll/bootstrap4alpha4/_dropdown.scss +179 -0
- data/_sass/geekyll/bootstrap4alpha4/_forms.scss +364 -0
- data/_sass/geekyll/bootstrap4alpha4/_grid.scss +39 -0
- data/_sass/geekyll/bootstrap4alpha4/_images.scss +52 -0
- data/_sass/geekyll/bootstrap4alpha4/_input-group.scss +188 -0
- data/_sass/geekyll/bootstrap4alpha4/_jumbotron.scss +20 -0
- data/_sass/geekyll/bootstrap4alpha4/_list-group.scss +123 -0
- data/_sass/geekyll/bootstrap4alpha4/_media.scss +81 -0
- data/_sass/geekyll/bootstrap4alpha4/_mixins.scss +54 -0
- data/_sass/geekyll/bootstrap4alpha4/_modal.scss +132 -0
- data/_sass/geekyll/bootstrap4alpha4/_nav.scss +157 -0
- data/_sass/geekyll/bootstrap4alpha4/_navbar.scss +256 -0
- data/_sass/geekyll/bootstrap4alpha4/_normalize.scss +424 -0
- data/_sass/geekyll/bootstrap4alpha4/_pagination.scss +73 -0
- data/_sass/geekyll/bootstrap4alpha4/_popover.scss +147 -0
- data/_sass/geekyll/bootstrap4alpha4/_print.scss +116 -0
- data/_sass/geekyll/bootstrap4alpha4/_progress.scss +145 -0
- data/_sass/geekyll/bootstrap4alpha4/_reboot.scss +393 -0
- data/_sass/geekyll/bootstrap4alpha4/_responsive-embed.scss +39 -0
- data/_sass/geekyll/bootstrap4alpha4/_tables.scss +196 -0
- data/_sass/geekyll/bootstrap4alpha4/_tags.scss +77 -0
- data/_sass/geekyll/bootstrap4alpha4/_tooltip.scss +87 -0
- data/_sass/geekyll/bootstrap4alpha4/_type.scss +150 -0
- data/_sass/geekyll/bootstrap4alpha4/_utilities.scss +9 -0
- data/_sass/geekyll/bootstrap4alpha4/_variables.scss +830 -0
- data/_sass/geekyll/bootstrap4alpha4/bootstrap-flex.scss +8 -0
- data/_sass/geekyll/bootstrap4alpha4/bootstrap-grid.scss +23 -0
- data/_sass/geekyll/bootstrap4alpha4/bootstrap-reboot.scss +11 -0
- data/_sass/geekyll/bootstrap4alpha4/bootstrap.scss +54 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_alert.scss +14 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_background-variant.scss +13 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_border-radius.scss +35 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_breakpoints.scss +86 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_buttons.scss +113 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_cards.scss +44 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_clearfix.scss +7 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_forms.scss +86 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_gradients.scss +43 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_grid-framework.scss +70 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_grid.scss +84 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_hover.scss +60 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_image.scss +34 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_list-group.scss +30 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_lists.scss +7 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_nav-divider.scss +10 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_navbar-align.scss +9 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_pagination.scss +21 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_progress.scss +23 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_pulls.scss +6 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_reset-filter.scss +8 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_reset-text.scss +17 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_resize.scss +6 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_screen-reader.scss +32 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_size.scss +6 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_tab-focus.scss +9 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_table-row.scss +30 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_tag.scss +11 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_text-emphasis.scss +12 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_text-hide.scss +8 -0
- data/_sass/geekyll/bootstrap4alpha4/mixins/_text-truncate.scss +8 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_background.scss +19 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_clearfix.scss +3 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_display.scss +13 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_flex.scss +37 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_pulls.scss +13 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_screenreaders.scss +11 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_spacing.scss +43 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_text.scss +51 -0
- data/_sass/geekyll/bootstrap4alpha4/utilities/_visibility.scss +55 -0
- data/_sass/geekyll/reset.scss +9 -0
- data/_sass/geekyll/social.scss +5 -0
- data/_sass/geekyll.scss +39 -0
- data/screenshot.png +0 -0
- metadata +188 -0
@@ -0,0 +1,23 @@
|
|
1
|
+
// Bootstrap Grid only
|
2
|
+
//
|
3
|
+
// Includes relevant variables and mixins for the regular (non-flexbox) grid
|
4
|
+
// system, as well as the generated predefined classes (e.g., `.col-4-sm`).
|
5
|
+
|
6
|
+
|
7
|
+
//
|
8
|
+
// Variables
|
9
|
+
//
|
10
|
+
|
11
|
+
@import "custom";
|
12
|
+
@import "variables";
|
13
|
+
|
14
|
+
//
|
15
|
+
// Grid mixins
|
16
|
+
//
|
17
|
+
|
18
|
+
@import "mixins/clearfix";
|
19
|
+
@import "mixins/breakpoints";
|
20
|
+
@import "mixins/grid-framework";
|
21
|
+
@import "mixins/grid";
|
22
|
+
|
23
|
+
@import "grid";
|
@@ -0,0 +1,54 @@
|
|
1
|
+
/*!
|
2
|
+
* Bootstrap v4.0.0-alpha.4 (http://getbootstrap.com)
|
3
|
+
* Copyright 2011-2016 The Bootstrap Authors
|
4
|
+
* Copyright 2011-2016 Twitter, Inc.
|
5
|
+
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
6
|
+
*/
|
7
|
+
|
8
|
+
// Core variables and mixins
|
9
|
+
@import "custom";
|
10
|
+
@import "variables";
|
11
|
+
@import "mixins";
|
12
|
+
|
13
|
+
// Reset and dependencies
|
14
|
+
@import "normalize";
|
15
|
+
@import "print";
|
16
|
+
|
17
|
+
// Core CSS
|
18
|
+
@import "reboot";
|
19
|
+
@import "type";
|
20
|
+
@import "images";
|
21
|
+
@import "code";
|
22
|
+
@import "grid";
|
23
|
+
@import "tables";
|
24
|
+
@import "forms";
|
25
|
+
@import "buttons";
|
26
|
+
|
27
|
+
// Components
|
28
|
+
@import "animation";
|
29
|
+
@import "dropdown";
|
30
|
+
@import "button-group";
|
31
|
+
@import "input-group";
|
32
|
+
@import "custom-forms";
|
33
|
+
@import "nav";
|
34
|
+
@import "navbar";
|
35
|
+
@import "card";
|
36
|
+
@import "breadcrumb";
|
37
|
+
@import "pagination";
|
38
|
+
@import "tags";
|
39
|
+
@import "jumbotron";
|
40
|
+
@import "alert";
|
41
|
+
@import "progress";
|
42
|
+
@import "media";
|
43
|
+
@import "list-group";
|
44
|
+
@import "responsive-embed";
|
45
|
+
@import "close";
|
46
|
+
|
47
|
+
// Components w/ JavaScript
|
48
|
+
@import "modal";
|
49
|
+
@import "tooltip";
|
50
|
+
@import "popover";
|
51
|
+
@import "carousel";
|
52
|
+
|
53
|
+
// Utility classes
|
54
|
+
@import "utilities";
|
@@ -0,0 +1,14 @@
|
|
1
|
+
// Alerts
|
2
|
+
|
3
|
+
@mixin alert-variant($background, $border, $body-color) {
|
4
|
+
background-color: $background;
|
5
|
+
border-color: $border;
|
6
|
+
color: $body-color;
|
7
|
+
|
8
|
+
hr {
|
9
|
+
border-top-color: darken($border, 5%);
|
10
|
+
}
|
11
|
+
.alert-link {
|
12
|
+
color: darken($body-color, 10%);
|
13
|
+
}
|
14
|
+
}
|
@@ -0,0 +1,13 @@
|
|
1
|
+
// Contextual backgrounds
|
2
|
+
|
3
|
+
@mixin bg-variant($parent, $color) {
|
4
|
+
#{$parent} {
|
5
|
+
color: #fff !important;
|
6
|
+
background-color: $color !important;
|
7
|
+
}
|
8
|
+
a#{$parent} {
|
9
|
+
@include hover-focus {
|
10
|
+
background-color: darken($color, 10%) !important;
|
11
|
+
}
|
12
|
+
}
|
13
|
+
}
|
@@ -0,0 +1,35 @@
|
|
1
|
+
// Single side border-radius
|
2
|
+
|
3
|
+
@mixin border-radius($radius: $border-radius) {
|
4
|
+
@if $enable-rounded {
|
5
|
+
border-radius: $radius;
|
6
|
+
}
|
7
|
+
}
|
8
|
+
|
9
|
+
@mixin border-top-radius($radius) {
|
10
|
+
@if $enable-rounded {
|
11
|
+
border-top-right-radius: $radius;
|
12
|
+
border-top-left-radius: $radius;
|
13
|
+
}
|
14
|
+
}
|
15
|
+
|
16
|
+
@mixin border-right-radius($radius) {
|
17
|
+
@if $enable-rounded {
|
18
|
+
border-bottom-right-radius: $radius;
|
19
|
+
border-top-right-radius: $radius;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
|
23
|
+
@mixin border-bottom-radius($radius) {
|
24
|
+
@if $enable-rounded {
|
25
|
+
border-bottom-right-radius: $radius;
|
26
|
+
border-bottom-left-radius: $radius;
|
27
|
+
}
|
28
|
+
}
|
29
|
+
|
30
|
+
@mixin border-left-radius($radius) {
|
31
|
+
@if $enable-rounded {
|
32
|
+
border-bottom-left-radius: $radius;
|
33
|
+
border-top-left-radius: $radius;
|
34
|
+
}
|
35
|
+
}
|
@@ -0,0 +1,86 @@
|
|
1
|
+
// Breakpoint viewport sizes and media queries.
|
2
|
+
//
|
3
|
+
// Breakpoints are defined as a map of (name: minimum width), order from small to large:
|
4
|
+
//
|
5
|
+
// (xs: 0, sm: 544px, md: 768px)
|
6
|
+
//
|
7
|
+
// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.
|
8
|
+
|
9
|
+
// Name of the next breakpoint, or null for the last breakpoint.
|
10
|
+
//
|
11
|
+
// >> breakpoint-next(sm)
|
12
|
+
// md
|
13
|
+
// >> breakpoint-next(sm, (xs: 0, sm: 544px, md: 768px))
|
14
|
+
// md
|
15
|
+
// >> breakpoint-next(sm, $breakpoint-names: (xs sm md))
|
16
|
+
// md
|
17
|
+
@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
|
18
|
+
$n: index($breakpoint-names, $name);
|
19
|
+
@return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
|
20
|
+
}
|
21
|
+
|
22
|
+
// Minimum breakpoint width. Null for the smallest (first) breakpoint.
|
23
|
+
//
|
24
|
+
// >> breakpoint-min(sm, (xs: 0, sm: 544px, md: 768px))
|
25
|
+
// 544px
|
26
|
+
@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
|
27
|
+
$min: map-get($breakpoints, $name);
|
28
|
+
@return if($min != 0, $min, null);
|
29
|
+
}
|
30
|
+
|
31
|
+
// Maximum breakpoint width. Null for the largest (last) breakpoint.
|
32
|
+
// The maximum value is calculated as the minimum of the next one less 0.1.
|
33
|
+
//
|
34
|
+
// >> breakpoint-max(sm, (xs: 0, sm: 544px, md: 768px))
|
35
|
+
// 767px
|
36
|
+
@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
|
37
|
+
$next: breakpoint-next($name, $breakpoints);
|
38
|
+
@return if($next, breakpoint-min($next, $breakpoints) - 1px, null);
|
39
|
+
}
|
40
|
+
|
41
|
+
// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
|
42
|
+
// Makes the @content apply to the given breakpoint and wider.
|
43
|
+
@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
|
44
|
+
$min: breakpoint-min($name, $breakpoints);
|
45
|
+
@if $min {
|
46
|
+
@media (min-width: $min) {
|
47
|
+
@content;
|
48
|
+
}
|
49
|
+
} @else {
|
50
|
+
@content;
|
51
|
+
}
|
52
|
+
}
|
53
|
+
|
54
|
+
// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
|
55
|
+
// Makes the @content apply to the given breakpoint and narrower.
|
56
|
+
@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
|
57
|
+
$max: breakpoint-max($name, $breakpoints);
|
58
|
+
@if $max {
|
59
|
+
@media (max-width: $max) {
|
60
|
+
@content;
|
61
|
+
}
|
62
|
+
} @else {
|
63
|
+
@content;
|
64
|
+
}
|
65
|
+
}
|
66
|
+
|
67
|
+
// Media between the breakpoint's minimum and maximum widths.
|
68
|
+
// No minimum for the smallest breakpoint, and no maximum for the largest one.
|
69
|
+
// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
|
70
|
+
@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
|
71
|
+
@include media-breakpoint-up($name, $breakpoints) {
|
72
|
+
@include media-breakpoint-down($name, $breakpoints) {
|
73
|
+
@content;
|
74
|
+
}
|
75
|
+
}
|
76
|
+
}
|
77
|
+
|
78
|
+
// Media that spans multiple breakpoint widths.
|
79
|
+
// Makes the @content apply between the min and max breakpoints
|
80
|
+
@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
|
81
|
+
@include media-breakpoint-up($lower, $breakpoints) {
|
82
|
+
@include media-breakpoint-down($upper, $breakpoints) {
|
83
|
+
@content;
|
84
|
+
}
|
85
|
+
}
|
86
|
+
}
|
@@ -0,0 +1,113 @@
|
|
1
|
+
// Button variants
|
2
|
+
//
|
3
|
+
// Easily pump out default styles, as well as :hover, :focus, :active,
|
4
|
+
// and disabled options for all buttons
|
5
|
+
|
6
|
+
@mixin button-variant($color, $background, $border) {
|
7
|
+
$active-background: darken($background, 10%);
|
8
|
+
$active-border: darken($border, 12%);
|
9
|
+
|
10
|
+
color: $color;
|
11
|
+
background-color: $background;
|
12
|
+
border-color: $border;
|
13
|
+
@include box-shadow($btn-box-shadow);
|
14
|
+
|
15
|
+
@include hover {
|
16
|
+
color: $color;
|
17
|
+
background-color: $active-background;
|
18
|
+
border-color: $active-border;
|
19
|
+
}
|
20
|
+
|
21
|
+
&:focus,
|
22
|
+
&.focus {
|
23
|
+
color: $color;
|
24
|
+
background-color: $active-background;
|
25
|
+
border-color: $active-border;
|
26
|
+
}
|
27
|
+
|
28
|
+
&:active,
|
29
|
+
&.active,
|
30
|
+
.open > &.dropdown-toggle {
|
31
|
+
color: $color;
|
32
|
+
background-color: $active-background;
|
33
|
+
border-color: $active-border;
|
34
|
+
// Remove the gradient for the pressed/active state
|
35
|
+
background-image: none;
|
36
|
+
@include box-shadow($btn-active-box-shadow);
|
37
|
+
|
38
|
+
&:hover,
|
39
|
+
&:focus,
|
40
|
+
&.focus {
|
41
|
+
color: $color;
|
42
|
+
background-color: darken($background, 17%);
|
43
|
+
border-color: darken($border, 25%);
|
44
|
+
}
|
45
|
+
}
|
46
|
+
|
47
|
+
&.disabled,
|
48
|
+
&:disabled {
|
49
|
+
&:focus,
|
50
|
+
&.focus {
|
51
|
+
background-color: $background;
|
52
|
+
border-color: $border;
|
53
|
+
}
|
54
|
+
@include hover {
|
55
|
+
background-color: $background;
|
56
|
+
border-color: $border;
|
57
|
+
}
|
58
|
+
}
|
59
|
+
}
|
60
|
+
|
61
|
+
@mixin button-outline-variant($color) {
|
62
|
+
color: $color;
|
63
|
+
background-image: none;
|
64
|
+
background-color: transparent;
|
65
|
+
border-color: $color;
|
66
|
+
|
67
|
+
@include hover {
|
68
|
+
color: #fff;
|
69
|
+
background-color: $color;
|
70
|
+
border-color: $color;
|
71
|
+
}
|
72
|
+
|
73
|
+
&:focus,
|
74
|
+
&.focus {
|
75
|
+
color: #fff;
|
76
|
+
background-color: $color;
|
77
|
+
border-color: $color;
|
78
|
+
}
|
79
|
+
|
80
|
+
&:active,
|
81
|
+
&.active,
|
82
|
+
.open > &.dropdown-toggle {
|
83
|
+
color: #fff;
|
84
|
+
background-color: $color;
|
85
|
+
border-color: $color;
|
86
|
+
|
87
|
+
&:hover,
|
88
|
+
&:focus,
|
89
|
+
&.focus {
|
90
|
+
color: #fff;
|
91
|
+
background-color: darken($color, 17%);
|
92
|
+
border-color: darken($color, 25%);
|
93
|
+
}
|
94
|
+
}
|
95
|
+
|
96
|
+
&.disabled,
|
97
|
+
&:disabled {
|
98
|
+
&:focus,
|
99
|
+
&.focus {
|
100
|
+
border-color: lighten($color, 20%);
|
101
|
+
}
|
102
|
+
@include hover {
|
103
|
+
border-color: lighten($color, 20%);
|
104
|
+
}
|
105
|
+
}
|
106
|
+
}
|
107
|
+
|
108
|
+
// Button sizes
|
109
|
+
@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
|
110
|
+
padding: $padding-y $padding-x;
|
111
|
+
font-size: $font-size;
|
112
|
+
@include border-radius($border-radius);
|
113
|
+
}
|
@@ -0,0 +1,44 @@
|
|
1
|
+
// Card variants
|
2
|
+
|
3
|
+
@mixin card-variant($background, $border) {
|
4
|
+
background-color: $background;
|
5
|
+
border-color: $border;
|
6
|
+
|
7
|
+
.card-header,
|
8
|
+
.card-footer {
|
9
|
+
background-color: transparent;
|
10
|
+
}
|
11
|
+
}
|
12
|
+
|
13
|
+
@mixin card-outline-variant($color) {
|
14
|
+
background-color: transparent;
|
15
|
+
border-color: $color;
|
16
|
+
}
|
17
|
+
|
18
|
+
//
|
19
|
+
// Inverse text within a card for use with dark backgrounds
|
20
|
+
//
|
21
|
+
|
22
|
+
@mixin card-inverse {
|
23
|
+
.card-header,
|
24
|
+
.card-footer {
|
25
|
+
border-color: rgba(255,255,255,.2);
|
26
|
+
}
|
27
|
+
.card-header,
|
28
|
+
.card-footer,
|
29
|
+
.card-title,
|
30
|
+
.card-blockquote {
|
31
|
+
color: #fff;
|
32
|
+
}
|
33
|
+
.card-link,
|
34
|
+
.card-text,
|
35
|
+
.card-subtitle,
|
36
|
+
.card-blockquote .blockquote-footer {
|
37
|
+
color: rgba(255,255,255,.65);
|
38
|
+
}
|
39
|
+
.card-link {
|
40
|
+
@include hover-focus {
|
41
|
+
color: $card-link-hover-color;
|
42
|
+
}
|
43
|
+
}
|
44
|
+
}
|
@@ -0,0 +1,86 @@
|
|
1
|
+
// Form validation states
|
2
|
+
//
|
3
|
+
// Used in _forms.scss to generate the form validation CSS for warnings, errors,
|
4
|
+
// and successes.
|
5
|
+
|
6
|
+
@mixin form-control-validation($color) {
|
7
|
+
// Color the label and help text
|
8
|
+
.form-control-feedback,
|
9
|
+
.form-control-label,
|
10
|
+
.form-check-label,
|
11
|
+
.form-check-inline,
|
12
|
+
.custom-control {
|
13
|
+
color: $color;
|
14
|
+
}
|
15
|
+
// Set the border and box shadow on specific inputs to match
|
16
|
+
.form-control {
|
17
|
+
border-color: $color;
|
18
|
+
// @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
|
19
|
+
|
20
|
+
&:focus {
|
21
|
+
// border-color: darken($border-color, 10%);
|
22
|
+
// $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
|
23
|
+
// @include box-shadow($shadow);
|
24
|
+
}
|
25
|
+
}
|
26
|
+
|
27
|
+
// Set validation states also for addons
|
28
|
+
.input-group-addon {
|
29
|
+
color: $color;
|
30
|
+
border-color: $color;
|
31
|
+
background-color: lighten($color, 40%);
|
32
|
+
}
|
33
|
+
// Optional feedback icon
|
34
|
+
.form-control-feedback {
|
35
|
+
color: $color;
|
36
|
+
}
|
37
|
+
}
|
38
|
+
|
39
|
+
// Form control focus state
|
40
|
+
//
|
41
|
+
// Generate a customized focus state and for any input with the specified color,
|
42
|
+
// which defaults to the `@input-border-focus` variable.
|
43
|
+
//
|
44
|
+
// We highly encourage you to not customize the default value, but instead use
|
45
|
+
// this to tweak colors on an as-needed basis. This aesthetic change is based on
|
46
|
+
// WebKit's default styles, but applicable to a wider range of browsers. Its
|
47
|
+
// usability and accessibility should be taken into account with any change.
|
48
|
+
//
|
49
|
+
// Example usage: change the default blue border and shadow to white for better
|
50
|
+
// contrast against a dark gray background.
|
51
|
+
@mixin form-control-focus() {
|
52
|
+
&:focus {
|
53
|
+
color: $input-color-focus;
|
54
|
+
background-color: $input-bg-focus;
|
55
|
+
border-color: $input-border-focus;
|
56
|
+
outline: none;
|
57
|
+
$shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $input-box-shadow-focus;
|
58
|
+
@include box-shadow($shadow);
|
59
|
+
}
|
60
|
+
}
|
61
|
+
|
62
|
+
// Form control sizing
|
63
|
+
//
|
64
|
+
// Relative text size, padding, and border-radii changes for form controls. For
|
65
|
+
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
|
66
|
+
// element gets special love because it's special, and that's a fact!
|
67
|
+
|
68
|
+
@mixin input-size($parent, $input-height, $padding-y, $padding-x, $font-size, $line-height, $border-radius) {
|
69
|
+
#{$parent} {
|
70
|
+
height: $input-height;
|
71
|
+
padding: $padding-y $padding-x;
|
72
|
+
font-size: $font-size;
|
73
|
+
line-height: $line-height;
|
74
|
+
@include border-radius($border-radius);
|
75
|
+
}
|
76
|
+
|
77
|
+
select#{$parent} {
|
78
|
+
height: $input-height;
|
79
|
+
line-height: $input-height;
|
80
|
+
}
|
81
|
+
|
82
|
+
textarea#{$parent},
|
83
|
+
select[multiple]#{$parent} {
|
84
|
+
height: auto;
|
85
|
+
}
|
86
|
+
}
|
@@ -0,0 +1,43 @@
|
|
1
|
+
// Gradients
|
2
|
+
|
3
|
+
// Horizontal gradient, from left to right
|
4
|
+
//
|
5
|
+
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
6
|
+
// Color stops are not available in IE9.
|
7
|
+
@mixin gradient-x($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
8
|
+
background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);
|
9
|
+
background-repeat: repeat-x;
|
10
|
+
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9
|
11
|
+
}
|
12
|
+
|
13
|
+
// Vertical gradient, from top to bottom
|
14
|
+
//
|
15
|
+
// Creates two color stops, start and end, by specifying a color and position for each color stop.
|
16
|
+
// Color stops are not available in IE9.
|
17
|
+
@mixin gradient-y($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
|
18
|
+
background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);
|
19
|
+
background-repeat: repeat-x;
|
20
|
+
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9
|
21
|
+
}
|
22
|
+
|
23
|
+
@mixin gradient-directional($start-color: #555, $end-color: #333, $deg: 45deg) {
|
24
|
+
background-repeat: repeat-x;
|
25
|
+
background-image: linear-gradient($deg, $start-color, $end-color);
|
26
|
+
}
|
27
|
+
@mixin gradient-x-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
28
|
+
background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
|
29
|
+
background-repeat: no-repeat;
|
30
|
+
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 gets no color-stop at all for proper fallback
|
31
|
+
}
|
32
|
+
@mixin gradient-y-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
|
33
|
+
background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
|
34
|
+
background-repeat: no-repeat;
|
35
|
+
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 gets no color-stop at all for proper fallback
|
36
|
+
}
|
37
|
+
@mixin gradient-radial($inner-color: #555, $outer-color: #333) {
|
38
|
+
background-image: radial-gradient(circle, $inner-color, $outer-color);
|
39
|
+
background-repeat: no-repeat;
|
40
|
+
}
|
41
|
+
@mixin gradient-striped($color: rgba(255,255,255,.15), $angle: 45deg) {
|
42
|
+
background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
|
43
|
+
}
|
@@ -0,0 +1,70 @@
|
|
1
|
+
// Framework grid generation
|
2
|
+
//
|
3
|
+
// Used only by Bootstrap to generate the correct number of grid classes given
|
4
|
+
// any value of `$grid-columns`.
|
5
|
+
|
6
|
+
@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
|
7
|
+
|
8
|
+
// Common properties for all breakpoints
|
9
|
+
%grid-column {
|
10
|
+
position: relative;
|
11
|
+
// Prevent columns from collapsing when empty
|
12
|
+
min-height: 1px;
|
13
|
+
// Inner gutter via padding
|
14
|
+
padding-right: ($gutter / 2);
|
15
|
+
padding-left: ($gutter / 2);
|
16
|
+
|
17
|
+
@if $enable-flex {
|
18
|
+
width: 100%;
|
19
|
+
}
|
20
|
+
}
|
21
|
+
|
22
|
+
$breakpoint-counter: 0;
|
23
|
+
@each $breakpoint in map-keys($breakpoints) {
|
24
|
+
$breakpoint-counter: ($breakpoint-counter + 1);
|
25
|
+
|
26
|
+
@for $i from 1 through $columns {
|
27
|
+
.col-#{$breakpoint}-#{$i} {
|
28
|
+
@extend %grid-column;
|
29
|
+
}
|
30
|
+
}
|
31
|
+
|
32
|
+
@include media-breakpoint-up($breakpoint, $breakpoints) {
|
33
|
+
// Provide basic `.col-{bp}` classes for equal-width flexbox columns
|
34
|
+
@if $enable-flex {
|
35
|
+
.col-#{$breakpoint} {
|
36
|
+
position: relative;
|
37
|
+
flex-basis: 0;
|
38
|
+
flex-grow: 1;
|
39
|
+
max-width: 100%;
|
40
|
+
min-height: 1px;
|
41
|
+
padding-right: ($grid-gutter-width / 2);
|
42
|
+
padding-left: ($grid-gutter-width / 2);
|
43
|
+
}
|
44
|
+
}
|
45
|
+
|
46
|
+
@for $i from 1 through $columns {
|
47
|
+
.col-#{$breakpoint}-#{$i} {
|
48
|
+
@include make-col($i, $columns);
|
49
|
+
}
|
50
|
+
}
|
51
|
+
|
52
|
+
@each $modifier in (pull, push) {
|
53
|
+
@for $i from 0 through $columns {
|
54
|
+
.#{$modifier}-#{$breakpoint}-#{$i} {
|
55
|
+
@include make-col-modifier($modifier, $i, $columns)
|
56
|
+
}
|
57
|
+
}
|
58
|
+
}
|
59
|
+
|
60
|
+
// `$columns - 1` because offsetting by the width of an entire row isn't possible
|
61
|
+
@for $i from 0 through ($columns - 1) {
|
62
|
+
@if $breakpoint-counter != 1 or $i != 0 { // Avoid emitting useless .offset-xs-0
|
63
|
+
.offset-#{$breakpoint}-#{$i} {
|
64
|
+
@include make-col-modifier(offset, $i, $columns)
|
65
|
+
}
|
66
|
+
}
|
67
|
+
}
|
68
|
+
}
|
69
|
+
}
|
70
|
+
}
|