jekyll-theme-opentoolbox 1.0.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (202) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE +661 -0
  3. data/README.md +73 -0
  4. data/_includes/banner.html +24 -0
  5. data/_includes/callouts.html +39 -0
  6. data/_includes/disqus.html +17 -0
  7. data/_includes/footer-scripts.html +1 -0
  8. data/_includes/footer.html +34 -0
  9. data/_includes/gallery.html +25 -0
  10. data/_includes/google-analytics.html +8 -0
  11. data/_includes/head-scripts.html +0 -0
  12. data/_includes/head.html +19 -0
  13. data/_includes/header.html +45 -0
  14. data/_includes/hero.html +11 -0
  15. data/_includes/image-modal.html +18 -0
  16. data/_includes/join.html +30 -0
  17. data/_includes/latest-posts.html +12 -0
  18. data/_includes/menubar.html +21 -0
  19. data/_includes/notification.html +17 -0
  20. data/_includes/pagination.html +23 -0
  21. data/_includes/post-card.html +29 -0
  22. data/_includes/rating.html +14 -0
  23. data/_includes/review.html +27 -0
  24. data/_includes/share-buttons.html +19 -0
  25. data/_includes/showcase.html +76 -0
  26. data/_includes/sponsors.html +42 -0
  27. data/_includes/sub-pages.html +28 -0
  28. data/_includes/subscribe.html +6 -0
  29. data/_includes/tabs.html +18 -0
  30. data/_includes/tag.html +3 -0
  31. data/_includes/toc.html +82 -0
  32. data/_includes/vimeo.html +3 -0
  33. data/_includes/youtube.html +8 -0
  34. data/_layouts/blog.html +20 -0
  35. data/_layouts/default.html +66 -0
  36. data/_layouts/page.html +11 -0
  37. data/_layouts/post.html +23 -0
  38. data/_layouts/product-category.html +42 -0
  39. data/_layouts/product.html +61 -0
  40. data/_layouts/recipe.html +98 -0
  41. data/_layouts/resource.html +9 -0
  42. data/_posts/2021-03-24-hello.md +13 -0
  43. data/_sass/_layout.scss +37 -0
  44. data/_sass/_main.scss +22 -0
  45. data/_sass/_showcase.scss +13 -0
  46. data/_sass/syntax.scss +209 -0
  47. data/assets/css/app.scss +157 -0
  48. data/assets/css/highlight.css +78 -0
  49. data/assets/js/app.js +1 -0
  50. data/blog/index.html +6 -0
  51. data/node_modules/bulma/CHANGELOG.md +1558 -0
  52. data/node_modules/bulma/LICENSE +21 -0
  53. data/node_modules/bulma/README.md +134 -0
  54. data/node_modules/bulma/bulma.sass +10 -0
  55. data/node_modules/bulma/css/bulma-rtl.css +11811 -0
  56. data/node_modules/bulma/css/bulma-rtl.css.map +1 -0
  57. data/node_modules/bulma/css/bulma-rtl.min.css +1 -0
  58. data/node_modules/bulma/css/bulma.css +11811 -0
  59. data/node_modules/bulma/css/bulma.css.map +1 -0
  60. data/node_modules/bulma/css/bulma.min.css +1 -0
  61. data/node_modules/bulma/package.json +81 -0
  62. data/node_modules/bulma/sass/base/_all.sass +6 -0
  63. data/node_modules/bulma/sass/base/animations.sass +5 -0
  64. data/node_modules/bulma/sass/base/generic.sass +145 -0
  65. data/node_modules/bulma/sass/base/helpers.sass +1 -0
  66. data/node_modules/bulma/sass/base/minireset.sass +79 -0
  67. data/node_modules/bulma/sass/components/_all.sass +15 -0
  68. data/node_modules/bulma/sass/components/breadcrumb.sass +77 -0
  69. data/node_modules/bulma/sass/components/card.sass +103 -0
  70. data/node_modules/bulma/sass/components/dropdown.sass +83 -0
  71. data/node_modules/bulma/sass/components/level.sass +79 -0
  72. data/node_modules/bulma/sass/components/media.sass +59 -0
  73. data/node_modules/bulma/sass/components/menu.sass +59 -0
  74. data/node_modules/bulma/sass/components/message.sass +101 -0
  75. data/node_modules/bulma/sass/components/modal.sass +117 -0
  76. data/node_modules/bulma/sass/components/navbar.sass +446 -0
  77. data/node_modules/bulma/sass/components/pagination.sass +166 -0
  78. data/node_modules/bulma/sass/components/panel.sass +121 -0
  79. data/node_modules/bulma/sass/components/tabs.sass +176 -0
  80. data/node_modules/bulma/sass/elements/_all.sass +16 -0
  81. data/node_modules/bulma/sass/elements/box.sass +26 -0
  82. data/node_modules/bulma/sass/elements/button.sass +345 -0
  83. data/node_modules/bulma/sass/elements/container.sass +29 -0
  84. data/node_modules/bulma/sass/elements/content.sass +159 -0
  85. data/node_modules/bulma/sass/elements/form.sass +1 -0
  86. data/node_modules/bulma/sass/elements/icon.sass +46 -0
  87. data/node_modules/bulma/sass/elements/image.sass +73 -0
  88. data/node_modules/bulma/sass/elements/notification.sass +52 -0
  89. data/node_modules/bulma/sass/elements/other.sass +31 -0
  90. data/node_modules/bulma/sass/elements/progress.sass +73 -0
  91. data/node_modules/bulma/sass/elements/table.sass +133 -0
  92. data/node_modules/bulma/sass/elements/tag.sass +140 -0
  93. data/node_modules/bulma/sass/elements/title.sass +70 -0
  94. data/node_modules/bulma/sass/form/_all.sass +9 -0
  95. data/node_modules/bulma/sass/form/checkbox-radio.sass +22 -0
  96. data/node_modules/bulma/sass/form/file.sass +184 -0
  97. data/node_modules/bulma/sass/form/input-textarea.sass +66 -0
  98. data/node_modules/bulma/sass/form/select.sass +87 -0
  99. data/node_modules/bulma/sass/form/shared.sass +60 -0
  100. data/node_modules/bulma/sass/form/tools.sass +215 -0
  101. data/node_modules/bulma/sass/grid/_all.sass +5 -0
  102. data/node_modules/bulma/sass/grid/columns.sass +513 -0
  103. data/node_modules/bulma/sass/grid/tiles.sass +36 -0
  104. data/node_modules/bulma/sass/helpers/_all.sass +12 -0
  105. data/node_modules/bulma/sass/helpers/color.sass +39 -0
  106. data/node_modules/bulma/sass/helpers/flexbox.sass +35 -0
  107. data/node_modules/bulma/sass/helpers/float.sass +10 -0
  108. data/node_modules/bulma/sass/helpers/other.sass +14 -0
  109. data/node_modules/bulma/sass/helpers/overflow.sass +2 -0
  110. data/node_modules/bulma/sass/helpers/position.sass +7 -0
  111. data/node_modules/bulma/sass/helpers/spacing.sass +31 -0
  112. data/node_modules/bulma/sass/helpers/typography.sass +103 -0
  113. data/node_modules/bulma/sass/helpers/visibility.sass +122 -0
  114. data/node_modules/bulma/sass/layout/_all.sass +6 -0
  115. data/node_modules/bulma/sass/layout/footer.sass +11 -0
  116. data/node_modules/bulma/sass/layout/hero.sass +153 -0
  117. data/node_modules/bulma/sass/layout/section.sass +17 -0
  118. data/node_modules/bulma/sass/utilities/_all.sass +9 -0
  119. data/node_modules/bulma/sass/utilities/animations.sass +1 -0
  120. data/node_modules/bulma/sass/utilities/controls.sass +49 -0
  121. data/node_modules/bulma/sass/utilities/derived-variables.sass +114 -0
  122. data/node_modules/bulma/sass/utilities/extends.sass +25 -0
  123. data/node_modules/bulma/sass/utilities/functions.sass +136 -0
  124. data/node_modules/bulma/sass/utilities/initial-variables.sass +78 -0
  125. data/node_modules/bulma/sass/utilities/mixins.sass +280 -0
  126. data/node_modules/bulma-block-list/LICENSE.txt +21 -0
  127. data/node_modules/bulma-block-list/README.md +32 -0
  128. data/node_modules/bulma-block-list/docs/Gemfile +3 -0
  129. data/node_modules/bulma-block-list/docs/_config.yml +15 -0
  130. data/node_modules/bulma-block-list/docs/_data/menu.yaml +20 -0
  131. data/node_modules/bulma-block-list/docs/_sass/_block-list.scss +109 -0
  132. data/node_modules/bulma-block-list/docs/_sass/_main.scss +20 -0
  133. data/node_modules/bulma-block-list/docs/assets/css/app.scss +7 -0
  134. data/node_modules/bulma-block-list/docs/favicon.ico +0 -0
  135. data/node_modules/bulma-block-list/docs/index.html +260 -0
  136. data/node_modules/bulma-block-list/node_modules/bulma/CHANGELOG.md +1390 -0
  137. data/node_modules/bulma-block-list/node_modules/bulma/LICENSE +21 -0
  138. data/node_modules/bulma-block-list/node_modules/bulma/README.md +130 -0
  139. data/node_modules/bulma-block-list/node_modules/bulma/bulma.sass +9 -0
  140. data/node_modules/bulma-block-list/node_modules/bulma/css/bulma.css +10855 -0
  141. data/node_modules/bulma-block-list/node_modules/bulma/css/bulma.css.map +1 -0
  142. data/node_modules/bulma-block-list/node_modules/bulma/css/bulma.min.css +1 -0
  143. data/node_modules/bulma-block-list/node_modules/bulma/package.json +77 -0
  144. data/node_modules/bulma-block-list/node_modules/bulma/sass/base/_all.sass +5 -0
  145. data/node_modules/bulma-block-list/node_modules/bulma/sass/base/generic.sass +142 -0
  146. data/node_modules/bulma-block-list/node_modules/bulma/sass/base/helpers.sass +281 -0
  147. data/node_modules/bulma-block-list/node_modules/bulma/sass/base/minireset.sass +79 -0
  148. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/_all.sass +15 -0
  149. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/breadcrumb.sass +75 -0
  150. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/card.sass +79 -0
  151. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/dropdown.sass +81 -0
  152. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/level.sass +77 -0
  153. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/list.sass +39 -0
  154. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/media.sass +50 -0
  155. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/menu.sass +57 -0
  156. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/message.sass +99 -0
  157. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/modal.sass +113 -0
  158. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/navbar.sass +441 -0
  159. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/pagination.sass +150 -0
  160. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/panel.sass +119 -0
  161. data/node_modules/bulma-block-list/node_modules/bulma/sass/components/tabs.sass +151 -0
  162. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/_all.sass +15 -0
  163. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/box.sass +24 -0
  164. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/button.sass +323 -0
  165. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/container.sass +24 -0
  166. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/content.sass +155 -0
  167. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/form.sass +1 -0
  168. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/icon.sass +21 -0
  169. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/image.sass +71 -0
  170. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/notification.sass +43 -0
  171. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/other.sass +39 -0
  172. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/progress.sass +67 -0
  173. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/table.sass +127 -0
  174. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/tag.sass +128 -0
  175. data/node_modules/bulma-block-list/node_modules/bulma/sass/elements/title.sass +70 -0
  176. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/_all.sass +8 -0
  177. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/checkbox-radio.sass +21 -0
  178. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/file.sass +180 -0
  179. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/input-textarea.sass +64 -0
  180. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/select.sass +85 -0
  181. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/shared.sass +55 -0
  182. data/node_modules/bulma-block-list/node_modules/bulma/sass/form/tools.sass +205 -0
  183. data/node_modules/bulma-block-list/node_modules/bulma/sass/grid/_all.sass +4 -0
  184. data/node_modules/bulma-block-list/node_modules/bulma/sass/grid/columns.sass +504 -0
  185. data/node_modules/bulma-block-list/node_modules/bulma/sass/grid/tiles.sass +34 -0
  186. data/node_modules/bulma-block-list/node_modules/bulma/sass/layout/_all.sass +5 -0
  187. data/node_modules/bulma-block-list/node_modules/bulma/sass/layout/footer.sass +9 -0
  188. data/node_modules/bulma-block-list/node_modules/bulma/sass/layout/hero.sass +145 -0
  189. data/node_modules/bulma-block-list/node_modules/bulma/sass/layout/section.sass +13 -0
  190. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/_all.sass +8 -0
  191. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/animations.sass +5 -0
  192. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/controls.sass +50 -0
  193. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/derived-variables.sass +106 -0
  194. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/functions.sass +110 -0
  195. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/initial-variables.sass +77 -0
  196. data/node_modules/bulma-block-list/node_modules/bulma/sass/utilities/mixins.sass +261 -0
  197. data/node_modules/bulma-block-list/package.json +56 -0
  198. data/node_modules/bulma-block-list/src/block-list.scss +109 -0
  199. data/node_modules/bulma-block-list/src/demo.scss +3 -0
  200. data/package-lock.json +28 -0
  201. data/package.json +20 -0
  202. metadata +441 -0
