ols-theme 0.8.0 → 0.9.0

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.
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,67 +1,67 @@
1
- $progress-bar-background-color: $border !default
2
- $progress-value-background-color: $text !default
3
- $progress-border-radius: $radius-rounded !default
4
-
5
- $progress-indeterminate-duration: 1.5s !default
6
-
7
- .progress
8
- @extend %block
9
- -moz-appearance: none
10
- -webkit-appearance: none
11
- border: none
12
- border-radius: $progress-border-radius
13
- display: block
14
- height: $size-normal
15
- overflow: hidden
16
- padding: 0
17
- width: 100%
18
- &::-webkit-progress-bar
19
- background-color: $progress-bar-background-color
20
- &::-webkit-progress-value
21
- background-color: $progress-value-background-color
22
- &::-moz-progress-bar
23
- background-color: $progress-value-background-color
24
- &::-ms-fill
25
- background-color: $progress-value-background-color
26
- border: none
27
- // Colors
28
- @each $name, $pair in $colors
29
- $color: nth($pair, 1)
30
- &.is-#{$name}
31
- &::-webkit-progress-value
32
- background-color: $color
33
- &::-moz-progress-bar
34
- background-color: $color
35
- &::-ms-fill
36
- background-color: $color
37
- &:indeterminate
38
- background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
39
-
40
- &:indeterminate
41
- animation-duration: $progress-indeterminate-duration
42
- animation-iteration-count: infinite
43
- animation-name: moveIndeterminate
44
- animation-timing-function: linear
45
- background-color: $progress-bar-background-color
46
- background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%)
47
- background-position: top left
48
- background-repeat: no-repeat
49
- background-size: 150% 150%
50
- &::-webkit-progress-bar
51
- background-color: transparent
52
- &::-moz-progress-bar
53
- background-color: transparent
54
-
55
- // Sizes
56
- &.is-small
57
- height: $size-small
58
- &.is-medium
59
- height: $size-medium
60
- &.is-large
61
- height: $size-large
62
-
63
- @keyframes moveIndeterminate
64
- from
65
- background-position: 200% 0
66
- to
67
- background-position: -200% 0
1
+ $progress-bar-background-color: $border !default
2
+ $progress-value-background-color: $text !default
3
+ $progress-border-radius: $radius-rounded !default
4
+
5
+ $progress-indeterminate-duration: 1.5s !default
6
+
7
+ .progress
8
+ @extend %block
9
+ -moz-appearance: none
10
+ -webkit-appearance: none
11
+ border: none
12
+ border-radius: $progress-border-radius
13
+ display: block
14
+ height: $size-normal
15
+ overflow: hidden
16
+ padding: 0
17
+ width: 100%
18
+ &::-webkit-progress-bar
19
+ background-color: $progress-bar-background-color
20
+ &::-webkit-progress-value
21
+ background-color: $progress-value-background-color
22
+ &::-moz-progress-bar
23
+ background-color: $progress-value-background-color
24
+ &::-ms-fill
25
+ background-color: $progress-value-background-color
26
+ border: none
27
+ // Colors
28
+ @each $name, $pair in $colors
29
+ $color: nth($pair, 1)
30
+ &.is-#{$name}
31
+ &::-webkit-progress-value
32
+ background-color: $color
33
+ &::-moz-progress-bar
34
+ background-color: $color
35
+ &::-ms-fill
36
+ background-color: $color
37
+ &:indeterminate
38
+ background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
39
+
40
+ &:indeterminate
41
+ animation-duration: $progress-indeterminate-duration
42
+ animation-iteration-count: infinite
43
+ animation-name: moveIndeterminate
44
+ animation-timing-function: linear
45
+ background-color: $progress-bar-background-color
46
+ background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%)
47
+ background-position: top left
48
+ background-repeat: no-repeat
49
+ background-size: 150% 150%
50
+ &::-webkit-progress-bar
51
+ background-color: transparent
52
+ &::-moz-progress-bar
53
+ background-color: transparent
54
+
55
+ // Sizes
56
+ &.is-small
57
+ height: $size-small
58
+ &.is-medium
59
+ height: $size-medium
60
+ &.is-large
61
+ height: $size-large
62
+
63
+ @keyframes moveIndeterminate
64
+ from
65
+ background-position: 200% 0
66
+ to
67
+ background-position: -200% 0
@@ -1,127 +1,127 @@
1
- $table-color: $grey-darker !default
2
- $table-background-color: $white !default
3
-
4
- $table-cell-border: 1px solid $grey-lighter !default
5
- $table-cell-border-width: 0 0 1px !default
6
- $table-cell-padding: 0.5em 0.75em !default
7
- $table-cell-heading-color: $text-strong !default
8
-
9
- $table-head-cell-border-width: 0 0 2px !default
10
- $table-head-cell-color: $text-strong !default
11
- $table-foot-cell-border-width: 2px 0 0 !default
12
- $table-foot-cell-color: $text-strong !default
13
-
14
- $table-head-background-color: transparent !default
15
- $table-body-background-color: transparent !default
16
- $table-foot-background-color: transparent !default
17
-
18
- $table-row-hover-background-color: $white-bis !default
19
-
20
- $table-row-active-background-color: $primary !default
21
- $table-row-active-color: $primary-invert !default
22
-
23
- $table-striped-row-even-background-color: $white-bis !default
24
- $table-striped-row-even-hover-background-color: $white-ter !default
25
-
26
- .table
27
- @extend %block
28
- background-color: $table-background-color
29
- color: $table-color
30
- td,
31
- th
32
- border: $table-cell-border
33
- border-width: $table-cell-border-width
34
- padding: $table-cell-padding
35
- vertical-align: top
36
- // Colors
37
- @each $name, $pair in $colors
38
- $color: nth($pair, 1)
39
- $color-invert: nth($pair, 2)
40
- &.is-#{$name}
41
- background-color: $color
42
- border-color: $color
43
- color: $color-invert
44
- // Modifiers
45
- &.is-narrow
46
- white-space: nowrap
47
- width: 1%
48
- &.is-selected
49
- background-color: $table-row-active-background-color
50
- color: $table-row-active-color
51
- a,
52
- strong
53
- color: currentColor
54
- th
55
- color: $table-cell-heading-color
56
- &:not([align])
57
- text-align: left
58
- tr
59
- &.is-selected
60
- background-color: $table-row-active-background-color
61
- color: $table-row-active-color
62
- a,
63
- strong
64
- color: currentColor
65
- td,
66
- th
67
- border-color: $table-row-active-color
68
- color: currentColor
69
- thead
70
- background-color: $table-head-background-color
71
- td,
72
- th
73
- border-width: $table-head-cell-border-width
74
- color: $table-head-cell-color
75
- tfoot
76
- background-color: $table-foot-background-color
77
- td,
78
- th
79
- border-width: $table-foot-cell-border-width
80
- color: $table-foot-cell-color
81
- tbody
82
- background-color: $table-body-background-color
83
- tr
84
- &:last-child
85
- td,
86
- th
87
- border-bottom-width: 0
88
- // Modifiers
89
- &.is-bordered
90
- td,
91
- th
92
- border-width: 1px
93
- tr
94
- &:last-child
95
- td,
96
- th
97
- border-bottom-width: 1px
98
- &.is-fullwidth
99
- width: 100%
100
- &.is-hoverable
101
- tbody
102
- tr:not(.is-selected)
103
- &:hover
104
- background-color: $table-row-hover-background-color
105
- &.is-striped
106
- tbody
107
- tr:not(.is-selected)
108
- &:hover
109
- background-color: $table-row-hover-background-color
110
- &:nth-child(even)
111
- background-color: $table-striped-row-even-hover-background-color
112
- &.is-narrow
113
- td,
114
- th
115
- padding: 0.25em 0.5em
116
- &.is-striped
117
- tbody
118
- tr:not(.is-selected)
119
- &:nth-child(even)
120
- background-color: $table-striped-row-even-background-color
121
-
122
- .table-container
123
- @extend %block
124
- +overflow-touch
125
- overflow: auto
126
- overflow-y: hidden
127
- max-width: 100%
1
+ $table-color: $grey-darker !default
2
+ $table-background-color: $white !default
3
+
4
+ $table-cell-border: 1px solid $grey-lighter !default
5
+ $table-cell-border-width: 0 0 1px !default
6
+ $table-cell-padding: 0.5em 0.75em !default
7
+ $table-cell-heading-color: $text-strong !default
8
+
9
+ $table-head-cell-border-width: 0 0 2px !default
10
+ $table-head-cell-color: $text-strong !default
11
+ $table-foot-cell-border-width: 2px 0 0 !default
12
+ $table-foot-cell-color: $text-strong !default
13
+
14
+ $table-head-background-color: transparent !default
15
+ $table-body-background-color: transparent !default
16
+ $table-foot-background-color: transparent !default
17
+
18
+ $table-row-hover-background-color: $white-bis !default
19
+
20
+ $table-row-active-background-color: $primary !default
21
+ $table-row-active-color: $primary-invert !default
22
+
23
+ $table-striped-row-even-background-color: $white-bis !default
24
+ $table-striped-row-even-hover-background-color: $white-ter !default
25
+
26
+ .table
27
+ @extend %block
28
+ background-color: $table-background-color
29
+ color: $table-color
30
+ td,
31
+ th
32
+ border: $table-cell-border
33
+ border-width: $table-cell-border-width
34
+ padding: $table-cell-padding
35
+ vertical-align: top
36
+ // Colors
37
+ @each $name, $pair in $colors
38
+ $color: nth($pair, 1)
39
+ $color-invert: nth($pair, 2)
40
+ &.is-#{$name}
41
+ background-color: $color
42
+ border-color: $color
43
+ color: $color-invert
44
+ // Modifiers
45
+ &.is-narrow
46
+ white-space: nowrap
47
+ width: 1%
48
+ &.is-selected
49
+ background-color: $table-row-active-background-color
50
+ color: $table-row-active-color
51
+ a,
52
+ strong
53
+ color: currentColor
54
+ th
55
+ color: $table-cell-heading-color
56
+ &:not([align])
57
+ text-align: left
58
+ tr
59
+ &.is-selected
60
+ background-color: $table-row-active-background-color
61
+ color: $table-row-active-color
62
+ a,
63
+ strong
64
+ color: currentColor
65
+ td,
66
+ th
67
+ border-color: $table-row-active-color
68
+ color: currentColor
69
+ thead
70
+ background-color: $table-head-background-color
71
+ td,
72
+ th
73
+ border-width: $table-head-cell-border-width
74
+ color: $table-head-cell-color
75
+ tfoot
76
+ background-color: $table-foot-background-color
77
+ td,
78
+ th
79
+ border-width: $table-foot-cell-border-width
80
+ color: $table-foot-cell-color
81
+ tbody
82
+ background-color: $table-body-background-color
83
+ tr
84
+ &:last-child
85
+ td,
86
+ th
87
+ border-bottom-width: 0
88
+ // Modifiers
89
+ &.is-bordered
90
+ td,
91
+ th
92
+ border-width: 1px
93
+ tr
94
+ &:last-child
95
+ td,
96
+ th
97
+ border-bottom-width: 1px
98
+ &.is-fullwidth
99
+ width: 100%
100
+ &.is-hoverable
101
+ tbody
102
+ tr:not(.is-selected)
103
+ &:hover
104
+ background-color: $table-row-hover-background-color
105
+ &.is-striped
106
+ tbody
107
+ tr:not(.is-selected)
108
+ &:hover
109
+ background-color: $table-row-hover-background-color
110
+ &:nth-child(even)
111
+ background-color: $table-striped-row-even-hover-background-color
112
+ &.is-narrow
113
+ td,
114
+ th
115
+ padding: 0.25em 0.5em
116
+ &.is-striped
117
+ tbody
118
+ tr:not(.is-selected)
119
+ &:nth-child(even)
120
+ background-color: $table-striped-row-even-background-color
121
+
122
+ .table-container
123
+ @extend %block
124
+ +overflow-touch
125
+ overflow: auto
126
+ overflow-y: hidden
127
+ max-width: 100%
@@ -1,121 +1,121 @@
1
- $tag-background-color: $background !default
2
- $tag-color: $text !default
3
- $tag-radius: $radius !default
4
- $tag-delete-margin: 1px !default
5
-
6
- .tags
7
- align-items: center
8
- display: flex
9
- flex-wrap: wrap
10
- justify-content: flex-start
11
- .tag
12
- margin-bottom: 0.5rem
13
- &:not(:last-child)
14
- margin-right: 0.5rem
15
- &:last-child
16
- margin-bottom: -0.5rem
17
- &:not(:last-child)
18
- margin-bottom: 1rem
19
- // Sizes
20
- &.are-medium
21
- .tag:not(.is-normal):not(.is-large)
22
- font-size: $size-normal
23
- &.are-large
24
- .tag:not(.is-normal):not(.is-medium)
25
- font-size: $size-medium
26
- &.is-centered
27
- justify-content: center
28
- .tag
29
- margin-right: 0.25rem
30
- margin-left: 0.25rem
31
- &.is-right
32
- justify-content: flex-end
33
- .tag
34
- &:not(:first-child)
35
- margin-left: 0.5rem
36
- &:not(:last-child)
37
- margin-right: 0
38
- &.has-addons
39
- .tag
40
- margin-right: 0
41
- &:not(:first-child)
42
- margin-left: 0
43
- border-bottom-left-radius: 0
44
- border-top-left-radius: 0
45
- &:not(:last-child)
46
- border-bottom-right-radius: 0
47
- border-top-right-radius: 0
48
-
49
- .tag:not(body)
50
- align-items: center
51
- background-color: $tag-background-color
52
- border-radius: $tag-radius
53
- color: $tag-color
54
- display: inline-flex
55
- font-size: $size-small
56
- height: 2em
57
- justify-content: center
58
- line-height: 1.5
59
- padding-left: 0.75em
60
- padding-right: 0.75em
61
- white-space: nowrap
62
- .delete
63
- margin-left: 0.25rem
64
- margin-right: -0.375rem
65
- // Colors
66
- @each $name, $pair in $colors
67
- $color: nth($pair, 1)
68
- $color-invert: nth($pair, 2)
69
- &.is-#{$name}
70
- background-color: $color
71
- color: $color-invert
72
- // Sizes
73
- &.is-normal
74
- font-size: $size-small
75
- &.is-medium
76
- font-size: $size-normal
77
- &.is-large
78
- font-size: $size-medium
79
- .icon
80
- &:first-child:not(:last-child)
81
- margin-left: -0.375em
82
- margin-right: 0.1875em
83
- &:last-child:not(:first-child)
84
- margin-left: 0.1875em
85
- margin-right: -0.375em
86
- &:first-child:last-child
87
- margin-left: -0.375em
88
- margin-right: -0.375em
89
- // Modifiers
90
- &.is-delete
91
- margin-left: $tag-delete-margin
92
- padding: 0
93
- position: relative
94
- width: 2em
95
- &::before,
96
- &::after
97
- background-color: currentColor
98
- content: ""
99
- display: block
100
- left: 50%
101
- position: absolute
102
- top: 50%
103
- transform: translateX(-50%) translateY(-50%) rotate(45deg)
104
- transform-origin: center center
105
- &::before
106
- height: 1px
107
- width: 50%
108
- &::after
109
- height: 50%
110
- width: 1px
111
- &:hover,
112
- &:focus
113
- background-color: darken($tag-background-color, 5%)
114
- &:active
115
- background-color: darken($tag-background-color, 10%)
116
- &.is-rounded
117
- border-radius: $radius-rounded
118
-
119
- a.tag
120
- &:hover
121
- text-decoration: underline
1
+ $tag-background-color: $background !default
2
+ $tag-color: $text !default
3
+ $tag-radius: $radius !default
4
+ $tag-delete-margin: 1px !default
5
+
6
+ .tags
7
+ align-items: center
8
+ display: flex
9
+ flex-wrap: wrap
10
+ justify-content: flex-start
11
+ .tag
12
+ margin-bottom: 0.5rem
13
+ &:not(:last-child)
14
+ margin-right: 0.5rem
15
+ &:last-child
16
+ margin-bottom: -0.5rem
17
+ &:not(:last-child)
18
+ margin-bottom: 1rem
19
+ // Sizes
20
+ &.are-medium
21
+ .tag:not(.is-normal):not(.is-large)
22
+ font-size: $size-normal
23
+ &.are-large
24
+ .tag:not(.is-normal):not(.is-medium)
25
+ font-size: $size-medium
26
+ &.is-centered
27
+ justify-content: center
28
+ .tag
29
+ margin-right: 0.25rem
30
+ margin-left: 0.25rem
31
+ &.is-right
32
+ justify-content: flex-end
33
+ .tag
34
+ &:not(:first-child)
35
+ margin-left: 0.5rem
36
+ &:not(:last-child)
37
+ margin-right: 0
38
+ &.has-addons
39
+ .tag
40
+ margin-right: 0
41
+ &:not(:first-child)
42
+ margin-left: 0
43
+ border-bottom-left-radius: 0
44
+ border-top-left-radius: 0
45
+ &:not(:last-child)
46
+ border-bottom-right-radius: 0
47
+ border-top-right-radius: 0
48
+
49
+ .tag:not(body)
50
+ align-items: center
51
+ background-color: $tag-background-color
52
+ border-radius: $tag-radius
53
+ color: $tag-color
54
+ display: inline-flex
55
+ font-size: $size-small
56
+ height: 2em
57
+ justify-content: center
58
+ line-height: 1.5
59
+ padding-left: 0.75em
60
+ padding-right: 0.75em
61
+ white-space: nowrap
62
+ .delete
63
+ margin-left: 0.25rem
64
+ margin-right: -0.375rem
65
+ // Colors
66
+ @each $name, $pair in $colors
67
+ $color: nth($pair, 1)
68
+ $color-invert: nth($pair, 2)
69
+ &.is-#{$name}
70
+ background-color: $color
71
+ color: $color-invert
72
+ // Sizes
73
+ &.is-normal
74
+ font-size: $size-small
75
+ &.is-medium
76
+ font-size: $size-normal
77
+ &.is-large
78
+ font-size: $size-medium
79
+ .icon
80
+ &:first-child:not(:last-child)
81
+ margin-left: -0.375em
82
+ margin-right: 0.1875em
83
+ &:last-child:not(:first-child)
84
+ margin-left: 0.1875em
85
+ margin-right: -0.375em
86
+ &:first-child:last-child
87
+ margin-left: -0.375em
88
+ margin-right: -0.375em
89
+ // Modifiers
90
+ &.is-delete
91
+ margin-left: $tag-delete-margin
92
+ padding: 0
93
+ position: relative
94
+ width: 2em
95
+ &::before,
96
+ &::after
97
+ background-color: currentColor
98
+ content: ""
99
+ display: block
100
+ left: 50%
101
+ position: absolute
102
+ top: 50%
103
+ transform: translateX(-50%) translateY(-50%) rotate(45deg)
104
+ transform-origin: center center
105
+ &::before
106
+ height: 1px
107
+ width: 50%
108
+ &::after
109
+ height: 50%
110
+ width: 1px
111
+ &:hover,
112
+ &:focus
113
+ background-color: darken($tag-background-color, 5%)
114
+ &:active
115
+ background-color: darken($tag-background-color, 10%)
116
+ &.is-rounded
117
+ border-radius: $radius-rounded
118
+
119
+ a.tag
120
+ &:hover
121
+ text-decoration: underline