bulma-rails 0.9.3 → 1.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (144) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +49 -14
  3. data/app/assets/stylesheets/bulma.scss +4 -0
  4. data/app/assets/stylesheets/sass/_index.scss +10 -0
  5. data/app/assets/stylesheets/sass/base/_index.scss +6 -0
  6. data/app/assets/stylesheets/sass/base/animations.scss +15 -0
  7. data/app/assets/stylesheets/sass/base/generic.scss +239 -0
  8. data/app/assets/stylesheets/sass/base/minireset.scss +92 -0
  9. data/app/assets/stylesheets/sass/base/skeleton.scss +126 -0
  10. data/app/assets/stylesheets/sass/components/_index.scss +13 -0
  11. data/app/assets/stylesheets/sass/components/breadcrumb.scss +139 -0
  12. data/app/assets/stylesheets/sass/components/card.scss +162 -0
  13. data/app/assets/stylesheets/sass/components/dropdown.scss +188 -0
  14. data/app/assets/stylesheets/sass/components/menu.scss +165 -0
  15. data/app/assets/stylesheets/sass/components/message.scss +183 -0
  16. data/app/assets/stylesheets/sass/components/modal.scss +164 -0
  17. data/app/assets/stylesheets/sass/components/navbar.scss +788 -0
  18. data/app/assets/stylesheets/sass/components/pagination.scss +379 -0
  19. data/app/assets/stylesheets/sass/components/panel.scss +218 -0
  20. data/app/assets/stylesheets/sass/components/tabs.scss +273 -0
  21. data/app/assets/stylesheets/sass/elements/_index.scss +16 -0
  22. data/app/assets/stylesheets/sass/elements/block.scss +6 -0
  23. data/app/assets/stylesheets/sass/elements/box.scss +59 -0
  24. data/app/assets/stylesheets/sass/elements/button.scss +640 -0
  25. data/app/assets/stylesheets/sass/elements/content.scss +283 -0
  26. data/app/assets/stylesheets/sass/elements/delete.scss +6 -0
  27. data/app/assets/stylesheets/sass/elements/icon.scss +67 -0
  28. data/app/assets/stylesheets/sass/elements/image.scss +62 -0
  29. data/app/assets/stylesheets/sass/elements/loader.scss +15 -0
  30. data/app/assets/stylesheets/sass/elements/notification.scss +105 -0
  31. data/app/assets/stylesheets/sass/elements/progress.scss +115 -0
  32. data/app/assets/stylesheets/sass/elements/table.scss +261 -0
  33. data/app/assets/stylesheets/sass/elements/tag.scss +219 -0
  34. data/app/assets/stylesheets/sass/elements/title.scss +128 -0
  35. data/app/assets/stylesheets/sass/form/_index.scss +9 -0
  36. data/app/assets/stylesheets/sass/form/checkbox-radio.scss +32 -0
  37. data/app/assets/stylesheets/sass/form/file.scss +330 -0
  38. data/app/assets/stylesheets/sass/form/input-textarea.scss +123 -0
  39. data/app/assets/stylesheets/sass/form/select.scss +143 -0
  40. data/app/assets/stylesheets/sass/form/shared.scss +172 -0
  41. data/app/assets/stylesheets/sass/form/tools.scss +341 -0
  42. data/app/assets/stylesheets/sass/grid/_index.scss +5 -0
  43. data/app/assets/stylesheets/sass/grid/columns-v2.scss +957 -0
  44. data/app/assets/stylesheets/sass/grid/columns.scss +877 -0
  45. data/app/assets/stylesheets/sass/grid/grid.scss +209 -0
  46. data/app/assets/stylesheets/sass/helpers/_index.scss +15 -0
  47. data/app/assets/stylesheets/sass/helpers/aspect-ratio.scss +10 -0
  48. data/app/assets/stylesheets/sass/helpers/border.scss +15 -0
  49. data/app/assets/stylesheets/sass/helpers/color.scss +364 -0
  50. data/app/assets/stylesheets/sass/helpers/flexbox.scss +62 -0
  51. data/app/assets/stylesheets/sass/helpers/float.scss +28 -0
  52. data/app/assets/stylesheets/sass/helpers/gap.scss +24 -0
  53. data/app/assets/stylesheets/sass/helpers/other.scss +19 -0
  54. data/app/assets/stylesheets/sass/helpers/overflow.scss +21 -0
  55. data/app/assets/stylesheets/sass/helpers/position.scss +19 -0
  56. data/app/assets/stylesheets/sass/helpers/spacing.scss +64 -0
  57. data/app/assets/stylesheets/sass/helpers/typography.scss +168 -0
  58. data/app/assets/stylesheets/sass/helpers/visibility.scss +221 -0
  59. data/app/assets/stylesheets/sass/layout/_index.scss +9 -0
  60. data/app/assets/stylesheets/sass/layout/container.scss +51 -0
  61. data/app/assets/stylesheets/sass/layout/footer.scss +23 -0
  62. data/app/assets/stylesheets/sass/layout/hero.scss +270 -0
  63. data/app/assets/stylesheets/sass/layout/level.scss +107 -0
  64. data/app/assets/stylesheets/sass/layout/media.scss +106 -0
  65. data/app/assets/stylesheets/sass/layout/section.scss +34 -0
  66. data/app/assets/stylesheets/sass/themes/_index.scss +35 -0
  67. data/app/assets/stylesheets/sass/themes/dark.scss +56 -0
  68. data/app/assets/stylesheets/sass/themes/light.scss +145 -0
  69. data/app/assets/stylesheets/sass/themes/setup.scss +174 -0
  70. data/app/assets/stylesheets/sass/utilities/_index.scss +7 -0
  71. data/app/assets/stylesheets/sass/utilities/controls.scss +85 -0
  72. data/app/assets/stylesheets/sass/utilities/css-variables.scss +425 -0
  73. data/app/assets/stylesheets/sass/utilities/derived-variables.scss +112 -0
  74. data/app/assets/stylesheets/sass/utilities/extends.scss +34 -0
  75. data/app/assets/stylesheets/sass/utilities/functions.scss +258 -0
  76. data/app/assets/stylesheets/sass/utilities/initial-variables.scss +155 -0
  77. data/app/assets/stylesheets/sass/utilities/mixins.scss +460 -0
  78. data/bulma-rails.gemspec +4 -6
  79. metadata +84 -74
  80. data/app/assets/stylesheets/bulma.sass +0 -10
  81. data/app/assets/stylesheets/sass/base/_all.sass +0 -6
  82. data/app/assets/stylesheets/sass/base/animations.sass +0 -5
  83. data/app/assets/stylesheets/sass/base/generic.sass +0 -145
  84. data/app/assets/stylesheets/sass/base/helpers.sass +0 -1
  85. data/app/assets/stylesheets/sass/base/minireset.sass +0 -79
  86. data/app/assets/stylesheets/sass/components/_all.sass +0 -15
  87. data/app/assets/stylesheets/sass/components/breadcrumb.sass +0 -77
  88. data/app/assets/stylesheets/sass/components/card.sass +0 -103
  89. data/app/assets/stylesheets/sass/components/dropdown.sass +0 -83
  90. data/app/assets/stylesheets/sass/components/level.sass +0 -79
  91. data/app/assets/stylesheets/sass/components/media.sass +0 -59
  92. data/app/assets/stylesheets/sass/components/menu.sass +0 -59
  93. data/app/assets/stylesheets/sass/components/message.sass +0 -101
  94. data/app/assets/stylesheets/sass/components/modal.sass +0 -117
  95. data/app/assets/stylesheets/sass/components/navbar.sass +0 -446
  96. data/app/assets/stylesheets/sass/components/pagination.sass +0 -166
  97. data/app/assets/stylesheets/sass/components/panel.sass +0 -121
  98. data/app/assets/stylesheets/sass/components/tabs.sass +0 -176
  99. data/app/assets/stylesheets/sass/elements/_all.sass +0 -16
  100. data/app/assets/stylesheets/sass/elements/box.sass +0 -26
  101. data/app/assets/stylesheets/sass/elements/button.sass +0 -345
  102. data/app/assets/stylesheets/sass/elements/container.sass +0 -29
  103. data/app/assets/stylesheets/sass/elements/content.sass +0 -159
  104. data/app/assets/stylesheets/sass/elements/form.sass +0 -1
  105. data/app/assets/stylesheets/sass/elements/icon.sass +0 -46
  106. data/app/assets/stylesheets/sass/elements/image.sass +0 -73
  107. data/app/assets/stylesheets/sass/elements/notification.sass +0 -52
  108. data/app/assets/stylesheets/sass/elements/other.sass +0 -31
  109. data/app/assets/stylesheets/sass/elements/progress.sass +0 -73
  110. data/app/assets/stylesheets/sass/elements/table.sass +0 -133
  111. data/app/assets/stylesheets/sass/elements/tag.sass +0 -140
  112. data/app/assets/stylesheets/sass/elements/title.sass +0 -70
  113. data/app/assets/stylesheets/sass/form/_all.sass +0 -9
  114. data/app/assets/stylesheets/sass/form/checkbox-radio.sass +0 -22
  115. data/app/assets/stylesheets/sass/form/file.sass +0 -184
  116. data/app/assets/stylesheets/sass/form/input-textarea.sass +0 -66
  117. data/app/assets/stylesheets/sass/form/select.sass +0 -87
  118. data/app/assets/stylesheets/sass/form/shared.sass +0 -60
  119. data/app/assets/stylesheets/sass/form/tools.sass +0 -215
  120. data/app/assets/stylesheets/sass/grid/_all.sass +0 -5
  121. data/app/assets/stylesheets/sass/grid/columns.sass +0 -513
  122. data/app/assets/stylesheets/sass/grid/tiles.sass +0 -36
  123. data/app/assets/stylesheets/sass/helpers/_all.sass +0 -12
  124. data/app/assets/stylesheets/sass/helpers/color.sass +0 -39
  125. data/app/assets/stylesheets/sass/helpers/flexbox.sass +0 -35
  126. data/app/assets/stylesheets/sass/helpers/float.sass +0 -10
  127. data/app/assets/stylesheets/sass/helpers/other.sass +0 -14
  128. data/app/assets/stylesheets/sass/helpers/overflow.sass +0 -2
  129. data/app/assets/stylesheets/sass/helpers/position.sass +0 -7
  130. data/app/assets/stylesheets/sass/helpers/spacing.sass +0 -31
  131. data/app/assets/stylesheets/sass/helpers/typography.sass +0 -103
  132. data/app/assets/stylesheets/sass/helpers/visibility.sass +0 -122
  133. data/app/assets/stylesheets/sass/layout/_all.sass +0 -6
  134. data/app/assets/stylesheets/sass/layout/footer.sass +0 -11
  135. data/app/assets/stylesheets/sass/layout/hero.sass +0 -153
  136. data/app/assets/stylesheets/sass/layout/section.sass +0 -17
  137. data/app/assets/stylesheets/sass/utilities/_all.sass +0 -9
  138. data/app/assets/stylesheets/sass/utilities/animations.sass +0 -1
  139. data/app/assets/stylesheets/sass/utilities/controls.sass +0 -49
  140. data/app/assets/stylesheets/sass/utilities/derived-variables.sass +0 -114
  141. data/app/assets/stylesheets/sass/utilities/extends.sass +0 -25
  142. data/app/assets/stylesheets/sass/utilities/functions.sass +0 -136
  143. data/app/assets/stylesheets/sass/utilities/initial-variables.sass +0 -78
  144. data/app/assets/stylesheets/sass/utilities/mixins.sass +0 -280