@@ -0,0 +1,136 @@
1
+ @function mergeColorMaps($bulma-colors, $custom-colors)
2
+ // We return at least Bulma's hard-coded colors
3
+ $merged-colors: $bulma-colors
4
+
5
+ // We want a map as input
6
+ @if type-of($custom-colors) == 'map'
7
+ @each $name, $components in $custom-colors
8
+ // The color name should be a string
9
+ // and the components either a single color
10
+ // or a colors list with at least one element
11
+ @if type-of($name) == 'string' and (type-of($components) == 'list' or type-of($components) == 'color') and length($components) >= 1
12
+ $color-base: null
13
+ $color-invert: null
14
+ $color-light: null
15
+ $color-dark: null
16
+ $value: null
17
+
18
+ // The param can either be a single color
19
+ // or a list of 2 colors
20
+ @if type-of($components) == 'color'
21
+ $color-base: $components
22
+ $color-invert: findColorInvert($color-base)
23
+ $color-light: findLightColor($color-base)
24
+ $color-dark: findDarkColor($color-base)
25
+ @else if type-of($components) == 'list'
26
+ $color-base: nth($components, 1)
27
+ // If Invert, Light and Dark are provided
28
+ @if length($components) > 3
29
+ $color-invert: nth($components, 2)
30
+ $color-light: nth($components, 3)
31
+ $color-dark: nth($components, 4)
32
+ // If only Invert and Light are provided
33
+ @else if length($components) > 2
34
+ $color-invert: nth($components, 2)
35
+ $color-light: nth($components, 3)
36
+ $color-dark: findDarkColor($color-base)
37
+ // If only Invert is provided
38
+ @else
39
+ $color-invert: nth($components, 2)
40
+ $color-light: findLightColor($color-base)
41
+ $color-dark: findDarkColor($color-base)
42
+
43
+ $value: ($color-base, $color-invert, $color-light, $color-dark)
44
+
45
+ // We only want to merge the map if the color base is an actual color
46
+ @if type-of($color-base) == 'color'
47
+ // We merge this colors elements as map with Bulma's colors map
48
+ // (we can override them this way, no multiple definition for the same name)
49
+ // $merged-colors: map_merge($merged-colors, ($name: ($color-base, $color-invert, $color-light, $color-dark)))
50
+ $merged-colors: map_merge($merged-colors, ($name: $value))
51
+
52
+ @return $merged-colors
53
+
54
+ @function powerNumber($number, $exp)
55
+ $value: 1
56
+ @if $exp > 0
57
+ @for $i from 1 through $exp
58
+ $value: $value * $number
59
+ @else if $exp < 0
60
+ @for $i from 1 through -$exp
61
+ $value: divide($value, $number)
62
+ @return $value
63
+
64
+ @function colorLuminance($color)
65
+ @if type-of($color) != 'color'
66
+ @return 0.55
67
+ $color-rgb: ('red': red($color),'green': green($color),'blue': blue($color))
68
+ @each $name, $value in $color-rgb
69
+ $adjusted: 0
70
+ $value: divide($value, 255)
71
+ @if $value < 0.03928
72
+ $value: divide($value, 12.92)
73
+ @else
74
+ $value: divide(($value + .055), 1.055)
75
+ $value: powerNumber($value, 2)
76
+ $color-rgb: map-merge($color-rgb, ($name: $value))
77
+ @return (map-get($color-rgb, 'red') * .2126) + (map-get($color-rgb, 'green') * .7152) + (map-get($color-rgb, 'blue') * .0722)
78
+
79
+ @function findColorInvert($color)
80
+ @if (colorLuminance($color) > 0.55)
81
+ @return rgba(#000, 0.7)
82
+ @else
83
+ @return #fff
84
+
85
+ @function findLightColor($color)
86
+ @if type-of($color) == 'color'
87
+ $l: 96%
88
+ @if lightness($color) > 96%
89
+ $l: lightness($color)
90
+ @return change-color($color, $lightness: $l)
91
+ @return $background
92
+
93
+ @function findDarkColor($color)
94
+ @if type-of($color) == 'color'
95
+ $base-l: 29%
96
+ $luminance: colorLuminance($color)
97
+ $luminance-delta: (0.53 - $luminance)
98
+ $target-l: round($base-l + ($luminance-delta * 53))
99
+ @return change-color($color, $lightness: max($base-l, $target-l))
100
+ @return $text-strong
101
+
102
+ @function bulmaRgba($color, $alpha)
103
+ @if type-of($color) != 'color'
104
+ @return $color
105
+ @return rgba($color, $alpha)
106
+
107
+ @function bulmaDarken($color, $amount)
108
+ @if type-of($color) != 'color'
109
+ @return $color
110
+ @return darken($color, $amount)
111
+
112
+ @function bulmaLighten($color, $amount)
113
+ @if type-of($color) != 'color'
114
+ @return $color
115
+ @return lighten($color, $amount)
116
+
117
+ // Custom divide function by @mdo from https://github.com/twbs/bootstrap/pull/34245
118
+ // Replaces old slash division deprecated in Dart Sass
119
+ @function divide($dividend, $divisor, $precision: 10)
120
+ $sign: if($dividend > 0 and $divisor > 0, 1, -1)
121
+ $dividend: abs($dividend)
122
+ $divisor: abs($divisor)
123
+ $quotient: 0
124
+ $remainder: $dividend
125
+ @if $dividend == 0
126
+ @return 0
127
+ @if $divisor == 0
128
+ @error "Cannot divide by 0"
129
+ @if $divisor == 1
130
+ @return $dividend
131
+ @while $remainder >= $divisor
132
+ $quotient: $quotient + 1
133
+ $remainder: $remainder - $divisor
134
+ @if $remainder > 0 and $precision > 0
135
+ $remainder: divide($remainder * 10, $divisor, $precision - 1) * .1
136
+ @return ($quotient + $remainder) * $sign
@@ -0,0 +1,78 @@
1
+ // Colors
2
+
3
+ $black: hsl(0, 0%, 4%) !default
4
+ $black-bis: hsl(0, 0%, 7%) !default
5
+ $black-ter: hsl(0, 0%, 14%) !default
6
+
7
+ $grey-darker: hsl(0, 0%, 21%) !default
8
+ $grey-dark: hsl(0, 0%, 29%) !default
9
+ $grey: hsl(0, 0%, 48%) !default
10
+ $grey-light: hsl(0, 0%, 71%) !default
11
+ $grey-lighter: hsl(0, 0%, 86%) !default
12
+ $grey-lightest: hsl(0, 0%, 93%) !default
13
+
14
+ $white-ter: hsl(0, 0%, 96%) !default
15
+ $white-bis: hsl(0, 0%, 98%) !default
16
+ $white: hsl(0, 0%, 100%) !default
17
+
18
+ $orange: hsl(14, 100%, 53%) !default
19
+ $yellow: hsl(44, 100%, 77%) !default
20
+ $green: hsl(153, 53%, 53%) !default
21
+ $turquoise: hsl(171, 100%, 41%) !default
22
+ $cyan: hsl(207, 61%, 53%) !default
23
+ $blue: hsl(229, 53%, 53%) !default
24
+ $purple: hsl(271, 100%, 71%) !default
25
+ $red: hsl(348, 86%, 61%) !default
26
+
27
+ // Typography
28
+
29
+ $family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !default
30
+ $family-monospace: monospace !default
31
+ $render-mode: optimizeLegibility !default
32
+
33
+ $size-1: 3rem !default
34
+ $size-2: 2.5rem !default
35
+ $size-3: 2rem !default
36
+ $size-4: 1.5rem !default
37
+ $size-5: 1.25rem !default
38
+ $size-6: 1rem !default
39
+ $size-7: 0.75rem !default
40
+
41
+ $weight-light: 300 !default
42
+ $weight-normal: 400 !default
43
+ $weight-medium: 500 !default
44
+ $weight-semibold: 600 !default
45
+ $weight-bold: 700 !default
46
+
47
+ // Spacing
48
+
49
+ $block-spacing: 1.5rem !default
50
+
51
+ // Responsiveness
52
+
53
+ // The container horizontal gap, which acts as the offset for breakpoints
54
+ $gap: 32px !default
55
+ // 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
56
+ $tablet: 769px !default
57
+ // 960px container + 4rem
58
+ $desktop: 960px + (2 * $gap) !default
59
+ // 1152px container + 4rem
60
+ $widescreen: 1152px + (2 * $gap) !default
61
+ $widescreen-enabled: true !default
62
+ // 1344px container + 4rem
63
+ $fullhd: 1344px + (2 * $gap) !default
64
+ $fullhd-enabled: true !default
65
+
66
+ // Miscellaneous
67
+
68
+ $easing: ease-out !default
69
+ $radius-small: 2px !default
70
+ $radius: 4px !default
71
+ $radius-large: 6px !default
72
+ $radius-rounded: 9999px !default
73
+ $speed: 86ms !default
74
+
75
+ // Flags
76
+
77
+ $variable-columns: true !default
78
+ $rtl: false !default
@@ -0,0 +1,280 @@
1
+ @import "derived-variables"
2
+
3
+ =clearfix
4
+ &::after
5
+ clear: both
6
+ content: " "
7
+ display: table
8
+
9
+ =center($width, $height: 0)
10
+ position: absolute
11
+ @if $height != 0
12
+ left: calc(50% - (#{$width} * 0.5))
13
+ top: calc(50% - (#{$height} * 0.5))
14
+ @else
15
+ left: calc(50% - (#{$width} * 0.5))
16
+ top: calc(50% - (#{$width} * 0.5))
17
+
18
+ =fa($size, $dimensions)
19
+ display: inline-block
20
+ font-size: $size
21
+ height: $dimensions
22
+ line-height: $dimensions
23
+ text-align: center
24
+ vertical-align: top
25
+ width: $dimensions
26
+
27
+ =hamburger($dimensions)
28
+ cursor: pointer
29
+ display: block
30
+ height: $dimensions
31
+ position: relative
32
+ width: $dimensions
33
+ span
34
+ background-color: currentColor
35
+ display: block
36
+ height: 1px
37
+ left: calc(50% - 8px)
38
+ position: absolute
39
+ transform-origin: center
40
+ transition-duration: $speed
41
+ transition-property: background-color, opacity, transform
42
+ transition-timing-function: $easing
43
+ width: 16px
44
+ &:nth-child(1)
45
+ top: calc(50% - 6px)
46
+ &:nth-child(2)
47
+ top: calc(50% - 1px)
48
+ &:nth-child(3)
49
+ top: calc(50% + 4px)
50
+ &:hover
51
+ background-color: bulmaRgba(black, 0.05)
52
+ // Modifers
53
+ &.is-active
54
+ span
55
+ &:nth-child(1)
56
+ transform: translateY(5px) rotate(45deg)
57
+ &:nth-child(2)
58
+ opacity: 0
59
+ &:nth-child(3)
60
+ transform: translateY(-5px) rotate(-45deg)
61
+
62
+ =overflow-touch
63
+ -webkit-overflow-scrolling: touch
64
+
65
+ =placeholder
66
+ $placeholders: ':-moz' ':-webkit-input' '-moz' '-ms-input'
67
+ @each $placeholder in $placeholders
68
+ &:#{$placeholder}-placeholder
69
+ @content
70
+
71
+ =reset
72
+ -moz-appearance: none
73
+ -webkit-appearance: none
74
+ appearance: none
75
+ background: none
76
+ border: none
77
+ color: currentColor
78
+ font-family: inherit
79
+ font-size: 1em
80
+ margin: 0
81
+ padding: 0
82
+
83
+ // Responsiveness
84
+
85
+ =from($device)
86
+ @media screen and (min-width: $device)
87
+ @content
88
+
89
+ =until($device)
90
+ @media screen and (max-width: $device - 1px)
91
+ @content
92
+
93
+ =mobile
94
+ @media screen and (max-width: $tablet - 1px)
95
+ @content
96
+
97
+ =tablet
98
+ @media screen and (min-width: $tablet), print
99
+ @content
100
+
101
+ =tablet-only
102
+ @media screen and (min-width: $tablet) and (max-width: $desktop - 1px)
103
+ @content
104
+
105
+ =touch
106
+ @media screen and (max-width: $desktop - 1px)
107
+ @content
108
+
109
+ =desktop
110
+ @media screen and (min-width: $desktop)
111
+ @content
112
+
113
+ =desktop-only
114
+ @if $widescreen-enabled
115
+ @media screen and (min-width: $desktop) and (max-width: $widescreen - 1px)
116
+ @content
117
+
118
+ =until-widescreen
119
+ @if $widescreen-enabled
120
+ @media screen and (max-width: $widescreen - 1px)
121
+ @content
122
+
123
+ =widescreen
124
+ @if $widescreen-enabled
125
+ @media screen and (min-width: $widescreen)
126
+ @content
127
+
128
+ =widescreen-only
129
+ @if $widescreen-enabled and $fullhd-enabled
130
+ @media screen and (min-width: $widescreen) and (max-width: $fullhd - 1px)
131
+ @content
132
+
133
+ =until-fullhd
134
+ @if $fullhd-enabled
135
+ @media screen and (max-width: $fullhd - 1px)
136
+ @content
137
+
138
+ =fullhd
139
+ @if $fullhd-enabled
140
+ @media screen and (min-width: $fullhd)
141
+ @content
142
+
143
+ =ltr
144
+ @if not $rtl
145
+ @content
146
+
147
+ =rtl
148
+ @if $rtl
149
+ @content
150
+
151
+ =ltr-property($property, $spacing, $right: true)
152
+ $normal: if($right, "right", "left")
153
+ $opposite: if($right, "left", "right")
154
+ @if $rtl
155
+ #{$property}-#{$opposite}: $spacing
156
+ @else
157
+ #{$property}-#{$normal}: $spacing
158
+
159
+ =ltr-position($spacing, $right: true)
160
+ $normal: if($right, "right", "left")
161
+ $opposite: if($right, "left", "right")
162
+ @if $rtl
163
+ #{$opposite}: $spacing
164
+ @else
165
+ #{$normal}: $spacing
166
+
167
+ // Placeholders
168
+
169
+ =unselectable
170
+ -webkit-touch-callout: none
171
+ -webkit-user-select: none
172
+ -moz-user-select: none
173
+ -ms-user-select: none
174
+ user-select: none
175
+
176
+ =arrow($color: transparent)
177
+ border: 3px solid $color
178
+ border-radius: 2px
179
+ border-right: 0
180
+ border-top: 0
181
+ content: " "
182
+ display: block
183
+ height: 0.625em
184
+ margin-top: -0.4375em
185
+ pointer-events: none
186
+ position: absolute
187
+ top: 50%
188
+ transform: rotate(-45deg)
189
+ transform-origin: center
190
+ width: 0.625em
191
+
192
+ =block($spacing: $block-spacing)
193
+ &:not(:last-child)
194
+ margin-bottom: $spacing
195
+
196
+ =delete
197
+ +unselectable
198
+ -moz-appearance: none
199
+ -webkit-appearance: none
200
+ background-color: bulmaRgba($scheme-invert, 0.2)
201
+ border: none
202
+ border-radius: $radius-rounded
203
+ cursor: pointer
204
+ pointer-events: auto
205
+ display: inline-block
206
+ flex-grow: 0
207
+ flex-shrink: 0
208
+ font-size: 0
209
+ height: 20px
210
+ max-height: 20px
211
+ max-width: 20px
212
+ min-height: 20px
213
+ min-width: 20px
214
+ outline: none
215
+ position: relative
216
+ vertical-align: top
217
+ width: 20px
218
+ &::before,
219
+ &::after
220
+ background-color: $scheme-main
221
+ content: ""
222
+ display: block
223
+ left: 50%
224
+ position: absolute
225
+ top: 50%
226
+ transform: translateX(-50%) translateY(-50%) rotate(45deg)
227
+ transform-origin: center center
228
+ &::before
229
+ height: 2px
230
+ width: 50%
231
+ &::after
232
+ height: 50%
233
+ width: 2px
234
+ &:hover,
235
+ &:focus
236
+ background-color: bulmaRgba($scheme-invert, 0.3)
237
+ &:active
238
+ background-color: bulmaRgba($scheme-invert, 0.4)
239
+ // Sizes
240
+ &.is-small
241
+ height: 16px
242
+ max-height: 16px
243
+ max-width: 16px
244
+ min-height: 16px
245
+ min-width: 16px
246
+ width: 16px
247
+ &.is-medium
248
+ height: 24px
249
+ max-height: 24px
250
+ max-width: 24px
251
+ min-height: 24px
252
+ min-width: 24px
253
+ width: 24px
254
+ &.is-large
255
+ height: 32px
256
+ max-height: 32px
257
+ max-width: 32px
258
+ min-height: 32px
259
+ min-width: 32px
260
+ width: 32px
261
+
262
+ =loader
263
+ animation: spinAround 500ms infinite linear
264
+ border: 2px solid $grey-lighter
265
+ border-radius: $radius-rounded
266
+ border-right-color: transparent
267
+ border-top-color: transparent
268
+ content: ""
269
+ display: block
270
+ height: 1em
271
+ position: relative
272
+ width: 1em
273
+
274
+ =overlay($offset: 0)
275
+ bottom: $offset
276
+ left: $offset
277
+ position: absolute
278
+ right: $offset
279
+ top: $offset
280
+
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2019 CS Rhymes
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
@@ -0,0 +1,32 @@
1
+ # bulma-block-list
2
+
3
+ ![npm](https://img.shields.io/npm/dw/bulma-block-list)
4
+
5
+ A simple scss package extending Bulma with block style list elements
6
+
7
+ * `npm i -S bulma-block-list`
8
+ * `@import "node_modules/bulma-block-list/src/block-list";` after importing [Bulma](https://bulma.io/documentation/customize/with-node-sass/#3-create-a-sass-file).
9
+ * Create a ul and give it the class of `block-list`
10
+ * Add any modifier classes to change the styles as needed
11
+
12
+ ```html
13
+ <ul class="block-list is-small is-outlined is-success is-centered">
14
+ <li>Item one</li>
15
+ <li>Item two</li>
16
+ <li>Item three</li>
17
+ </ul>
18
+ ```
19
+
20
+ ## List Item Overrides
21
+
22
+ In v0.3 you can override the list item styles.
23
+
24
+ ```html
25
+ <ul class="block-list is-small">
26
+ <li>Item one</li>
27
+ <li class="is-primary is-outlined is-large">Item two</li>
28
+ <li>Item three</li>
29
+ </ul>
30
+ ```
31
+
32
+ For examples see [csrhymes.com/bulma-block-list](https://www.csrhymes.com/bulma-block-list)
@@ -0,0 +1,3 @@
1
+ source 'https://rubygems.org'
2
+ gem "bulma-clean-theme", '0.10.5'
3
+ gem 'github-pages', group: :jekyll_plugins
@@ -0,0 +1,15 @@
1
+ title: Bulma Block List
2
+ description: >- # this means to ignore newlines until "baseurl:"
3
+ Bulma Block List is a simple scss package extending Bulma with block style list elements
4
+ baseurl: "/bulma-block-list"
5
+ url: "https://www.csrhymes.com"
6
+ gh_sponsor: chrisrhymes
7
+ favicon: /favicon.ico
8
+ google_analytics: UA-49024852-2
9
+ remote_theme: chrisrhymes/bulma-clean-theme
10
+
11
+ # Build settings
12
+ markdown: kramdown
13
+ plugins:
14
+ - jekyll-feed
15
+ - github-pages
@@ -0,0 +1,20 @@
1
+ - label: Docs
2
+ items:
3
+ - name: How To Use
4
+ link: '/#how-to-use'
5
+ - name: Alignment
6
+ link: '/#alignment'
7
+ - name: Sizes
8
+ link: '/#sizes'
9
+ - name: Colours
10
+ link: '/#colours'
11
+ - name: Outlined
12
+ link: '/#outlined'
13
+ - name: Has Radius
14
+ link: '/#has-radius'
15
+ - name: Is Highlighted
16
+ link: '/#highlighted'
17
+ - name: List Item Overrides
18
+ link: '/#list-item-overrides'
19
+ - name: Combinations
20
+ link: '/#combinations'
@@ -0,0 +1,109 @@
1
+ @charset "utf-8";
2
+
3
+ $block-list-separator: 0.25rem !default;
4
+ $block-list-highlight-width: 5px !default;
5
+
6
+ .content {
7
+ ul.block-list {
8
+ list-style: none;
9
+ margin-left: 0;
10
+ }
11
+ }
12
+
13
+ .block-list {
14
+ list-style: none;
15
+
16
+ li {
17
+ padding: ($gap / 2);
18
+ background: $light;
19
+ margin-bottom: $block-list-separator;
20
+ }
21
+
22
+ li.is-left,
23
+ &.is-left > li {
24
+ text-align: left;
25
+ }
26
+
27
+
28
+ li.is-centered,
29
+ &.is-centered > li {
30
+ text-align: center;
31
+ }
32
+
33
+ li.is-right,
34
+ &.is-right > li {
35
+ text-align: right;
36
+ }
37
+
38
+ li.is-small,
39
+ &.is-small > li {
40
+ font-size: $small-font-size;
41
+ padding: ($gap / 3);
42
+ }
43
+
44
+ li.is-normal,
45
+ &.is-normal > li {
46
+ font-size: $body-font-size;
47
+ }
48
+
49
+ li.is-large,
50
+ &.is-large > li {
51
+ font-size: $size-large;
52
+ }
53
+
54
+ li.has-radius,
55
+ &.has-radius > li {
56
+ border-radius: $radius;
57
+ }
58
+
59
+ li.is-highlighted,
60
+ &.is-highlighted > li {
61
+ border-left: $block-list-highlight-width $dark solid;
62
+ }
63
+
64
+ @mixin outlined($color) {
65
+ background: transparent;
66
+ color: $color;
67
+ border: 1px solid $color;
68
+ }
69
+
70
+ li.is-outlined,
71
+ &.is-outlined > li {
72
+ @include outlined($border);
73
+ color: $text;
74
+ }
75
+
76
+ @each $name, $pair in $colors {
77
+
78
+ $color: nth($pair, 1);
79
+ $color-invert: nth($pair, 2);
80
+
81
+ li.is-#{$name},
82
+ &.is-#{$name} > li {
83
+ background: $color;
84
+ color: $color-invert;
85
+ }
86
+
87
+ li.is-#{$name}.is-outlined {
88
+ @include outlined($color);
89
+ }
90
+
91
+ li.is-#{$name}.is-highlighted {
92
+ @include outlined($color);
93
+ border-left: $block-list-highlight-width $color solid;
94
+ }
95
+
96
+ &.is-#{$name} {
97
+ li.is-outlined,
98
+ &.is-outlined > li {
99
+ @include outlined($color);
100
+ }
101
+
102
+ li.is-highlighted,
103
+ &.is-highlighted > li {
104
+ @include outlined($color);
105
+ border-left: $block-list-highlight-width $color solid;
106
+ }
107
+ }
108
+ }
109
+ }