okf-pub-theme 0.1.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 (203) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.txt +21 -0
  3. data/README.md +111 -0
  4. data/_includes/chapters.html +18 -0
  5. data/_includes/effect-chains.html +18 -0
  6. data/_includes/effect-item.html +5 -0
  7. data/_includes/footer.html +5 -0
  8. data/_includes/head.html +22 -0
  9. data/_includes/header.html +36 -0
  10. data/_includes/matomo.html +15 -0
  11. data/_includes/outcomes.html +34 -0
  12. data/_layouts/default.html +19 -0
  13. data/_layouts/home.html +52 -0
  14. data/_sass/_a11y.sass +25 -0
  15. data/_sass/_bulma-0.7.4/CHANGELOG.md +1162 -0
  16. data/_sass/_bulma-0.7.4/LICENSE +21 -0
  17. data/_sass/_bulma-0.7.4/README.md +119 -0
  18. data/_sass/_bulma-0.7.4/bulma.sass +8 -0
  19. data/_sass/_bulma-0.7.4/css/bulma.css +10525 -0
  20. data/_sass/_bulma-0.7.4/css/bulma.css.map +1 -0
  21. data/_sass/_bulma-0.7.4/css/bulma.min.css +1 -0
  22. data/_sass/_bulma-0.7.4/package.json +78 -0
  23. data/_sass/_bulma-0.7.4/sass/.DS_Store +0 -0
  24. data/_sass/_bulma-0.7.4/sass/base/_all.sass +5 -0
  25. data/_sass/_bulma-0.7.4/sass/base/generic.sass +130 -0
  26. data/_sass/_bulma-0.7.4/sass/base/helpers.sass +276 -0
  27. data/_sass/_bulma-0.7.4/sass/base/minireset.sass +84 -0
  28. data/_sass/_bulma-0.7.4/sass/components/_all.sass +15 -0
  29. data/_sass/_bulma-0.7.4/sass/components/breadcrumb.sass +75 -0
  30. data/_sass/_bulma-0.7.4/sass/components/card.sass +74 -0
  31. data/_sass/_bulma-0.7.4/sass/components/dropdown.sass +77 -0
  32. data/_sass/_bulma-0.7.4/sass/components/level.sass +75 -0
  33. data/_sass/_bulma-0.7.4/sass/components/list.sass +39 -0
  34. data/_sass/_bulma-0.7.4/sass/components/media.sass +48 -0
  35. data/_sass/_bulma-0.7.4/sass/components/menu.sass +50 -0
  36. data/_sass/_bulma-0.7.4/sass/components/message.sass +86 -0
  37. data/_sass/_bulma-0.7.4/sass/components/modal.sass +113 -0
  38. data/_sass/_bulma-0.7.4/sass/components/navbar.sass +428 -0
  39. data/_sass/_bulma-0.7.4/sass/components/pagination.sass +144 -0
  40. data/_sass/_bulma-0.7.4/sass/components/panel.sass +101 -0
  41. data/_sass/_bulma-0.7.4/sass/components/tabs.sass +151 -0
  42. data/_sass/_bulma-0.7.4/sass/elements/_all.sass +16 -0
  43. data/_sass/_bulma-0.7.4/sass/elements/box.sass +24 -0
  44. data/_sass/_bulma-0.7.4/sass/elements/button.sass +275 -0
  45. data/_sass/_bulma-0.7.4/sass/elements/container.sass +25 -0
  46. data/_sass/_bulma-0.7.4/sass/elements/content.sass +151 -0
  47. data/_sass/_bulma-0.7.4/sass/elements/form.sass +602 -0
  48. data/_sass/_bulma-0.7.4/sass/elements/icon.sass +21 -0
  49. data/_sass/_bulma-0.7.4/sass/elements/image.sass +69 -0
  50. data/_sass/_bulma-0.7.4/sass/elements/notification.sass +35 -0
  51. data/_sass/_bulma-0.7.4/sass/elements/other.sass +39 -0
  52. data/_sass/_bulma-0.7.4/sass/elements/progress.sass +65 -0
  53. data/_sass/_bulma-0.7.4/sass/elements/table.sass +126 -0
  54. data/_sass/_bulma-0.7.4/sass/elements/tag.sass +130 -0
  55. data/_sass/_bulma-0.7.4/sass/elements/title.sass +64 -0
  56. data/_sass/_bulma-0.7.4/sass/grid/_all.sass +4 -0
  57. data/_sass/_bulma-0.7.4/sass/grid/columns.sass +504 -0
  58. data/_sass/_bulma-0.7.4/sass/grid/tiles.sass +32 -0
  59. data/_sass/_bulma-0.7.4/sass/layout/_all.sass +5 -0
  60. data/_sass/_bulma-0.7.4/sass/layout/footer.sass +6 -0
  61. data/_sass/_bulma-0.7.4/sass/layout/hero.sass +156 -0
  62. data/_sass/_bulma-0.7.4/sass/layout/section.sass +13 -0
  63. data/_sass/_bulma-0.7.4/sass/utilities/_all.sass +8 -0
  64. data/_sass/_bulma-0.7.4/sass/utilities/animations.sass +5 -0
  65. data/_sass/_bulma-0.7.4/sass/utilities/controls.sass +50 -0
  66. data/_sass/_bulma-0.7.4/sass/utilities/derived-variables.sass +85 -0
  67. data/_sass/_bulma-0.7.4/sass/utilities/functions.sass +62 -0
  68. data/_sass/_bulma-0.7.4/sass/utilities/initial-variables.sass +72 -0
  69. data/_sass/_bulma-0.7.4/sass/utilities/mixins.sass +261 -0
  70. data/_sass/_effects.sass +35 -0
  71. data/_sass/_fonts.scss +37 -0
  72. data/_sass/_header.sass +105 -0
  73. data/_sass/_helpers.sass +8 -0
  74. data/_sass/_main.sass +61 -0
  75. data/_sass/chapter.sass +18 -0
  76. data/assets/css/style.sass +73 -0
  77. data/assets/favicon/android-icon-144x144.png +0 -0
  78. data/assets/favicon/android-icon-192x192.png +0 -0
  79. data/assets/favicon/android-icon-36x36.png +0 -0
  80. data/assets/favicon/android-icon-48x48.png +0 -0
  81. data/assets/favicon/android-icon-72x72.png +0 -0
  82. data/assets/favicon/android-icon-96x96.png +0 -0
  83. data/assets/favicon/apple-icon-114x114.png +0 -0
  84. data/assets/favicon/apple-icon-120x120.png +0 -0
  85. data/assets/favicon/apple-icon-144x144.png +0 -0
  86. data/assets/favicon/apple-icon-152x152.png +0 -0
  87. data/assets/favicon/apple-icon-180x180.png +0 -0
  88. data/assets/favicon/apple-icon-57x57.png +0 -0
  89. data/assets/favicon/apple-icon-60x60.png +0 -0
  90. data/assets/favicon/apple-icon-72x72.png +0 -0
  91. data/assets/favicon/apple-icon-76x76.png +0 -0
  92. data/assets/favicon/apple-icon-precomposed.png +0 -0
  93. data/assets/favicon/apple-icon.png +0 -0
  94. data/assets/favicon/apple-touch-icon.png +0 -0
  95. data/assets/favicon/browserconfig.xml +11 -0
  96. data/assets/favicon/favicon-16x16.png +0 -0
  97. data/assets/favicon/favicon-32x32.png +0 -0
  98. data/assets/favicon/favicon-96x96.png +0 -0
  99. data/assets/favicon/favicon.ico +0 -0
  100. data/assets/favicon/manifest.json +41 -0
  101. data/assets/favicon/ms-icon-144x144.png +0 -0
  102. data/assets/favicon/ms-icon-150x150.png +0 -0
  103. data/assets/favicon/ms-icon-310x310.png +0 -0
  104. data/assets/favicon/ms-icon-70x70.png +0 -0
  105. data/assets/fonts/LICENSE.txt +93 -0
  106. data/assets/fonts/OTF/SourceSansPro-Black.otf +0 -0
  107. data/assets/fonts/OTF/SourceSansPro-BlackIt.otf +0 -0
  108. data/assets/fonts/OTF/SourceSansPro-Bold.otf +0 -0
  109. data/assets/fonts/OTF/SourceSansPro-BoldIt.otf +0 -0
  110. data/assets/fonts/OTF/SourceSansPro-ExtraLight.otf +0 -0
  111. data/assets/fonts/OTF/SourceSansPro-ExtraLightIt.otf +0 -0
  112. data/assets/fonts/OTF/SourceSansPro-It.otf +0 -0
  113. data/assets/fonts/OTF/SourceSansPro-Light.otf +0 -0
  114. data/assets/fonts/OTF/SourceSansPro-LightIt.otf +0 -0
  115. data/assets/fonts/OTF/SourceSansPro-Regular.otf +0 -0
  116. data/assets/fonts/OTF/SourceSansPro-Semibold.otf +0 -0
  117. data/assets/fonts/OTF/SourceSansPro-SemiboldIt.otf +0 -0
  118. data/assets/fonts/TTF/SourceSansPro-Black.ttf +0 -0
  119. data/assets/fonts/TTF/SourceSansPro-BlackIt.ttf +0 -0
  120. data/assets/fonts/TTF/SourceSansPro-Bold.ttf +0 -0
  121. data/assets/fonts/TTF/SourceSansPro-BoldIt.ttf +0 -0
  122. data/assets/fonts/TTF/SourceSansPro-ExtraLight.ttf +0 -0
  123. data/assets/fonts/TTF/SourceSansPro-ExtraLightIt.ttf +0 -0
  124. data/assets/fonts/TTF/SourceSansPro-It.ttf +0 -0
  125. data/assets/fonts/TTF/SourceSansPro-Light.ttf +0 -0
  126. data/assets/fonts/TTF/SourceSansPro-LightIt.ttf +0 -0
  127. data/assets/fonts/TTF/SourceSansPro-Regular.ttf +0 -0
  128. data/assets/fonts/TTF/SourceSansPro-Semibold.ttf +0 -0
  129. data/assets/fonts/TTF/SourceSansPro-SemiboldIt.ttf +0 -0
  130. data/assets/fonts/VAR/SourceSansVariable-Italic.otf +0 -0
  131. data/assets/fonts/VAR/SourceSansVariable-Italic.otf.woff +0 -0
  132. data/assets/fonts/VAR/SourceSansVariable-Italic.otf.woff2 +0 -0
  133. data/assets/fonts/VAR/SourceSansVariable-Italic.ttf +0 -0
  134. data/assets/fonts/VAR/SourceSansVariable-Italic.ttf.woff +0 -0
  135. data/assets/fonts/VAR/SourceSansVariable-Italic.ttf.woff2 +0 -0
  136. data/assets/fonts/VAR/SourceSansVariable-Roman.otf +0 -0
  137. data/assets/fonts/VAR/SourceSansVariable-Roman.otf.woff +0 -0
  138. data/assets/fonts/VAR/SourceSansVariable-Roman.otf.woff2 +0 -0
  139. data/assets/fonts/VAR/SourceSansVariable-Roman.ttf +0 -0
  140. data/assets/fonts/VAR/SourceSansVariable-Roman.ttf.woff +0 -0
  141. data/assets/fonts/VAR/SourceSansVariable-Roman.ttf.woff2 +0 -0
  142. data/assets/fonts/WOFF/OTF/SourceSansPro-Black.otf.woff +0 -0
  143. data/assets/fonts/WOFF/OTF/SourceSansPro-BlackIt.otf.woff +0 -0
  144. data/assets/fonts/WOFF/OTF/SourceSansPro-Bold.otf.woff +0 -0
  145. data/assets/fonts/WOFF/OTF/SourceSansPro-BoldIt.otf.woff +0 -0
  146. data/assets/fonts/WOFF/OTF/SourceSansPro-ExtraLight.otf.woff +0 -0
  147. data/assets/fonts/WOFF/OTF/SourceSansPro-ExtraLightIt.otf.woff +0 -0
  148. data/assets/fonts/WOFF/OTF/SourceSansPro-It.otf.woff +0 -0
  149. data/assets/fonts/WOFF/OTF/SourceSansPro-Light.otf.woff +0 -0
  150. data/assets/fonts/WOFF/OTF/SourceSansPro-LightIt.otf.woff +0 -0
  151. data/assets/fonts/WOFF/OTF/SourceSansPro-Regular.otf.woff +0 -0
  152. data/assets/fonts/WOFF/OTF/SourceSansPro-Semibold.otf.woff +0 -0
  153. data/assets/fonts/WOFF/OTF/SourceSansPro-SemiboldIt.otf.woff +0 -0
  154. data/assets/fonts/WOFF/TTF/SourceSansPro-Black.ttf.woff +0 -0
  155. data/assets/fonts/WOFF/TTF/SourceSansPro-BlackIt.ttf.woff +0 -0
  156. data/assets/fonts/WOFF/TTF/SourceSansPro-Bold.ttf.woff +0 -0
  157. data/assets/fonts/WOFF/TTF/SourceSansPro-BoldIt.ttf.woff +0 -0
  158. data/assets/fonts/WOFF/TTF/SourceSansPro-ExtraLight.ttf.woff +0 -0
  159. data/assets/fonts/WOFF/TTF/SourceSansPro-ExtraLightIt.ttf.woff +0 -0
  160. data/assets/fonts/WOFF/TTF/SourceSansPro-It.ttf.woff +0 -0
  161. data/assets/fonts/WOFF/TTF/SourceSansPro-Light.ttf.woff +0 -0
  162. data/assets/fonts/WOFF/TTF/SourceSansPro-LightIt.ttf.woff +0 -0
  163. data/assets/fonts/WOFF/TTF/SourceSansPro-Regular.ttf.woff +0 -0
  164. data/assets/fonts/WOFF/TTF/SourceSansPro-Semibold.ttf.woff +0 -0
  165. data/assets/fonts/WOFF/TTF/SourceSansPro-SemiboldIt.ttf.woff +0 -0
  166. data/assets/fonts/WOFF2/OTF/SourceSansPro-Black.otf.woff2 +0 -0
  167. data/assets/fonts/WOFF2/OTF/SourceSansPro-BlackIt.otf.woff2 +0 -0
  168. data/assets/fonts/WOFF2/OTF/SourceSansPro-Bold.otf.woff2 +0 -0
  169. data/assets/fonts/WOFF2/OTF/SourceSansPro-BoldIt.otf.woff2 +0 -0
  170. data/assets/fonts/WOFF2/OTF/SourceSansPro-ExtraLight.otf.woff2 +0 -0
  171. data/assets/fonts/WOFF2/OTF/SourceSansPro-ExtraLightIt.otf.woff2 +0 -0
  172. data/assets/fonts/WOFF2/OTF/SourceSansPro-It.otf.woff2 +0 -0
  173. data/assets/fonts/WOFF2/OTF/SourceSansPro-Light.otf.woff2 +0 -0
  174. data/assets/fonts/WOFF2/OTF/SourceSansPro-LightIt.otf.woff2 +0 -0
  175. data/assets/fonts/WOFF2/OTF/SourceSansPro-Regular.otf.woff2 +0 -0
  176. data/assets/fonts/WOFF2/OTF/SourceSansPro-Semibold.otf.woff2 +0 -0
  177. data/assets/fonts/WOFF2/OTF/SourceSansPro-SemiboldIt.otf.woff2 +0 -0
  178. data/assets/fonts/WOFF2/TTF/SourceSansPro-Black.ttf.woff2 +0 -0
  179. data/assets/fonts/WOFF2/TTF/SourceSansPro-BlackIt.ttf.woff2 +0 -0
  180. data/assets/fonts/WOFF2/TTF/SourceSansPro-Bold.ttf.woff2 +0 -0
  181. data/assets/fonts/WOFF2/TTF/SourceSansPro-BoldIt.ttf.woff2 +0 -0
  182. data/assets/fonts/WOFF2/TTF/SourceSansPro-ExtraLight.ttf.woff2 +0 -0
  183. data/assets/fonts/WOFF2/TTF/SourceSansPro-ExtraLightIt.ttf.woff2 +0 -0
  184. data/assets/fonts/WOFF2/TTF/SourceSansPro-It.ttf.woff2 +0 -0
  185. data/assets/fonts/WOFF2/TTF/SourceSansPro-Light.ttf.woff2 +0 -0
  186. data/assets/fonts/WOFF2/TTF/SourceSansPro-LightIt.ttf.woff2 +0 -0
  187. data/assets/fonts/WOFF2/TTF/SourceSansPro-Regular.ttf.woff2 +0 -0
  188. data/assets/fonts/WOFF2/TTF/SourceSansPro-Semibold.ttf.woff2 +0 -0
  189. data/assets/fonts/WOFF2/TTF/SourceSansPro-SemiboldIt.ttf.woff2 +0 -0
  190. data/assets/fonts/apercu-bold-pro.eot +0 -0
  191. data/assets/fonts/apercu-bold-pro.ttf +0 -0
  192. data/assets/fonts/apercu-bold-pro.woff +0 -0
  193. data/assets/fonts/apercu-bold-pro.woff2 +0 -0
  194. data/assets/fonts/apercu-medium-pro.eot +0 -0
  195. data/assets/fonts/apercu-medium-pro.ttf +0 -0
  196. data/assets/fonts/apercu-medium-pro.woff +0 -0
  197. data/assets/fonts/apercu-medium-pro.woff2 +0 -0
  198. data/assets/fonts/apercu-regular-pro.eot +0 -0
  199. data/assets/fonts/apercu-regular-pro.ttf +0 -0
  200. data/assets/fonts/apercu-regular-pro.woff +0 -0
  201. data/assets/fonts/apercu-regular-pro.woff2 +0 -0
  202. data/assets/images/download.svg +9 -0
  203. metadata +315 -0
