ols-theme 0.8.0 → 0.9.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (146) hide show
  1. checksums.yaml +4 -4
  2. data/LICENSE.txt +21 -21
  3. data/README.md +50 -50
  4. data/_includes/announcement-blog-metadata.html +78 -0
  5. data/_includes/cohort-loop.html +41 -0
  6. data/_includes/cohort-metadata.html +34 -0
  7. data/_includes/default-footer.html +3 -3
  8. data/_includes/default-header.html +33 -34
  9. data/_includes/detailed-schedule.md +11 -11
  10. data/_includes/external-entities.html +1 -1
  11. data/_includes/overall-schedule.md +5 -5
  12. data/_includes/people.html +79 -81
  13. data/_includes/projects-participants.html +61 -0
  14. data/_includes/schedule.md +123 -2
  15. data/_includes/timeline.md +24 -24
  16. data/_includes/toc.html +11 -11
  17. data/_includes/week.md +54 -49
  18. data/_layouts/base.html +64 -66
  19. data/_layouts/default.html +39 -37
  20. data/_layouts/index.html +7 -0
  21. data/_layouts/page.html +8 -8
  22. data/_layouts/people.html +105 -373
  23. data/_layouts/post.html +5 -5
  24. data/_layouts/posts.html +51 -51
  25. data/_sass/bulma/CHANGELOG.md +1254 -1254
  26. data/_sass/bulma/LICENSE +21 -21
  27. data/_sass/bulma/README.md +124 -124
  28. data/_sass/bulma/bulma.sass +9 -9
  29. data/_sass/bulma/css/bulma.css +10598 -10598
  30. data/_sass/bulma/package.json +52 -52
  31. data/_sass/bulma/sass/base/_all.sass +5 -5
  32. data/_sass/bulma/sass/base/generic.sass +142 -142
  33. data/_sass/bulma/sass/base/helpers.sass +281 -281
  34. data/_sass/bulma/sass/base/minireset.sass +85 -85
  35. data/_sass/bulma/sass/components/_all.sass +15 -15
  36. data/_sass/bulma/sass/components/breadcrumb.sass +75 -75
  37. data/_sass/bulma/sass/components/card.sass +79 -79
  38. data/_sass/bulma/sass/components/dropdown.sass +81 -81
  39. data/_sass/bulma/sass/components/level.sass +77 -77
  40. data/_sass/bulma/sass/components/list.sass +39 -39
  41. data/_sass/bulma/sass/components/media.sass +48 -48
  42. data/_sass/bulma/sass/components/menu.sass +57 -57
  43. data/_sass/bulma/sass/components/message.sass +87 -87
  44. data/_sass/bulma/sass/components/modal.sass +113 -113
  45. data/_sass/bulma/sass/components/navbar.sass +443 -443
  46. data/_sass/bulma/sass/components/pagination.sass +149 -149
  47. data/_sass/bulma/sass/components/panel.sass +103 -103
  48. data/_sass/bulma/sass/components/tabs.sass +151 -151
  49. data/_sass/bulma/sass/elements/_all.sass +15 -15
  50. data/_sass/bulma/sass/elements/box.sass +24 -24
  51. data/_sass/bulma/sass/elements/button.sass +305 -305
  52. data/_sass/bulma/sass/elements/container.sass +23 -23
  53. data/_sass/bulma/sass/elements/content.sass +155 -155
  54. data/_sass/bulma/sass/elements/form.sass +1 -1
  55. data/_sass/bulma/sass/elements/icon.sass +21 -21
  56. data/_sass/bulma/sass/elements/image.sass +69 -69
  57. data/_sass/bulma/sass/elements/notification.sass +35 -35
  58. data/_sass/bulma/sass/elements/other.sass +39 -39
  59. data/_sass/bulma/sass/elements/progress.sass +67 -67
  60. data/_sass/bulma/sass/elements/table.sass +127 -127
  61. data/_sass/bulma/sass/elements/tag.sass +121 -121
  62. data/_sass/bulma/sass/elements/title.sass +70 -70
  63. data/_sass/bulma/sass/form/_all.sass +8 -8
  64. data/_sass/bulma/sass/form/checkbox-radio.sass +21 -21
  65. data/_sass/bulma/sass/form/file.sass +180 -180
  66. data/_sass/bulma/sass/form/input-textarea.sass +60 -60
  67. data/_sass/bulma/sass/form/select.sass +85 -85
  68. data/_sass/bulma/sass/form/shared.sass +55 -55
  69. data/_sass/bulma/sass/form/tools.sass +205 -205
  70. data/_sass/bulma/sass/grid/_all.sass +4 -4
  71. data/_sass/bulma/sass/grid/columns.sass +504 -504
  72. data/_sass/bulma/sass/grid/tiles.sass +34 -34
  73. data/_sass/bulma/sass/layout/_all.sass +5 -5
  74. data/_sass/bulma/sass/layout/footer.sass +9 -9
  75. data/_sass/bulma/sass/layout/hero.sass +143 -143
  76. data/_sass/bulma/sass/layout/section.sass +13 -13
  77. data/_sass/bulma/sass/utilities/_all.sass +8 -8
  78. data/_sass/bulma/sass/utilities/animations.sass +5 -5
  79. data/_sass/bulma/sass/utilities/controls.sass +50 -50
  80. data/_sass/bulma/sass/utilities/derived-variables.sass +85 -85
  81. data/_sass/bulma/sass/utilities/functions.sass +62 -62
  82. data/_sass/bulma/sass/utilities/initial-variables.sass +76 -76
  83. data/_sass/bulma/sass/utilities/mixins.sass +261 -261
  84. data/_sass/bulma-collapsible.sass +15 -0
  85. metadata +9 -64
  86. data/assets/css/custom.scss +0 -422
  87. data/assets/images/2019-09-24-application.png +0 -0
  88. data/assets/images/2019-10-18-projects.jpg +0 -0
  89. data/assets/images/2019-10-21-storytelling.jpeg +0 -0
  90. data/assets/images/2019-11-13-difference-with-elife-innovation-leaders.jpg +0 -0
  91. data/assets/images/2019-11-25-blog2.png +0 -0
  92. data/assets/images/2019-11-25-blog3.png +0 -0
  93. data/assets/images/2019-11-25-blog4.png +0 -0
  94. data/assets/images/2019-11-25-blog5.png +0 -0
  95. data/assets/images/2019-11-25-blog6.png +0 -0
  96. data/assets/images/2019-11-25-header-expert.jpeg +0 -0
  97. data/assets/images/2020-ally-training.jpg +0 -0
  98. data/assets/images/2021-04-30-ols-2-blog-2.png +0 -0
  99. data/assets/images/2021-04-30-ols-2-blog.png +0 -0
  100. data/assets/images/2021-12-21-wt-open-research-fund-header.png +0 -0
  101. data/assets/images/2022-01-04-esthers-mentoring-blog-illustration.jpg +0 -0
  102. data/assets/images/2022-01-27-ols-czi-funding.jpg +0 -0
  103. data/assets/images/2022-02-18-for-hire.jpg +0 -0
  104. data/assets/images/2022-04-01-header-image-speed-blod-nadine.jpg +0 -0
  105. data/assets/images/2022-05-13-os-hobby-blog.jpg +0 -0
  106. data/assets/images/2022-07-18-ismaelkg-crinkle.png +0 -0
  107. data/assets/images/2022-07-18-ismaelkg-timeline-image.png +0 -0
  108. data/assets/images/2022-07-18-ismaelkg-watches.jpg +0 -0
  109. data/assets/images/2022-07-18-osmooc-logo.png +0 -0
  110. data/assets/images/2022-07-18-osmooc-modules.png +0 -0
  111. data/assets/images/2022-07-18-tudelft-history.png +0 -0
  112. data/assets/images/2022-07-18-twitter.png +0 -0
  113. data/assets/images/2022-08-adi-goldstein-unsplash.jpg +0 -0
  114. data/assets/images/2022-08-paz-meme.png +0 -0
  115. data/assets/images/2022-08-paz.jpg +0 -0
  116. data/assets/images/2022-12-andrea-sanchez.jpg +0 -0
  117. data/assets/images/2022-12-ecg-grant-announcement.png +0 -0
  118. data/assets/images/2022-12-jon-tyson-unsplash.jpg +0 -0
  119. data/assets/images/2022-12-melissa-black.jpg +0 -0
  120. data/assets/images/2022-12-mitchell-luo-unsplash.jpg +0 -0
  121. data/assets/images/2022-12-ols-resident-fellows.jpg +0 -0
  122. data/assets/images/2022-12-pexels-linda-ellershein.jpg +0 -0
  123. data/assets/images/2022-12-reina-camacho.png +0 -0
  124. data/assets/images/2022-WT-OLS-Job-Description.pdf +0 -0
  125. data/assets/images/2023-02-1-milad-fakurian-0n1pmev3w2A-unsplash.jpg +0 -0
  126. data/assets/images/2023-04-18-introducing-the-new-OLS/colourrefresh.png +0 -0
  127. data/assets/images/2023-04-18-introducing-the-new-OLS/identity-poster.png +0 -0
  128. data/assets/images/2023-04-18-introducing-the-new-OLS/logo-refresh.png +0 -0
  129. data/assets/images/2023-04-18-introducing-the-new-OLS/logomark.png +0 -0
  130. data/assets/images/2023-04-18-introducing-the-new-OLS/open-by-design.png +0 -0
  131. data/assets/images/2023-04-18-introducing-the-new-OLS/open-seeds.png +0 -0
  132. data/assets/images/2023-05-debs.jpg +0 -0
  133. data/assets/images/2023-05-taj.jpg +0 -0
  134. data/assets/images/about.jpg +0 -0
  135. data/assets/images/code-of-conduct.jpg +0 -0
  136. data/assets/images/index.jpg +0 -0
  137. data/assets/images/logo.png +0 -0
  138. data/assets/images/ols-1/project-participants.jpg +0 -0
  139. data/assets/images/organizations/denbi.png +0 -0
  140. data/assets/images/organizations/elixir.png +0 -0
  141. data/assets/images/organizations/mozilla.jpg +0 -0
  142. data/assets/images/posts.jpg +0 -0
  143. data/assets/images/schedule.png +0 -0
  144. data/assets/images/syllabus.jpg +0 -0
  145. data/assets/js/posts.js +0 -21
  146. data/assets/js/scripts.js +0 -52