@@ -1,103 +0,0 @@
1
- @import "../utilities/mixins"
2
-
3
- =typography-size($target:'')
4
- @each $size in $sizes
5
- $i: index($sizes, $size)
6
- .is-size-#{$i}#{if($target == '', '', '-' + $target)}
7
- font-size: $size !important
8
-
9
- +typography-size()
10
-
11
- +mobile
12
- +typography-size('mobile')
13
-
14
- +tablet
15
- +typography-size('tablet')
16
-
17
- +touch
18
- +typography-size('touch')
19
-
20
- +desktop
21
- +typography-size('desktop')
22
-
23
- +widescreen
24
- +typography-size('widescreen')
25
-
26
- +fullhd
27
- +typography-size('fullhd')
28
-
29
- $alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'right': 'right')
30
-
31
- @each $alignment, $text-align in $alignments
32
- .has-text-#{$alignment}
33
- text-align: #{$text-align} !important
34
-
35
- @each $alignment, $text-align in $alignments
36
- +mobile
37
- .has-text-#{$alignment}-mobile
38
- text-align: #{$text-align} !important
39
- +tablet
40
- .has-text-#{$alignment}-tablet
41
- text-align: #{$text-align} !important
42
- +tablet-only
43
- .has-text-#{$alignment}-tablet-only
44
- text-align: #{$text-align} !important
45
- +touch
46
- .has-text-#{$alignment}-touch
47
- text-align: #{$text-align} !important
48
- +desktop
49
- .has-text-#{$alignment}-desktop
50
- text-align: #{$text-align} !important
51
- +desktop-only
52
- .has-text-#{$alignment}-desktop-only
53
- text-align: #{$text-align} !important
54
- +widescreen
55
- .has-text-#{$alignment}-widescreen
56
- text-align: #{$text-align} !important
57
- +widescreen-only
58
- .has-text-#{$alignment}-widescreen-only
59
- text-align: #{$text-align} !important
60
- +fullhd
61
- .has-text-#{$alignment}-fullhd
62
- text-align: #{$text-align} !important
63
-
64
- .is-capitalized
65
- text-transform: capitalize !important
66
-
67
- .is-lowercase
68
- text-transform: lowercase !important
69
-
70
- .is-uppercase
71
- text-transform: uppercase !important
72
-
73
- .is-italic
74
- font-style: italic !important
75
-
76
- .is-underlined
77
- text-decoration: underline !important
78
-
79
- .has-text-weight-light
80
- font-weight: $weight-light !important
81
- .has-text-weight-normal
82
- font-weight: $weight-normal !important
83
- .has-text-weight-medium
84
- font-weight: $weight-medium !important
85
- .has-text-weight-semibold
86
- font-weight: $weight-semibold !important
87
- .has-text-weight-bold
88
- font-weight: $weight-bold !important
89
-
90
- .is-family-primary
91
- font-family: $family-primary !important
92
-
93
- .is-family-secondary
94
- font-family: $family-secondary !important
95
-
96
- .is-family-sans-serif
97
- font-family: $family-sans-serif !important
98
-
99
- .is-family-monospace
100
- font-family: $family-monospace !important
101
-
102
- .is-family-code
103
- font-family: $family-code !important
@@ -1,122 +0,0 @@
1
- @import "../utilities/mixins"
2
-
3
- $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
4
-
5
- @each $display in $displays
6
- .is-#{$display}
7
- display: #{$display} !important
8
- +mobile
9
- .is-#{$display}-mobile
10
- display: #{$display} !important
11
- +tablet
12
- .is-#{$display}-tablet
13
- display: #{$display} !important
14
- +tablet-only
15
- .is-#{$display}-tablet-only
16
- display: #{$display} !important
17
- +touch
18
- .is-#{$display}-touch
19
- display: #{$display} !important
20
- +desktop
21
- .is-#{$display}-desktop
22
- display: #{$display} !important
23
- +desktop-only
24
- .is-#{$display}-desktop-only
25
- display: #{$display} !important
26
- +widescreen
27
- .is-#{$display}-widescreen
28
- display: #{$display} !important
29
- +widescreen-only
30
- .is-#{$display}-widescreen-only
31
- display: #{$display} !important
32
- +fullhd
33
- .is-#{$display}-fullhd
34
- display: #{$display} !important
35
-
36
- .is-hidden
37
- display: none !important
38
-
39
- .is-sr-only
40
- border: none !important
41
- clip: rect(0, 0, 0, 0) !important
42
- height: 0.01em !important
43
- overflow: hidden !important
44
- padding: 0 !important
45
- position: absolute !important
46
- white-space: nowrap !important
47
- width: 0.01em !important
48
-
49
- +mobile
50
- .is-hidden-mobile
51
- display: none !important
52
-
53
- +tablet
54
- .is-hidden-tablet
55
- display: none !important
56
-
57
- +tablet-only
58
- .is-hidden-tablet-only
59
- display: none !important
60
-
61
- +touch
62
- .is-hidden-touch
63
- display: none !important
64
-
65
- +desktop
66
- .is-hidden-desktop
67
- display: none !important
68
-
69
- +desktop-only
70
- .is-hidden-desktop-only
71
- display: none !important
72
-
73
- +widescreen
74
- .is-hidden-widescreen
75
- display: none !important
76
-
77
- +widescreen-only
78
- .is-hidden-widescreen-only
79
- display: none !important
80
-
81
- +fullhd
82
- .is-hidden-fullhd
83
- display: none !important
84
-
85
- .is-invisible
86
- visibility: hidden !important
87
-
88
- +mobile
89
- .is-invisible-mobile
90
- visibility: hidden !important
91
-
92
- +tablet
93
- .is-invisible-tablet
94
- visibility: hidden !important
95
-
96
- +tablet-only
97
- .is-invisible-tablet-only
98
- visibility: hidden !important
99
-
100
- +touch
101
- .is-invisible-touch
102
- visibility: hidden !important
103
-
104
- +desktop
105
- .is-invisible-desktop
106
- visibility: hidden !important
107
-
108
- +desktop-only
109
- .is-invisible-desktop-only
110
- visibility: hidden !important
111
-
112
- +widescreen
113
- .is-invisible-widescreen
114
- visibility: hidden !important
115
-
116
- +widescreen-only
117
- .is-invisible-widescreen-only
118
- visibility: hidden !important
119
-
120
- +fullhd
121
- .is-invisible-fullhd
122
- visibility: hidden !important
@@ -1,6 +0,0 @@
1
- /* Bulma Layout */
2
- @charset "utf-8"
3
-
4
- @import "hero"
5
- @import "section"
6
- @import "footer"
@@ -1,11 +0,0 @@
1
- @import "../utilities/derived-variables"
2
-
3
- $footer-background-color: $scheme-main-bis !default
4
- $footer-color: false !default
5
- $footer-padding: 3rem 1.5rem 6rem !default
6
-
7
- .footer
8
- background-color: $footer-background-color
9
- padding: $footer-padding
10
- @if $footer-color
11
- color: $footer-color
@@ -1,153 +0,0 @@
1
- @import "../utilities/mixins"
2
-
3
- $hero-body-padding: 3rem 1.5rem !default
4
- $hero-body-padding-tablet: 3rem 3rem !default
5
- $hero-body-padding-small: 1.5rem !default
6
- $hero-body-padding-medium: 9rem 4.5rem !default
7
- $hero-body-padding-large: 18rem 6rem !default
8
-
9
- $hero-colors: $colors !default
10
-
11
- // Main container
12
- .hero
13
- align-items: stretch
14
- display: flex
15
- flex-direction: column
16
- justify-content: space-between
17
- .navbar
18
- background: none
19
- .tabs
20
- ul
21
- border-bottom: none
22
- // Colors
23
- @each $name, $pair in $hero-colors
24
- $color: nth($pair, 1)
25
- $color-invert: nth($pair, 2)
26
- &.is-#{$name}
27
- background-color: $color
28
- color: $color-invert
29
- a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
30
- strong
31
- color: inherit
32
- .title
33
- color: $color-invert
34
- .subtitle
35
- color: bulmaRgba($color-invert, 0.9)
36
- a:not(.button),
37
- strong
38
- color: $color-invert
39
- .navbar-menu
40
- +touch
41
- background-color: $color
42
- .navbar-item,
43
- .navbar-link
44
- color: bulmaRgba($color-invert, 0.7)
45
- a.navbar-item,
46
- .navbar-link
47
- &:hover,
48
- &.is-active
49
- background-color: bulmaDarken($color, 5%)
50
- color: $color-invert
51
- .tabs
52
- a
53
- color: $color-invert
54
- opacity: 0.9
55
- &:hover
56
- opacity: 1
57
- li
58
- &.is-active a
59
- color: $color !important
60
- opacity: 1
61
- &.is-boxed,
62
- &.is-toggle
63
- a
64
- color: $color-invert
65
- &:hover
66
- background-color: bulmaRgba($scheme-invert, 0.1)
67
- li.is-active a
68
- &,
69
- &:hover
70
- background-color: $color-invert
71
- border-color: $color-invert
72
- color: $color
73
- // Modifiers
74
- @if type-of($color) == 'color'
75
- &.is-bold
76
- $gradient-top-left: darken(saturate(adjust-hue($color, -10deg), 10%), 10%)
77
- $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%)
78
- background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
79
- +mobile
80
- .navbar-menu
81
- background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
82
- // Sizes
83
- &.is-small
84
- .hero-body
85
- padding: $hero-body-padding-small
86
- &.is-medium
87
- +tablet
88
- .hero-body
89
- padding: $hero-body-padding-medium
90
- &.is-large
91
- +tablet
92
- .hero-body
93
- padding: $hero-body-padding-large
94
- &.is-halfheight,
95
- &.is-fullheight,
96
- &.is-fullheight-with-navbar
97
- .hero-body
98
- align-items: center
99
- display: flex
100
- & > .container
101
- flex-grow: 1
102
- flex-shrink: 1
103
- &.is-halfheight
104
- min-height: 50vh
105
- &.is-fullheight
106
- min-height: 100vh
107
-
108
- // Components
109
-
110
- .hero-video
111
- @extend %overlay
112
- overflow: hidden
113
- video
114
- left: 50%
115
- min-height: 100%
116
- min-width: 100%
117
- position: absolute
118
- top: 50%
119
- transform: translate3d(-50%, -50%, 0)
120
- // Modifiers
121
- &.is-transparent
122
- opacity: 0.3
123
- // Responsiveness
124
- +mobile
125
- display: none
126
-
127
- .hero-buttons
128
- margin-top: 1.5rem
129
- // Responsiveness
130
- +mobile
131
- .button
132
- display: flex
133
- &:not(:last-child)
134
- margin-bottom: 0.75rem
135
- +tablet
136
- display: flex
137
- justify-content: center
138
- .button:not(:last-child)
139
- +ltr-property("margin", 1.5rem)
140
-
141
- // Containers
142
-
143
- .hero-head,
144
- .hero-foot
145
- flex-grow: 0
146
- flex-shrink: 0
147
-
148
- .hero-body
149
- flex-grow: 1
150
- flex-shrink: 0
151
- padding: $hero-body-padding
152
- +tablet
153
- padding: $hero-body-padding-tablet
@@ -1,17 +0,0 @@
1
- @import "../utilities/mixins"
2
-
3
- $section-padding: 3rem 1.5rem !default
4
- $section-padding-desktop: 3rem 3rem !default
5
- $section-padding-medium: 9rem 4.5rem !default
6
- $section-padding-large: 18rem 6rem !default
7
-
8
- .section
9
- padding: $section-padding
10
- // Responsiveness
11
- +desktop
12
- padding: $section-padding-desktop
13
- // Sizes
14
- &.is-medium
15
- padding: $section-padding-medium
16
- &.is-large
17
- padding: $section-padding-large
@@ -1,9 +0,0 @@
1
- /* Bulma Utilities */
2
- @charset "utf-8"
3
-
4
- @import "initial-variables"
5
- @import "functions"
6
- @import "derived-variables"
7
- @import "mixins"
8
- @import "controls"
9
- @import "extends"
@@ -1 +0,0 @@
1
- @warn "The animations.sass file has MOVED. It is now in the /base folder. Please import sass/base/animations instead."
@@ -1,49 +0,0 @@
1
- @import "derived-variables"
2
-
3
- $control-radius: $radius !default
4
- $control-radius-small: $radius-small !default
5
-
6
- $control-border-width: 1px !default
7
-
8
- $control-height: 2.5em !default
9
- $control-line-height: 1.5 !default
10
-
11
- $control-padding-vertical: calc(0.5em - #{$control-border-width}) !default
12
- $control-padding-horizontal: calc(0.75em - #{$control-border-width}) !default
13
-
14
- =control
15
- -moz-appearance: none
16
- -webkit-appearance: none
17
- align-items: center
18
- border: $control-border-width solid transparent
19
- border-radius: $control-radius
20
- box-shadow: none
21
- display: inline-flex
22
- font-size: $size-normal
23
- height: $control-height
24
- justify-content: flex-start
25
- line-height: $control-line-height
26
- padding-bottom: $control-padding-vertical
27
- padding-left: $control-padding-horizontal
28
- padding-right: $control-padding-horizontal
29
- padding-top: $control-padding-vertical
30
- position: relative
31
- vertical-align: top
32
- // States
33
- &:focus,
34
- &.is-focused,
35
- &:active,
36
- &.is-active
37
- outline: none
38
- &[disabled],
39
- fieldset[disabled] &
40
- cursor: not-allowed
41
-
42
- // The controls sizes use mixins so they can be used at different breakpoints
43
- =control-small
44
- border-radius: $control-radius-small
45
- font-size: $size-small
46
- =control-medium
47
- font-size: $size-medium
48
- =control-large
49
- font-size: $size-large
@@ -1,114 +0,0 @@
1
- @import "initial-variables"
2
- @import "functions"
3
-
4
- $primary: $turquoise !default
5
-
6
- $info: $cyan !default
7
- $success: $green !default
8
- $warning: $yellow !default
9
- $danger: $red !default
10
-
11
- $light: $white-ter !default
12
- $dark: $grey-darker !default
13
-
14
- // Invert colors
15
-
16
- $orange-invert: findColorInvert($orange) !default
17
- $yellow-invert: findColorInvert($yellow) !default
18
- $green-invert: findColorInvert($green) !default
19
- $turquoise-invert: findColorInvert($turquoise) !default
20
- $cyan-invert: findColorInvert($cyan) !default
21
- $blue-invert: findColorInvert($blue) !default
22
- $purple-invert: findColorInvert($purple) !default
23
- $red-invert: findColorInvert($red) !default
24
-
25
- $primary-invert: findColorInvert($primary) !default
26
- $primary-light: findLightColor($primary) !default
27
- $primary-dark: findDarkColor($primary) !default
28
- $info-invert: findColorInvert($info) !default
29
- $info-light: findLightColor($info) !default
30
- $info-dark: findDarkColor($info) !default
31
- $success-invert: findColorInvert($success) !default
32
- $success-light: findLightColor($success) !default
33
- $success-dark: findDarkColor($success) !default
34
- $warning-invert: findColorInvert($warning) !default
35
- $warning-light: findLightColor($warning) !default
36
- $warning-dark: findDarkColor($warning) !default
37
- $danger-invert: findColorInvert($danger) !default
38
- $danger-light: findLightColor($danger) !default
39
- $danger-dark: findDarkColor($danger) !default
40
- $light-invert: findColorInvert($light) !default
41
- $dark-invert: findColorInvert($dark) !default
42
-
43
- // General colors
44
-
45
- $scheme-main: $white !default
46
- $scheme-main-bis: $white-bis !default
47
- $scheme-main-ter: $white-ter !default
48
- $scheme-invert: $black !default
49
- $scheme-invert-bis: $black-bis !default
50
- $scheme-invert-ter: $black-ter !default
51
-
52
- $background: $white-ter !default
53
-
54
- $border: $grey-lighter !default
55
- $border-hover: $grey-light !default
56
- $border-light: $grey-lightest !default
57
- $border-light-hover: $grey-light !default
58
-
59
- // Text colors
60
-
61
- $text: $grey-dark !default
62
- $text-invert: findColorInvert($text) !default
63
- $text-light: $grey !default
64
- $text-strong: $grey-darker !default
65
-
66
- // Code colors
67
-
68
- $code: darken($red, 15%) !default
69
- $code-background: $background !default
70
-
71
- $pre: $text !default
72
- $pre-background: $background !default
73
-
74
- // Link colors
75
-
76
- $link: $blue !default
77
- $link-invert: findColorInvert($link) !default
78
- $link-light: findLightColor($link) !default
79
- $link-dark: findDarkColor($link) !default
80
- $link-visited: $purple !default
81
-
82
- $link-hover: $grey-darker !default
83
- $link-hover-border: $grey-light !default
84
-
85
- $link-focus: $grey-darker !default
86
- $link-focus-border: $blue !default
87
-
88
- $link-active: $grey-darker !default
89
- $link-active-border: $grey-dark !default
90
-
91
- // Typography
92
-
93
- $family-primary: $family-sans-serif !default
94
- $family-secondary: $family-sans-serif !default
95
- $family-code: $family-monospace !default
96
-
97
- $size-small: $size-7 !default
98
- $size-normal: $size-6 !default
99
- $size-medium: $size-5 !default
100
- $size-large: $size-4 !default
101
-
102
- // Effects
103
-
104
- $shadow: 0 0.5em 1em -0.125em rgba($scheme-invert, 0.1), 0 0px 0 1px rgba($scheme-invert, 0.02) !default
105
-
106
- // Lists and maps
107
- $custom-colors: null !default
108
- $custom-shades: null !default
109
-
110
- $colors: mergeColorMaps(("white": ($white, $black), "black": ($black, $white), "light": ($light, $light-invert), "dark": ($dark, $dark-invert), "primary": ($primary, $primary-invert, $primary-light, $primary-dark), "link": ($link, $link-invert, $link-light, $link-dark), "info": ($info, $info-invert, $info-light, $info-dark), "success": ($success, $success-invert, $success-light, $success-dark), "warning": ($warning, $warning-invert, $warning-light, $warning-dark), "danger": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors) !default
111
-
112
- $shades: mergeColorMaps(("black-bis": $black-bis, "black-ter": $black-ter, "grey-darker": $grey-darker, "grey-dark": $grey-dark, "grey": $grey, "grey-light": $grey-light, "grey-lighter": $grey-lighter, "white-ter": $white-ter, "white-bis": $white-bis), $custom-shades) !default
113
-
114
- $sizes: $size-1 $size-2 $size-3 $size-4 $size-5 $size-6 $size-7 !default
@@ -1,25 +0,0 @@
1
- @import "mixins"
2
-
3
- %control
4
- +control
5
-
6
- %unselectable
7
- +unselectable
8
-
9
- %arrow
10
- +arrow
11
-
12
- %block
13
- +block
14
-
15
- %delete
16
- +delete
17
-
18
- %loader
19
- +loader
20
-
21
- %overlay
22
- +overlay
23
-
24
- %reset
25
- +reset