@@ -0,0 +1,48 @@
1
+ .media
2
+ align-items: flex-start
3
+ display: flex
4
+ text-align: left
5
+ .content:not(:last-child)
6
+ margin-bottom: 0.75rem
7
+ .media
8
+ border-top: 1px solid rgba($border, 0.5)
9
+ display: flex
10
+ padding-top: 0.75rem
11
+ .content:not(:last-child),
12
+ .control:not(:last-child)
13
+ margin-bottom: 0.5rem
14
+ .media
15
+ padding-top: 0.5rem
16
+ & + .media
17
+ margin-top: 0.5rem
18
+ & + .media
19
+ border-top: 1px solid rgba($border, 0.5)
20
+ margin-top: 1rem
21
+ padding-top: 1rem
22
+ // Sizes
23
+ &.is-large
24
+ & + .media
25
+ margin-top: 1.5rem
26
+ padding-top: 1.5rem
27
+
28
+ .media-left,
29
+ .media-right
30
+ flex-basis: auto
31
+ flex-grow: 0
32
+ flex-shrink: 0
33
+
34
+ .media-left
35
+ margin-right: 1rem
36
+
37
+ .media-right
38
+ margin-left: 1rem
39
+
40
+ .media-content
41
+ flex-basis: auto
42
+ flex-grow: 1
43
+ flex-shrink: 1
44
+ text-align: left
45
+
46
+ +mobile
47
+ .media-content
48
+ overflow-x: auto
@@ -0,0 +1,50 @@
1
+ $menu-item-color: $text !default
2
+ $menu-item-radius: $radius-small !default
3
+ $menu-item-hover-color: $text-strong !default
4
+ $menu-item-hover-background-color: $background !default
5
+ $menu-item-active-color: $link-invert !default
6
+ $menu-item-active-background-color: $link !default
7
+
8
+ $menu-list-border-left: 1px solid $border !default
9
+
10
+ $menu-label-color: $text-light !default
11
+
12
+ .menu
13
+ font-size: $size-normal
14
+ // Sizes
15
+ &.is-small
16
+ font-size: $size-small
17
+ &.is-medium
18
+ font-size: $size-medium
19
+ &.is-large
20
+ font-size: $size-large
21
+
22
+ .menu-list
23
+ line-height: 1.25
24
+ a
25
+ border-radius: $menu-item-radius
26
+ color: $menu-item-color
27
+ display: block
28
+ padding: 0.5em 0.75em
29
+ &:hover
30
+ background-color: $menu-item-hover-background-color
31
+ color: $menu-item-hover-color
32
+ // Modifiers
33
+ &.is-active
34
+ background-color: $menu-item-active-background-color
35
+ color: $menu-item-active-color
36
+ li
37
+ ul
38
+ border-left: $menu-list-border-left
39
+ margin: 0.75em
40
+ padding-left: 0.75em
41
+
42
+ .menu-label
43
+ color: $menu-label-color
44
+ font-size: 0.75em
45
+ letter-spacing: 0.1em
46
+ text-transform: uppercase
47
+ &:not(:first-child)
48
+ margin-top: 1em
49
+ &:not(:last-child)
50
+ margin-bottom: 1em
@@ -0,0 +1,86 @@
1
+ $message-background-color: $background !default
2
+ $message-radius: $radius !default
3
+
4
+ $message-header-background-color: $text !default
5
+ $message-header-color: $text-invert !default
6
+ $message-header-weight: $weight-bold !default
7
+ $message-header-padding: 0.75em 1em !default
8
+ $message-header-radius: $radius !default
9
+
10
+ $message-body-border-color: $border !default
11
+ $message-body-border-width: 0 0 0 4px !default
12
+ $message-body-color: $text !default
13
+ $message-body-padding: 1.25em 1.5em !default
14
+ $message-body-radius: $radius !default
15
+
16
+ $message-body-pre-background-color: $white !default
17
+ $message-body-pre-code-background-color: transparent !default
18
+
19
+ $message-header-body-border-width: 0 !default
20
+
21
+ .message
22
+ @extend %block
23
+ background-color: $message-background-color
24
+ border-radius: $message-radius
25
+ font-size: $size-normal
26
+ strong
27
+ color: currentColor
28
+ a:not(.button):not(.tag):not(.dropdown-item)
29
+ color: currentColor
30
+ text-decoration: underline
31
+ // Sizes
32
+ &.is-small
33
+ font-size: $size-small
34
+ &.is-medium
35
+ font-size: $size-medium
36
+ &.is-large
37
+ font-size: $size-large
38
+ // Colors
39
+ @each $name, $pair in $colors
40
+ $color: nth($pair, 1)
41
+ $color-invert: nth($pair, 2)
42
+ $color-lightning: max((100% - lightness($color)) - 2%, 0%)
43
+ $color-luminance: colorLuminance($color)
44
+ $darken-percentage: $color-luminance * 70%
45
+ $desaturate-percentage: $color-luminance * 30%
46
+ &.is-#{$name}
47
+ background-color: lighten($color, $color-lightning)
48
+ .message-header
49
+ background-color: $color
50
+ color: $color-invert
51
+ .message-body
52
+ border-color: $color
53
+ color: desaturate(darken($color, $darken-percentage), $desaturate-percentage)
54
+
55
+ .message-header
56
+ align-items: center
57
+ background-color: $message-header-background-color
58
+ border-radius: $message-header-radius $message-header-radius 0 0
59
+ color: $message-header-color
60
+ display: flex
61
+ font-weight: $message-header-weight
62
+ justify-content: space-between
63
+ line-height: 1.25
64
+ padding: $message-header-padding
65
+ position: relative
66
+ .delete
67
+ flex-grow: 0
68
+ flex-shrink: 0
69
+ margin-left: 0.75em
70
+ & + .message-body
71
+ border-width: $message-header-body-border-width
72
+ border-top-left-radius: 0
73
+ border-top-right-radius: 0
74
+
75
+ .message-body
76
+ border-color: $message-body-border-color
77
+ border-radius: $message-body-radius
78
+ border-style: solid
79
+ border-width: $message-body-border-width
80
+ color: $message-body-color
81
+ padding: $message-body-padding
82
+ code,
83
+ pre
84
+ background-color: $message-body-pre-background-color
85
+ pre code
86
+ background-color: $message-body-pre-code-background-color
@@ -0,0 +1,113 @@
1
+ $modal-z: 40 !default
2
+
3
+ $modal-background-background-color: rgba($black, 0.86) !default
4
+
5
+ $modal-content-width: 640px !default
6
+ $modal-content-margin-mobile: 20px !default
7
+ $modal-content-spacing-mobile: 160px !default
8
+ $modal-content-spacing-tablet: 40px !default
9
+
10
+ $modal-close-dimensions: 40px !default
11
+ $modal-close-right: 20px !default
12
+ $modal-close-top: 20px !default
13
+
14
+ $modal-card-spacing: 40px !default
15
+
16
+ $modal-card-head-background-color: $background !default
17
+ $modal-card-head-border-bottom: 1px solid $border !default
18
+ $modal-card-head-padding: 20px !default
19
+ $modal-card-head-radius: $radius-large !default
20
+
21
+ $modal-card-title-color: $text-strong !default
22
+ $modal-card-title-line-height: 1 !default
23
+ $modal-card-title-size: $size-4 !default
24
+
25
+ $modal-card-foot-radius: $radius-large !default
26
+ $modal-card-foot-border-top: 1px solid $border !default
27
+
28
+ $modal-card-body-background-color: $white !default
29
+ $modal-card-body-padding: 20px !default
30
+
31
+ .modal
32
+ @extend %overlay
33
+ align-items: center
34
+ display: none
35
+ flex-direction: column
36
+ justify-content: center
37
+ overflow: hidden
38
+ position: fixed
39
+ z-index: $modal-z
40
+ // Modifiers
41
+ &.is-active
42
+ display: flex
43
+
44
+ .modal-background
45
+ @extend %overlay
46
+ background-color: $modal-background-background-color
47
+
48
+ .modal-content,
49
+ .modal-card
50
+ margin: 0 $modal-content-margin-mobile
51
+ max-height: calc(100vh - #{$modal-content-spacing-mobile})
52
+ overflow: auto
53
+ position: relative
54
+ width: 100%
55
+ // Responsiveness
56
+ +tablet
57
+ margin: 0 auto
58
+ max-height: calc(100vh - #{$modal-content-spacing-tablet})
59
+ width: $modal-content-width
60
+
61
+ .modal-close
62
+ @extend %delete
63
+ background: none
64
+ height: $modal-close-dimensions
65
+ position: fixed
66
+ right: $modal-close-right
67
+ top: $modal-close-top
68
+ width: $modal-close-dimensions
69
+
70
+ .modal-card
71
+ display: flex
72
+ flex-direction: column
73
+ max-height: calc(100vh - #{$modal-card-spacing})
74
+ overflow: hidden
75
+ -ms-overflow-y: visible
76
+
77
+ .modal-card-head,
78
+ .modal-card-foot
79
+ align-items: center
80
+ background-color: $modal-card-head-background-color
81
+ display: flex
82
+ flex-shrink: 0
83
+ justify-content: flex-start
84
+ padding: $modal-card-head-padding
85
+ position: relative
86
+
87
+ .modal-card-head
88
+ border-bottom: $modal-card-head-border-bottom
89
+ border-top-left-radius: $modal-card-head-radius
90
+ border-top-right-radius: $modal-card-head-radius
91
+
92
+ .modal-card-title
93
+ color: $modal-card-title-color
94
+ flex-grow: 1
95
+ flex-shrink: 0
96
+ font-size: $modal-card-title-size
97
+ line-height: $modal-card-title-line-height
98
+
99
+ .modal-card-foot
100
+ border-bottom-left-radius: $modal-card-foot-radius
101
+ border-bottom-right-radius: $modal-card-foot-radius
102
+ border-top: $modal-card-foot-border-top
103
+ .button
104
+ &:not(:last-child)
105
+ margin-right: 10px
106
+
107
+ .modal-card-body
108
+ +overflow-touch
109
+ background-color: $modal-card-body-background-color
110
+ flex-grow: 1
111
+ flex-shrink: 1
112
+ overflow: auto
113
+ padding: $modal-card-body-padding