@@ -1,34 +1,34 @@
1
- $tile-spacing: 0.75rem !default
2
-
3
- .tile
4
- align-items: stretch
5
- display: block
6
- flex-basis: 0
7
- flex-grow: 1
8
- flex-shrink: 1
9
- min-height: min-content
10
- // Modifiers
11
- &.is-ancestor
12
- margin-left: $tile-spacing * -1
13
- margin-right: $tile-spacing * -1
14
- margin-top: $tile-spacing * -1
15
- &:last-child
16
- margin-bottom: $tile-spacing * -1
17
- &:not(:last-child)
18
- margin-bottom: $tile-spacing
19
- &.is-child
20
- margin: 0 !important
21
- &.is-parent
22
- padding: $tile-spacing
23
- &.is-vertical
24
- flex-direction: column
25
- & > .tile.is-child:not(:last-child)
26
- margin-bottom: 1.5rem !important
27
- // Responsiveness
28
- +tablet
29
- &:not(.is-child)
30
- display: flex
31
- @for $i from 1 through 12
32
- &.is-#{$i}
33
- flex: none
34
- width: ($i / 12) * 100%
1
+ $tile-spacing: 0.75rem !default
2
+
3
+ .tile
4
+ align-items: stretch
5
+ display: block
6
+ flex-basis: 0
7
+ flex-grow: 1
8
+ flex-shrink: 1
9
+ min-height: min-content
10
+ // Modifiers
11
+ &.is-ancestor
12
+ margin-left: $tile-spacing * -1
13
+ margin-right: $tile-spacing * -1
14
+ margin-top: $tile-spacing * -1
15
+ &:last-child
16
+ margin-bottom: $tile-spacing * -1
17
+ &:not(:last-child)
18
+ margin-bottom: $tile-spacing
19
+ &.is-child
20
+ margin: 0 !important
21
+ &.is-parent
22
+ padding: $tile-spacing
23
+ &.is-vertical
24
+ flex-direction: column
25
+ & > .tile.is-child:not(:last-child)
26
+ margin-bottom: 1.5rem !important
27
+ // Responsiveness
28
+ +tablet
29
+ &:not(.is-child)
30
+ display: flex
31
+ @for $i from 1 through 12
32
+ &.is-#{$i}
33
+ flex: none
34
+ width: ($i / 12) * 100%
@@ -1,5 +1,5 @@
1
- @charset "utf-8"
2
-
3
- @import "hero.sass"
4
- @import "section.sass"
5
- @import "footer.sass"
1
+ @charset "utf-8"
2
+
3
+ @import "hero.sass"
4
+ @import "section.sass"
5
+ @import "footer.sass"
@@ -1,9 +1,9 @@
1
- $footer-background-color: $white-bis !default
2
- $footer-color: false !default
3
- $footer-padding: 3rem 1.5rem 6rem !default
4
-
5
- .footer
6
- background-color: $footer-background-color
7
- padding: $footer-padding
8
- @if $footer-color
9
- color: $footer-color
1
+ $footer-background-color: $white-bis !default
2
+ $footer-color: false !default
3
+ $footer-padding: 3rem 1.5rem 6rem !default
4
+
5
+ .footer
6
+ background-color: $footer-background-color
7
+ padding: $footer-padding
8
+ @if $footer-color
9
+ color: $footer-color
@@ -1,143 +1,143 @@
1
- // Main container
2
-
3
- .hero
4
- align-items: stretch
5
- display: flex
6
- flex-direction: column
7
- justify-content: space-between
8
- .navbar
9
- background: none
10
- .tabs
11
- ul
12
- border-bottom: none
13
- // Colors
14
- @each $name, $pair in $colors
15
- $color: nth($pair, 1)
16
- $color-invert: nth($pair, 2)
17
- &.is-#{$name}
18
- background-color: $color
19
- color: $color-invert
20
- a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
21
- strong
22
- color: inherit
23
- .title
24
- color: $color-invert
25
- .subtitle
26
- color: rgba($color-invert, 0.9)
27
- a:not(.button),
28
- strong
29
- color: $color-invert
30
- .navbar-menu
31
- +touch
32
- background-color: $color
33
- .navbar-item,
34
- .navbar-link
35
- color: rgba($color-invert, 0.7)
36
- a.navbar-item,
37
- .navbar-link
38
- &:hover,
39
- &.is-active
40
- background-color: darken($color, 5%)
41
- color: $color-invert
42
- .tabs
43
- a
44
- color: $color-invert
45
- opacity: 0.9
46
- &:hover
47
- opacity: 1
48
- li
49
- &.is-active a
50
- opacity: 1
51
- &.is-boxed,
52
- &.is-toggle
53
- a
54
- color: $color-invert
55
- &:hover
56
- background-color: rgba($black, 0.1)
57
- li.is-active a
58
- &,
59
- &:hover
60
- background-color: $color-invert
61
- border-color: $color-invert
62
- color: $color
63
- // Modifiers
64
- &.is-bold
65
- $gradient-top-left: darken(saturate(adjust-hue($color, -10deg), 10%), 10%)
66
- $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%)
67
- background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
68
- +mobile
69
- .navbar-menu
70
- background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
71
- // Sizes
72
- &.is-small
73
- .hero-body
74
- padding-bottom: 1.5rem
75
- padding-top: 1.5rem
76
- &.is-medium
77
- +tablet
78
- .hero-body
79
- padding-bottom: 9rem
80
- padding-top: 9rem
81
- &.is-large
82
- +tablet
83
- .hero-body
84
- padding-bottom: 18rem
85
- padding-top: 18rem
86
- &.is-halfheight,
87
- &.is-fullheight,
88
- &.is-fullheight-with-navbar
89
- .hero-body
90
- align-items: center
91
- display: flex
92
- & > .container
93
- flex-grow: 1
94
- flex-shrink: 1
95
- &.is-halfheight
96
- min-height: 50vh
97
- &.is-fullheight
98
- min-height: 100vh
99
-
100
- // Components
101
-
102
- .hero-video
103
- @extend %overlay
104
- overflow: hidden
105
- video
106
- left: 50%
107
- min-height: 100%
108
- min-width: 100%
109
- position: absolute
110
- top: 50%
111
- transform: translate3d(-50%, -50%, 0)
112
- // Modifiers
113
- &.is-transparent
114
- opacity: 0.3
115
- // Responsiveness
116
- +mobile
117
- display: none
118
-
119
- .hero-buttons
120
- margin-top: 1.5rem
121
- // Responsiveness
122
- +mobile
123
- .button
124
- display: flex
125
- &:not(:last-child)
126
- margin-bottom: 0.75rem
127
- +tablet
128
- display: flex
129
- justify-content: center
130
- .button:not(:last-child)
131
- margin-right: 1.5rem
132
-
133
- // Containers
134
-
135
- .hero-head,
136
- .hero-foot
137
- flex-grow: 0
138
- flex-shrink: 0
139
-
140
- .hero-body
141
- flex-grow: 1
142
- flex-shrink: 0
143
- padding: 3rem 1.5rem
1
+ // Main container
2
+
3
+ .hero
4
+ align-items: stretch
5
+ display: flex
6
+ flex-direction: column
7
+ justify-content: space-between
8
+ .navbar
9
+ background: none
10
+ .tabs
11
+ ul
12
+ border-bottom: none
13
+ // Colors
14
+ @each $name, $pair in $colors
15
+ $color: nth($pair, 1)
16
+ $color-invert: nth($pair, 2)
17
+ &.is-#{$name}
18
+ background-color: $color
19
+ color: $color-invert
20
+ a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
21
+ strong
22
+ color: inherit
23
+ .title
24
+ color: $color-invert
25
+ .subtitle
26
+ color: rgba($color-invert, 0.9)
27
+ a:not(.button),
28
+ strong
29
+ color: $color-invert
30
+ .navbar-menu
31
+ +touch
32
+ background-color: $color
33
+ .navbar-item,
34
+ .navbar-link
35
+ color: rgba($color-invert, 0.7)
36
+ a.navbar-item,
37
+ .navbar-link
38
+ &:hover,
39
+ &.is-active
40
+ background-color: darken($color, 5%)
41
+ color: $color-invert
42
+ .tabs
43
+ a
44
+ color: $color-invert
45
+ opacity: 0.9
46
+ &:hover
47
+ opacity: 1
48
+ li
49
+ &.is-active a
50
+ opacity: 1
51
+ &.is-boxed,
52
+ &.is-toggle
53
+ a
54
+ color: $color-invert
55
+ &:hover
56
+ background-color: rgba($black, 0.1)
57
+ li.is-active a
58
+ &,
59
+ &:hover
60
+ background-color: $color-invert
61
+ border-color: $color-invert
62
+ color: $color
63
+ // Modifiers
64
+ &.is-bold
65
+ $gradient-top-left: darken(saturate(adjust-hue($color, -10deg), 10%), 10%)
66
+ $gradient-bottom-right: lighten(saturate(adjust-hue($color, 10deg), 5%), 5%)
67
+ background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
68
+ +mobile
69
+ .navbar-menu
70
+ background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
71
+ // Sizes
72
+ &.is-small
73
+ .hero-body
74
+ padding-bottom: 1.5rem
75
+ padding-top: 1.5rem
76
+ &.is-medium
77
+ +tablet
78
+ .hero-body
79
+ padding-bottom: 9rem
80
+ padding-top: 9rem
81
+ &.is-large
82
+ +tablet
83
+ .hero-body
84
+ padding-bottom: 18rem
85
+ padding-top: 18rem
86
+ &.is-halfheight,
87
+ &.is-fullheight,
88
+ &.is-fullheight-with-navbar
89
+ .hero-body
90
+ align-items: center
91
+ display: flex
92
+ & > .container
93
+ flex-grow: 1
94
+ flex-shrink: 1
95
+ &.is-halfheight
96
+ min-height: 50vh
97
+ &.is-fullheight
98
+ min-height: 100vh
99
+
100
+ // Components
101
+
102
+ .hero-video
103
+ @extend %overlay
104
+ overflow: hidden
105
+ video
106
+ left: 50%
107
+ min-height: 100%
108
+ min-width: 100%
109
+ position: absolute
110
+ top: 50%
111
+ transform: translate3d(-50%, -50%, 0)
112
+ // Modifiers
113
+ &.is-transparent
114
+ opacity: 0.3
115
+ // Responsiveness
116
+ +mobile
117
+ display: none
118
+
119
+ .hero-buttons
120
+ margin-top: 1.5rem
121
+ // Responsiveness
122
+ +mobile
123
+ .button
124
+ display: flex
125
+ &:not(:last-child)
126
+ margin-bottom: 0.75rem
127
+ +tablet
128
+ display: flex
129
+ justify-content: center
130
+ .button:not(:last-child)
131
+ margin-right: 1.5rem
132
+
133
+ // Containers
134
+
135
+ .hero-head,
136
+ .hero-foot
137
+ flex-grow: 0
138
+ flex-shrink: 0
139
+
140
+ .hero-body
141
+ flex-grow: 1
142
+ flex-shrink: 0
143
+ padding: 3rem 1.5rem
@@ -1,13 +1,13 @@
1
- $section-padding: 3rem 1.5rem !default
2
- $section-padding-medium: 9rem 1.5rem !default
3
- $section-padding-large: 18rem 1.5rem !default
4
-
5
- .section
6
- padding: $section-padding
7
- // Responsiveness
8
- +desktop
9
- // Sizes
10
- &.is-medium
11
- padding: $section-padding-medium
12
- &.is-large
13
- padding: $section-padding-large
1
+ $section-padding: 3rem 1.5rem !default
2
+ $section-padding-medium: 9rem 1.5rem !default
3
+ $section-padding-large: 18rem 1.5rem !default
4
+
5
+ .section
6
+ padding: $section-padding
7
+ // Responsiveness
8
+ +desktop
9
+ // Sizes
10
+ &.is-medium
11
+ padding: $section-padding-medium
12
+ &.is-large
13
+ padding: $section-padding-large
@@ -1,8 +1,8 @@
1
- @charset "utf-8"
2
-
3
- @import "initial-variables.sass"
4
- @import "functions.sass"
5
- @import "derived-variables.sass"
6
- @import "animations.sass"
7
- @import "mixins.sass"
8
- @import "controls.sass"
1
+ @charset "utf-8"
2
+
3
+ @import "initial-variables.sass"
4
+ @import "functions.sass"
5
+ @import "derived-variables.sass"
6
+ @import "animations.sass"
7
+ @import "mixins.sass"
8
+ @import "controls.sass"
@@ -1,5 +1,5 @@
1
- @keyframes spinAround
2
- from
3
- transform: rotate(0deg)
4
- to
5
- transform: rotate(359deg)
1
+ @keyframes spinAround
2
+ from
3
+ transform: rotate(0deg)
4
+ to
5
+ transform: rotate(359deg)
@@ -1,50 +1,50 @@
1
- $control-radius: $radius !default
2
- $control-radius-small: $radius-small !default
3
-
4
- $control-border-width: 1px !default
5
-
6
- $control-height: 2.25em !default
7
- $control-line-height: 1.5 !default
8
-
9
- $control-padding-vertical: calc(0.375em - #{$control-border-width}) !default
10
- $control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default
11
-
12
- =control
13
- -moz-appearance: none
14
- -webkit-appearance: none
15
- align-items: center
16
- border: $control-border-width solid transparent
17
- border-radius: $control-radius
18
- box-shadow: none
19
- display: inline-flex
20
- font-size: $size-normal
21
- height: $control-height
22
- justify-content: flex-start
23
- line-height: $control-line-height
24
- padding-bottom: $control-padding-vertical
25
- padding-left: $control-padding-horizontal
26
- padding-right: $control-padding-horizontal
27
- padding-top: $control-padding-vertical
28
- position: relative
29
- vertical-align: top
30
- // States
31
- &:focus,
32
- &.is-focused,
33
- &:active,
34
- &.is-active
35
- outline: none
36
- &[disabled],
37
- fieldset[disabled] &
38
- cursor: not-allowed
39
-
40
- %control
41
- +control
42
-
43
- // The controls sizes use mixins so they can be used at different breakpoints
44
- =control-small
45
- border-radius: $control-radius-small
46
- font-size: $size-small
47
- =control-medium
48
- font-size: $size-medium
49
- =control-large
50
- font-size: $size-large
1
+ $control-radius: $radius !default
2
+ $control-radius-small: $radius-small !default
3
+
4
+ $control-border-width: 1px !default
5
+
6
+ $control-height: 2.25em !default
7
+ $control-line-height: 1.5 !default
8
+
9
+ $control-padding-vertical: calc(0.375em - #{$control-border-width}) !default
10
+ $control-padding-horizontal: calc(0.625em - #{$control-border-width}) !default
11
+
12
+ =control
13
+ -moz-appearance: none
14
+ -webkit-appearance: none
15
+ align-items: center
16
+ border: $control-border-width solid transparent
17
+ border-radius: $control-radius
18
+ box-shadow: none
19
+ display: inline-flex
20
+ font-size: $size-normal
21
+ height: $control-height
22
+ justify-content: flex-start
23
+ line-height: $control-line-height
24
+ padding-bottom: $control-padding-vertical
25
+ padding-left: $control-padding-horizontal
26
+ padding-right: $control-padding-horizontal
27
+ padding-top: $control-padding-vertical
28
+ position: relative
29
+ vertical-align: top
30
+ // States
31
+ &:focus,
32
+ &.is-focused,
33
+ &:active,
34
+ &.is-active
35
+ outline: none
36
+ &[disabled],
37
+ fieldset[disabled] &
38
+ cursor: not-allowed
39
+
40
+ %control
41
+ +control
42
+
43
+ // The controls sizes use mixins so they can be used at different breakpoints
44
+ =control-small
45
+ border-radius: $control-radius-small
46
+ font-size: $size-small
47
+ =control-medium
48
+ font-size: $size-medium
49
+ =control-large
50
+ font-size: $size-large