Update Node_modules
This commit is contained in:
+93
-1
@@ -1,5 +1,97 @@
|
||||
# Bulma Changelog
|
||||
|
||||
## Upcoming release
|
||||
|
||||
### Deprecation warning
|
||||
|
||||
The `form.sass` file is **deprecated**. It has moved into its own `/form` folder. If you were importing `form.sass`, please import `sass/form/_all.sass` now.
|
||||
If you were simply importing the whole of Bulma with `@import "~/bulma/bulma.sass"` or similar, you won't have to change anything, and everything will work as bbefore.
|
||||
|
||||
### New features
|
||||
|
||||
#### Support for overriding the `font-family`
|
||||
|
||||
You can now specify a different `font-family` for the `.title`, `.subtitle` and `.button` by using the variables `$title-family`, `$subtitle-family` and `$button-family` respectively.
|
||||
|
||||
Simply set a value when importing Bulma:
|
||||
|
||||
```scss
|
||||
$title-family: "Georgia", serif;
|
||||
```
|
||||
|
||||
* #2375 Add `.is-relative` helper
|
||||
* #2321 Make `.navbar` focus behave like hover for the navigation
|
||||
* #2290 Fix #1186 -> Reset the offset on columns
|
||||
* #2231 Add `.has-text-weight-medium` helper
|
||||
* #2224 Add customizable border radius to progress bar
|
||||
* #2480 Add `$footer-color` variable
|
||||
|
||||
### Improvements
|
||||
|
||||
* #2396 Update docs with webpack 4 example
|
||||
* #2381 Make centered buttons have equal margin
|
||||
* Fix #2297 -> Remove `.container` fixed width values, use `flex-grow`
|
||||
* #2478 Move form.sass into its own folder
|
||||
|
||||
### Bug fixes
|
||||
|
||||
* #2420 Fix #2414 -> Fix `align` attribute in `td/th` being ignored
|
||||
* #2463 Remove duplicate `.has-addons` in `tag.sass`
|
||||
* #2253 Fix `$gap` variable default value
|
||||
* #2273 Fix #2258 -> Fix Indeterminate Progress Bar animation in Firefox
|
||||
* #2175 Proper aligning for `.tabs` within `.content`
|
||||
* #2476 Fix #2441 -> Correct active pagination link text colour on hero
|
||||
|
||||
Fix #1979 -> Correct loading spinner color when a button is:
|
||||
|
||||
* outlined and hovered/focused
|
||||
* outlined, inverted and hovered/focused
|
||||
|
||||
### New variables
|
||||
|
||||
#### Initial variables
|
||||
|
||||
* `$block-spacing`
|
||||
|
||||
#### Base
|
||||
|
||||
* `$body-font-size`
|
||||
* `$small-font-size`
|
||||
* `$pre-font-size`
|
||||
* `$pre-padding`
|
||||
* `$pre-code-font-size`
|
||||
|
||||
#### Components
|
||||
|
||||
* `$card-header-padding`
|
||||
* `$card-content-padding`
|
||||
* `$card-media-margin`
|
||||
* `$dropdown-menu-min-width`
|
||||
* `$dropdown-content-padding-bottom`
|
||||
* `$dropdown-content-padding-top`
|
||||
* `$level-item-spacing`
|
||||
* `$menu-list-line-height`
|
||||
* `$menu-list-link-padding`
|
||||
* `$menu-nested-list-margin`
|
||||
* `$menu-nested-list-padding-left`
|
||||
* `$menu-label-font-size`
|
||||
* `$menu-label-letter-spacing`
|
||||
* `$menu-label-spacing`
|
||||
* `$pagination-item-font-size`
|
||||
* `$pagination-item-margin`
|
||||
* `$pagination-item-padding-left`
|
||||
* `$pagination-item-padding-right`
|
||||
* `$panel-margin`
|
||||
* `$panel-tabs-font-size`
|
||||
|
||||
#### Elements
|
||||
|
||||
* `$container-offset`
|
||||
|
||||
#### Grid
|
||||
|
||||
* `$tile-spacing`
|
||||
|
||||
## 0.7.3
|
||||
|
||||
### New features
|
||||
@@ -1019,7 +1111,7 @@ Variable name changes (mostly appending `-color`):
|
||||
## 0.0.26
|
||||
|
||||
* Added: `.modal-card`
|
||||
* Added: display responsive utilites
|
||||
* Added: display responsive utilities
|
||||
* Added: `.nav-center`
|
||||
* Added: `.tabs ul` left center right
|
||||
* Changed: `.navbar` renamed to `.level`
|
||||
|
||||
+6
-1
@@ -108,7 +108,12 @@ Browse the [online documentation here.](https://bulma.io/documentation/overview/
|
||||
| [BulmaWP](https://github.com/tomhrtly/BulmaWP) | Starter WordPress theme for Bulma |
|
||||
| [Ralma](https://github.com/aldi/ralma) | Stateless Ractive.js Components for Bulma |
|
||||
| [Django Simple Bulma](https://github.com/python-discord/django-simple-bulma) | Lightweight integration of Bulma and Bulma-Extensions for your Django app |
|
||||
| [rbx](https://dfee.github.io/rbx) | Comprehensive React UI Framework written in TypeScript. |
|
||||
| [rbx](https://dfee.github.io/rbx) | Comprehensive React UI Framework written in TypeScript |
|
||||
| [Awesome Bulma Templates](https://github.com/aldi/awesome-bulma-templates) | Free real-world Templates built with Bulma |
|
||||
| [Trunx](http://g14n.info/trunx) | Super Saiyan React components, son of awesome Bulma, implemented in TypeScript |
|
||||
| [@aybolit/bulma](https://github.com/web-padawan/aybolit/tree/master/packages/bulma) | Web Components library inspired by Bulma and Bulma-extensions |
|
||||
| [Drulma](https://www.drupal.org/project/drulma) | Drupal theme for Bulma. |
|
||||
| [Bulrush](https://github.com/textbook/bulrush) | A Bulma-based Python Pelican blog theme |
|
||||
|
||||
## Copyright and license
|
||||
|
||||
|
||||
+9043
File diff suppressed because it is too large
Load Diff
+61
File diff suppressed because one or more lines are too long
+2
-1
@@ -1,8 +1,9 @@
|
||||
@charset "utf-8"
|
||||
/*! bulma.io v0.7.4 | MIT License | github.com/jgthms/bulma */
|
||||
/*! bulma.io v0.7.5 | MIT License | github.com/jgthms/bulma */
|
||||
@import "sass/utilities/_all"
|
||||
@import "sass/base/_all"
|
||||
@import "sass/elements/_all"
|
||||
@import "sass/form/_all"
|
||||
@import "sass/components/_all"
|
||||
@import "sass/grid/_all"
|
||||
@import "sass/layout/_all"
|
||||
|
||||
+1601
-1527
File diff suppressed because it is too large
Load Diff
+1
-1
File diff suppressed because one or more lines are too long
+1
-1
File diff suppressed because one or more lines are too long
+14
-14
@@ -1,26 +1,26 @@
|
||||
{
|
||||
"_from": "bulma@0.7.4",
|
||||
"_id": "bulma@0.7.4",
|
||||
"_from": "bulma@0.7.5",
|
||||
"_id": "bulma@0.7.5",
|
||||
"_inBundle": false,
|
||||
"_integrity": "sha512-krG2rP6eAX1WE0sf6O0SC/FUVSOBX4m1PBC2+GKLpb2pX0qanaDqcv9U2nu75egFrsHkI0zdWYuk/oGwoszVWg==",
|
||||
"_integrity": "sha512-cX98TIn0I6sKba/DhW0FBjtaDpxTelU166pf7ICXpCCuplHWyu6C9LYZmL5PEsnePIeJaiorsTEzzNk3Tsm1hw==",
|
||||
"_location": "/bulma",
|
||||
"_phantomChildren": {},
|
||||
"_requested": {
|
||||
"type": "version",
|
||||
"registry": true,
|
||||
"raw": "bulma@0.7.4",
|
||||
"raw": "bulma@0.7.5",
|
||||
"name": "bulma",
|
||||
"escapedName": "bulma",
|
||||
"rawSpec": "0.7.4",
|
||||
"rawSpec": "0.7.5",
|
||||
"saveSpec": null,
|
||||
"fetchSpec": "0.7.4"
|
||||
"fetchSpec": "0.7.5"
|
||||
},
|
||||
"_requiredBy": [
|
||||
"/buefy"
|
||||
],
|
||||
"_resolved": "https://registry.npmjs.org/bulma/-/bulma-0.7.4.tgz",
|
||||
"_shasum": "7e74512e9118d9799021339e67e365ee0ac4f3f9",
|
||||
"_spec": "bulma@0.7.4",
|
||||
"_resolved": "https://registry.npmjs.org/bulma/-/bulma-0.7.5.tgz",
|
||||
"_shasum": "35066c37f82c088b68f94450be758fc00a967208",
|
||||
"_spec": "bulma@0.7.5",
|
||||
"_where": "/home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/buefy",
|
||||
"author": {
|
||||
"name": "Jeremy Thomas",
|
||||
@@ -34,10 +34,10 @@
|
||||
"deprecated": false,
|
||||
"description": "Modern CSS framework based on Flexbox",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^9.4.7",
|
||||
"clean-css-cli": "^4.2.1",
|
||||
"node-sass": "^4.11.0",
|
||||
"postcss-cli": "^6.1.1",
|
||||
"autoprefixer": "^9.5.1",
|
||||
"clean-css-cli": "^4.3.0",
|
||||
"node-sass": "^4.12.0",
|
||||
"postcss-cli": "^6.1.2",
|
||||
"rimraf": "^2.6.3"
|
||||
},
|
||||
"files": [
|
||||
@@ -73,5 +73,5 @@
|
||||
},
|
||||
"style": "bulma/css/bulma.min.css",
|
||||
"unpkg": "css/bulma.css",
|
||||
"version": "0.7.4"
|
||||
"version": "0.7.5"
|
||||
}
|
||||
|
||||
+21
-9
@@ -1,8 +1,13 @@
|
||||
$body-background-color: $white !default
|
||||
$body-size: 16px !default
|
||||
$body-min-width: 300px !default
|
||||
$body-rendering: optimizeLegibility !default
|
||||
$body-family: $family-primary !default
|
||||
$body-overflow-x: hidden !default
|
||||
$body-overflow-y: scroll !default
|
||||
|
||||
$body-color: $text !default
|
||||
$body-font-size: 1em !default
|
||||
$body-weight: $weight-normal !default
|
||||
$body-line-height: 1.5 !default
|
||||
|
||||
@@ -11,6 +16,8 @@ $code-padding: 0.25em 0.5em 0.25em !default
|
||||
$code-weight: normal !default
|
||||
$code-size: 0.875em !default
|
||||
|
||||
$small-font-size: 0.875em !default
|
||||
|
||||
$hr-background-color: $background !default
|
||||
$hr-height: 2px !default
|
||||
$hr-margin: 1.5rem 0 !default
|
||||
@@ -18,14 +25,18 @@ $hr-margin: 1.5rem 0 !default
|
||||
$strong-color: $text-strong !default
|
||||
$strong-weight: $weight-bold !default
|
||||
|
||||
$pre-font-size: 0.875em !default
|
||||
$pre-padding: 1.25rem 1.5rem !default
|
||||
$pre-code-font-size: 1em !default
|
||||
|
||||
html
|
||||
background-color: $body-background-color
|
||||
font-size: $body-size
|
||||
-moz-osx-font-smoothing: grayscale
|
||||
-webkit-font-smoothing: antialiased
|
||||
min-width: 300px
|
||||
overflow-x: hidden
|
||||
overflow-y: scroll
|
||||
min-width: $body-min-width
|
||||
overflow-x: $body-overflow-x
|
||||
overflow-y: $body-overflow-y
|
||||
text-rendering: $body-rendering
|
||||
text-size-adjust: 100%
|
||||
|
||||
@@ -53,7 +64,7 @@ pre
|
||||
|
||||
body
|
||||
color: $body-color
|
||||
font-size: 1rem
|
||||
font-size: $body-font-size
|
||||
font-weight: $body-weight
|
||||
line-height: $body-line-height
|
||||
|
||||
@@ -91,7 +102,7 @@ input[type="radio"]
|
||||
vertical-align: baseline
|
||||
|
||||
small
|
||||
font-size: 0.875em
|
||||
font-size: $small-font-size
|
||||
|
||||
span
|
||||
font-style: inherit
|
||||
@@ -110,21 +121,22 @@ pre
|
||||
+overflow-touch
|
||||
background-color: $pre-background
|
||||
color: $pre
|
||||
font-size: 0.875em
|
||||
font-size: $pre-font-size
|
||||
overflow-x: auto
|
||||
padding: 1.25rem 1.5rem
|
||||
padding: $pre-padding
|
||||
white-space: pre
|
||||
word-wrap: normal
|
||||
code
|
||||
background-color: transparent
|
||||
color: currentColor
|
||||
font-size: 1em
|
||||
font-size: $pre-code-font-size
|
||||
padding: 0
|
||||
|
||||
table
|
||||
td,
|
||||
th
|
||||
text-align: left
|
||||
vertical-align: top
|
||||
&:not([align])
|
||||
text-align: left
|
||||
th
|
||||
color: $text-strong
|
||||
|
||||
+5
@@ -115,6 +115,8 @@ $alignments: ('centered': 'center', 'justified': 'justify', 'left': 'left', 'rig
|
||||
font-weight: $weight-light !important
|
||||
.has-text-weight-normal
|
||||
font-weight: $weight-normal !important
|
||||
.has-text-weight-medium
|
||||
font-weight: $weight-medium !important
|
||||
.has-text-weight-semibold
|
||||
font-weight: $weight-semibold !important
|
||||
.has-text-weight-bold
|
||||
@@ -274,3 +276,6 @@ $displays: 'block' 'flex' 'inline' 'inline-block' 'inline-flex'
|
||||
|
||||
.is-unselectable
|
||||
@extend %unselectable
|
||||
|
||||
.is-relative
|
||||
position: relative !important
|
||||
|
||||
+89
@@ -0,0 +1,89 @@
|
||||
/*! minireset.css v0.0.4 | MIT License | github.com/jgthms/minireset.css */
|
||||
/* line 3, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
html,
|
||||
body,
|
||||
p,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
blockquote,
|
||||
figure,
|
||||
fieldset,
|
||||
legend,
|
||||
textarea,
|
||||
pre,
|
||||
iframe,
|
||||
hr,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
margin: 0;
|
||||
padding: 0; }
|
||||
|
||||
/* line 30, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: 100%;
|
||||
font-weight: normal; }
|
||||
|
||||
/* line 40, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
ul {
|
||||
list-style: none; }
|
||||
|
||||
/* line 44, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
margin: 0; }
|
||||
|
||||
/* line 51, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
html {
|
||||
box-sizing: border-box; }
|
||||
|
||||
/* line 55, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
*, *::before, *::after {
|
||||
box-sizing: inherit; }
|
||||
|
||||
/* line 61, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
img,
|
||||
embed,
|
||||
iframe,
|
||||
object,
|
||||
video {
|
||||
height: auto;
|
||||
max-width: 100%; }
|
||||
|
||||
/* line 69, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
audio {
|
||||
max-width: 100%; }
|
||||
|
||||
/* line 73, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
iframe {
|
||||
border: 0; }
|
||||
|
||||
/* line 77, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
|
||||
/* line 81, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
td,
|
||||
th {
|
||||
padding: 0; }
|
||||
/* line 84, /home/erik/Documents/workspace_brackets/a1_BME_Project_Ohm/om/node_modules/bulma/sass/base/minireset.sass */
|
||||
td:not([align]),
|
||||
th:not([align]) {
|
||||
text-align: left; }
|
||||
|
||||
/*# sourceMappingURL=minireset.css.map */
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"version": 3,
|
||||
"file": "minireset.css",
|
||||
"sources": [
|
||||
"minireset.sass"
|
||||
],
|
||||
"mappings": "AAAA,2EAA2E;;AAE3E,AAAA,IAAI;AACJ,AAAA,IAAI;AACJ,AAAA,CAAC;AACD,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,UAAU;AACV,AAAA,MAAM;AACN,AAAA,QAAQ;AACR,AAAA,MAAM;AACN,AAAA,QAAQ;AACR,AAAA,GAAG;AACH,AAAA,MAAM;AACN,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,MAAM,EAAE,CAAE;EACV,OAAO,EAAE,CAAE,GAAG;;;AAGhB,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,SAAS,EAAE,IAAK;EAChB,WAAW,EAAE,MAAO,GAAG;;;AAGzB,AAAA,EAAE,CAAC;EACD,UAAU,EAAE,IAAK,GAAG;;;AAGtB,AAAA,MAAM;AACN,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,QAAQ,CAAC;EACP,MAAM,EAAE,CAAE,GAAG;;;AAGf,AAAA,IAAI,CAAC;EACH,UAAU,EAAE,UAAW,GAAG;;;AAE5B,AAAA,CAAC,EAAD,AAAA,CAAC,AAEE,QAAQ,EAFX,AAAA,CAAC,AAGE,OAAO,CAAC;EACP,UAAU,EAAE,OAAQ,GAAG;;;AAG3B,AAAA,GAAG;AACH,AAAA,KAAK;AACL,AAAA,MAAM;AACN,AAAA,MAAM;AACN,AAAA,KAAK,CAAC;EACJ,MAAM,EAAE,IAAK;EACb,SAAS,EAAE,IAAK,GAAG;;;AAErB,AAAA,KAAK,CAAC;EACJ,SAAS,EAAE,IAAK,GAAG;;;AAGrB,AAAA,MAAM,CAAC;EACL,MAAM,EAAE,CAAE,GAAG;;;AAGf,AAAA,KAAK,CAAC;EACJ,eAAe,EAAE,QAAS;EAC1B,cAAc,EAAE,CAAE,GAAG;;;AAEvB,AAAA,EAAE;AACF,AAAA,EAAE,CAAC;EACD,OAAO,EAAE,CAAE,GAEa;;EAJ1B,AAAA,EAAE,AAGC,IAAK,EAAA,AAAA,AAAM,KAAL,AAAA;EAFT,AAAA,EAAE,AAEC,IAAK,EAAA,AAAA,AAAM,KAAL,AAAA,GAAQ;IACb,UAAU,EAAE,IAAK,GAAG",
|
||||
"names": []
|
||||
}
|
||||
+2
-1
@@ -81,4 +81,5 @@ table
|
||||
td,
|
||||
th
|
||||
padding: 0
|
||||
text-align: left
|
||||
&:not([align])
|
||||
text-align: left
|
||||
|
||||
+10
-5
@@ -4,13 +4,18 @@ $card-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1) !default
|
||||
|
||||
$card-header-background-color: transparent !default
|
||||
$card-header-color: $text-strong !default
|
||||
$card-header-padding: 0.75rem !default
|
||||
$card-header-shadow: 0 1px 2px rgba($black, 0.1) !default
|
||||
$card-header-weight: $weight-bold !default
|
||||
|
||||
$card-content-background-color: transparent !default
|
||||
$card-content-padding: 1.5rem !default
|
||||
|
||||
$card-footer-background-color: transparent !default
|
||||
$card-footer-border-top: 1px solid $border !default
|
||||
$card-footer-padding: 0.75rem !default
|
||||
|
||||
$card-media-margin: $block-spacing !default
|
||||
|
||||
.card
|
||||
background-color: $card-background-color
|
||||
@@ -31,7 +36,7 @@ $card-footer-border-top: 1px solid $border !default
|
||||
display: flex
|
||||
flex-grow: 1
|
||||
font-weight: $card-header-weight
|
||||
padding: 0.75rem
|
||||
padding: $card-header-padding
|
||||
&.is-centered
|
||||
justify-content: center
|
||||
|
||||
@@ -40,7 +45,7 @@ $card-footer-border-top: 1px solid $border !default
|
||||
cursor: pointer
|
||||
display: flex
|
||||
justify-content: center
|
||||
padding: 0.75rem
|
||||
padding: $card-header-padding
|
||||
|
||||
.card-image
|
||||
display: block
|
||||
@@ -48,7 +53,7 @@ $card-footer-border-top: 1px solid $border !default
|
||||
|
||||
.card-content
|
||||
background-color: $card-content-background-color
|
||||
padding: 1.5rem
|
||||
padding: $card-content-padding
|
||||
|
||||
.card-footer
|
||||
background-color: $card-footer-background-color
|
||||
@@ -63,7 +68,7 @@ $card-footer-border-top: 1px solid $border !default
|
||||
flex-grow: 1
|
||||
flex-shrink: 0
|
||||
justify-content: center
|
||||
padding: 0.75rem
|
||||
padding: $card-footer-padding
|
||||
&:not(:last-child)
|
||||
border-right: $card-footer-border-top
|
||||
|
||||
@@ -71,4 +76,4 @@ $card-footer-border-top: 1px solid $border !default
|
||||
|
||||
.card
|
||||
.media:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
margin-bottom: $card-media-margin
|
||||
|
||||
+7
-3
@@ -1,6 +1,10 @@
|
||||
$dropdown-menu-min-width: 12rem !default
|
||||
|
||||
$dropdown-content-background-color: $white !default
|
||||
$dropdown-content-arrow: $link !default
|
||||
$dropdown-content-offset: 4px !default
|
||||
$dropdown-content-padding-bottom: 0.5rem !default
|
||||
$dropdown-content-padding-top: 0.5rem !default
|
||||
$dropdown-content-radius: $radius !default
|
||||
$dropdown-content-shadow: 0 2px 3px rgba($black, 0.1), 0 0 0 1px rgba($black, 0.1) !default
|
||||
$dropdown-content-z: 20 !default
|
||||
@@ -35,7 +39,7 @@ $dropdown-divider-background-color: $border !default
|
||||
.dropdown-menu
|
||||
display: none
|
||||
left: 0
|
||||
min-width: 12rem
|
||||
min-width: $dropdown-menu-min-width
|
||||
padding-top: $dropdown-content-offset
|
||||
position: absolute
|
||||
top: 100%
|
||||
@@ -45,8 +49,8 @@ $dropdown-divider-background-color: $border !default
|
||||
background-color: $dropdown-content-background-color
|
||||
border-radius: $dropdown-content-radius
|
||||
box-shadow: $dropdown-content-shadow
|
||||
padding-bottom: 0.5rem
|
||||
padding-top: 0.5rem
|
||||
padding-bottom: $dropdown-content-padding-bottom
|
||||
padding-top: $dropdown-content-padding-top
|
||||
|
||||
.dropdown-item
|
||||
color: $dropdown-item-color
|
||||
|
||||
+5
-3
@@ -1,3 +1,5 @@
|
||||
$level-item-spacing: ($block-spacing / 2) !default
|
||||
|
||||
.level
|
||||
@extend %block
|
||||
align-items: center
|
||||
@@ -18,7 +20,7 @@
|
||||
.level-item
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0
|
||||
margin-right: 0.75rem
|
||||
margin-right: $level-item-spacing
|
||||
&:not(.is-narrow)
|
||||
flex-grow: 1
|
||||
// Responsiveness
|
||||
@@ -41,7 +43,7 @@
|
||||
// Responsiveness
|
||||
+mobile
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
margin-bottom: $level-item-spacing
|
||||
|
||||
.level-left,
|
||||
.level-right
|
||||
@@ -55,7 +57,7 @@
|
||||
// Responsiveness
|
||||
+tablet
|
||||
&:not(:last-child)
|
||||
margin-right: 0.75rem
|
||||
margin-right: $level-item-spacing
|
||||
|
||||
.level-left
|
||||
align-items: center
|
||||
|
||||
+3
-3
@@ -26,8 +26,8 @@ $list-item-hover-background-color: $background !default
|
||||
border-top-left-radius: $list-radius
|
||||
border-top-right-radius: $list-radius
|
||||
&:last-child
|
||||
border-top-left-radius: $list-radius
|
||||
border-top-right-radius: $list-radius
|
||||
border-bottom-left-radius: $list-radius
|
||||
border-bottom-right-radius: $list-radius
|
||||
&:not(:last-child)
|
||||
border-bottom: $list-item-border
|
||||
&.is-active
|
||||
@@ -36,4 +36,4 @@ $list-item-hover-background-color: $background !default
|
||||
|
||||
a.list-item
|
||||
background-color: $list-item-hover-background-color
|
||||
cursor: pointer
|
||||
cursor: pointer
|
||||
|
||||
+15
-8
@@ -6,8 +6,15 @@ $menu-item-active-color: $link-invert !default
|
||||
$menu-item-active-background-color: $link !default
|
||||
|
||||
$menu-list-border-left: 1px solid $border !default
|
||||
$menu-list-line-height: 1.25 !default
|
||||
$menu-list-link-padding: 0.5em 0.75em !default
|
||||
$menu-nested-list-margin: 0.75em !default
|
||||
$menu-nested-list-padding-left: 0.75em !default
|
||||
|
||||
$menu-label-color: $text-light !default
|
||||
$menu-label-font-size: 0.75em !default
|
||||
$menu-label-letter-spacing: 0.1em !default
|
||||
$menu-label-spacing: 1em !default
|
||||
|
||||
.menu
|
||||
font-size: $size-normal
|
||||
@@ -20,12 +27,12 @@ $menu-label-color: $text-light !default
|
||||
font-size: $size-large
|
||||
|
||||
.menu-list
|
||||
line-height: 1.25
|
||||
line-height: $menu-list-line-height
|
||||
a
|
||||
border-radius: $menu-item-radius
|
||||
color: $menu-item-color
|
||||
display: block
|
||||
padding: 0.5em 0.75em
|
||||
padding: $menu-list-link-padding
|
||||
&:hover
|
||||
background-color: $menu-item-hover-background-color
|
||||
color: $menu-item-hover-color
|
||||
@@ -36,15 +43,15 @@ $menu-label-color: $text-light !default
|
||||
li
|
||||
ul
|
||||
border-left: $menu-list-border-left
|
||||
margin: 0.75em
|
||||
padding-left: 0.75em
|
||||
margin: $menu-nested-list-margin
|
||||
padding-left: $menu-nested-list-padding-left
|
||||
|
||||
.menu-label
|
||||
color: $menu-label-color
|
||||
font-size: 0.75em
|
||||
letter-spacing: 0.1em
|
||||
font-size: $menu-label-font-size
|
||||
letter-spacing: $menu-label-letter-spacing
|
||||
text-transform: uppercase
|
||||
&:not(:first-child)
|
||||
margin-top: 1em
|
||||
margin-top: $menu-label-spacing
|
||||
&:not(:last-child)
|
||||
margin-bottom: 1em
|
||||
margin-bottom: $menu-label-spacing
|
||||
|
||||
+2
-1
@@ -17,6 +17,7 @@ $message-body-pre-background-color: $white !default
|
||||
$message-body-pre-code-background-color: transparent !default
|
||||
|
||||
$message-header-body-border-width: 0 !default
|
||||
$message-colors: $colors !default
|
||||
|
||||
.message
|
||||
@extend %block
|
||||
@@ -36,7 +37,7 @@ $message-header-body-border-width: 0 !default
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
@each $name, $pair in $message-colors
|
||||
$color: nth($pair, 1)
|
||||
$color-invert: nth($pair, 2)
|
||||
$color-lightning: max((100% - lightness($color)) - 2%, 0%)
|
||||
|
||||
+1
-1
@@ -102,7 +102,7 @@ $modal-card-body-padding: 20px !default
|
||||
border-top: $modal-card-foot-border-top
|
||||
.button
|
||||
&:not(:last-child)
|
||||
margin-right: 10px
|
||||
margin-right: 0.5em
|
||||
|
||||
.modal-card-body
|
||||
+overflow-touch
|
||||
|
||||
+16
-1
@@ -69,6 +69,7 @@ $navbar-breakpoint: $desktop !default
|
||||
color: $color-invert
|
||||
& > a.navbar-item,
|
||||
.navbar-link
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.is-active
|
||||
background-color: darken($color, 5%)
|
||||
@@ -86,6 +87,7 @@ $navbar-breakpoint: $desktop !default
|
||||
color: $color-invert
|
||||
& > a.navbar-item,
|
||||
.navbar-link
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.is-active
|
||||
background-color: darken($color, 5%)
|
||||
@@ -93,6 +95,7 @@ $navbar-breakpoint: $desktop !default
|
||||
.navbar-link
|
||||
&::after
|
||||
border-color: $color-invert
|
||||
.navbar-item.has-dropdown:focus .navbar-link,
|
||||
.navbar-item.has-dropdown:hover .navbar-link,
|
||||
.navbar-item.has-dropdown.is-active .navbar-link
|
||||
background-color: darken($color, 5%)
|
||||
@@ -135,6 +138,7 @@ body
|
||||
|
||||
.navbar-brand
|
||||
a.navbar-item
|
||||
&:focus,
|
||||
&:hover
|
||||
background-color: transparent
|
||||
|
||||
@@ -167,6 +171,8 @@ body
|
||||
a.navbar-item,
|
||||
.navbar-link
|
||||
cursor: pointer
|
||||
&:focus,
|
||||
&:focus-within,
|
||||
&:hover,
|
||||
&.is-active
|
||||
background-color: $navbar-item-hover-background-color
|
||||
@@ -187,6 +193,7 @@ a.navbar-item,
|
||||
border-bottom: 1px solid transparent
|
||||
min-height: $navbar-height
|
||||
padding-bottom: calc(0.5rem - 1px)
|
||||
&:focus,
|
||||
&:hover
|
||||
background-color: $navbar-tab-hover-background-color
|
||||
border-bottom-color: $navbar-tab-hover-border-bottom-color
|
||||
@@ -286,16 +293,20 @@ a.navbar-item,
|
||||
&.is-transparent
|
||||
a.navbar-item,
|
||||
.navbar-link
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.is-active
|
||||
background-color: transparent !important
|
||||
.navbar-item.has-dropdown
|
||||
&.is-active,
|
||||
&.is-hoverable:focus,
|
||||
&.is-hoverable:focus-within,
|
||||
&.is-hoverable:hover
|
||||
.navbar-link
|
||||
background-color: transparent !important
|
||||
.navbar-dropdown
|
||||
a.navbar-item
|
||||
&:focus,
|
||||
&:hover
|
||||
background-color: $navbar-dropdown-item-hover-background-color
|
||||
color: $navbar-dropdown-item-hover-color
|
||||
@@ -323,6 +334,8 @@ a.navbar-item,
|
||||
box-shadow: 0 -8px 8px rgba($black, 0.1)
|
||||
top: auto
|
||||
&.is-active,
|
||||
&.is-hoverable:focus,
|
||||
&.is-hoverable:focus-within,
|
||||
&.is-hoverable:hover
|
||||
.navbar-dropdown
|
||||
display: block
|
||||
@@ -358,6 +371,7 @@ a.navbar-item,
|
||||
white-space: nowrap
|
||||
a.navbar-item
|
||||
padding-right: 3rem
|
||||
&:focus,
|
||||
&:hover
|
||||
background-color: $navbar-dropdown-item-hover-background-color
|
||||
color: $navbar-dropdown-item-hover-color
|
||||
@@ -413,9 +427,10 @@ a.navbar-item,
|
||||
.navbar-link
|
||||
&.is-active
|
||||
color: $navbar-item-active-color
|
||||
&.is-active:not(:hover)
|
||||
&.is-active:not(:focus):not(:hover)
|
||||
background-color: $navbar-item-active-background-color
|
||||
.navbar-item.has-dropdown
|
||||
&:focus,
|
||||
&:hover,
|
||||
&.is-active
|
||||
.navbar-link
|
||||
|
||||
+9
-4
@@ -3,6 +3,11 @@ $pagination-border-color: $grey-lighter !default
|
||||
$pagination-margin: -0.25rem !default
|
||||
$pagination-min-width: $control-height !default
|
||||
|
||||
$pagination-item-font-size: 1em !default
|
||||
$pagination-item-margin: 0.25rem !default
|
||||
$pagination-item-padding-left: 0.5em !default
|
||||
$pagination-item-padding-right: 0.5em !default
|
||||
|
||||
$pagination-hover-color: $link-hover !default
|
||||
$pagination-hover-border-color: $link-hover-border !default
|
||||
|
||||
@@ -56,11 +61,11 @@ $pagination-shadow-inset: inset 0 1px 2px rgba($black, 0.2)
|
||||
.pagination-ellipsis
|
||||
@extend %control
|
||||
@extend %unselectable
|
||||
font-size: 1em
|
||||
padding-left: 0.5em
|
||||
padding-right: 0.5em
|
||||
font-size: $pagination-item-font-size
|
||||
justify-content: center
|
||||
margin: 0.25rem
|
||||
margin: $pagination-item-margin
|
||||
padding-left: $pagination-item-padding-left
|
||||
padding-right: $pagination-item-padding-right
|
||||
text-align: center
|
||||
|
||||
.pagination-previous,
|
||||
|
||||
+4
-2
@@ -1,3 +1,4 @@
|
||||
$panel-margin: $block-spacing !default
|
||||
$panel-item-border: 1px solid $border !default
|
||||
|
||||
$panel-heading-background-color: $background !default
|
||||
@@ -8,6 +9,7 @@ $panel-heading-radius: $radius !default
|
||||
$panel-heading-size: 1.25em !default
|
||||
$panel-heading-weight: $weight-light !default
|
||||
|
||||
$panel-tabs-font-size: 0.875em !default
|
||||
$panel-tab-border-bottom: 1px solid $border !default
|
||||
$panel-tab-active-border-bottom-color: $link-active-border !default
|
||||
$panel-tab-active-color: $link-active !default
|
||||
@@ -26,7 +28,7 @@ $panel-icon-color: $text-light !default
|
||||
.panel
|
||||
font-size: $size-normal
|
||||
&:not(:last-child)
|
||||
margin-bottom: 1.5rem
|
||||
margin-bottom: $panel-margin
|
||||
|
||||
.panel-heading,
|
||||
.panel-tabs,
|
||||
@@ -49,7 +51,7 @@ $panel-icon-color: $text-light !default
|
||||
.panel-tabs
|
||||
align-items: flex-end
|
||||
display: flex
|
||||
font-size: 0.875em
|
||||
font-size: $panel-tabs-font-size
|
||||
justify-content: center
|
||||
a
|
||||
border-bottom: $panel-tab-border-bottom
|
||||
|
||||
-1
@@ -4,7 +4,6 @@
|
||||
@import "button.sass"
|
||||
@import "container.sass"
|
||||
@import "content.sass"
|
||||
@import "form.sass"
|
||||
@import "icon.sass"
|
||||
@import "image.sass"
|
||||
@import "notification.sass"
|
||||
|
||||
+33
-3
@@ -1,5 +1,6 @@
|
||||
$button-color: $grey-darker !default
|
||||
$button-background-color: $white !default
|
||||
$button-family: false !default
|
||||
|
||||
$button-border-color: $grey-lighter !default
|
||||
$button-border-width: $control-border-width !default
|
||||
@@ -50,6 +51,8 @@ $button-static-border-color: $grey-lighter !default
|
||||
border-width: $button-border-width
|
||||
color: $button-color
|
||||
cursor: pointer
|
||||
@if $button-family
|
||||
font-family: $button-family
|
||||
justify-content: center
|
||||
padding-bottom: $button-padding-vertical
|
||||
padding-left: $button-padding-horizontal
|
||||
@@ -142,7 +145,8 @@ $button-static-border-color: $grey-lighter !default
|
||||
&.is-inverted
|
||||
background-color: $color-invert
|
||||
color: $color
|
||||
&:hover
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
background-color: darken($color-invert, 5%)
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
@@ -158,13 +162,21 @@ $button-static-border-color: $grey-lighter !default
|
||||
border-color: $color
|
||||
color: $color
|
||||
&:hover,
|
||||
&:focus
|
||||
&.is-hovered,
|
||||
&:focus,
|
||||
&.is-focused
|
||||
background-color: $color
|
||||
border-color: $color
|
||||
color: $color-invert
|
||||
&.is-loading
|
||||
&::after
|
||||
border-color: transparent transparent $color $color !important
|
||||
&:hover,
|
||||
&.is-hovered,
|
||||
&:focus,
|
||||
&.is-focused
|
||||
&::after
|
||||
border-color: transparent transparent $color-invert $color-invert !important
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
background-color: transparent
|
||||
@@ -176,9 +188,18 @@ $button-static-border-color: $grey-lighter !default
|
||||
border-color: $color-invert
|
||||
color: $color-invert
|
||||
&:hover,
|
||||
&:focus
|
||||
&.is-hovered,
|
||||
&:focus,
|
||||
&.is-focused
|
||||
background-color: $color-invert
|
||||
color: $color
|
||||
&.is-loading
|
||||
&:hover,
|
||||
&.is-hovered,
|
||||
&:focus,
|
||||
&.is-focused
|
||||
&::after
|
||||
border-color: transparent transparent $color $color !important
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
background-color: transparent
|
||||
@@ -269,7 +290,16 @@ $button-static-border-color: $grey-lighter !default
|
||||
z-index: 4
|
||||
&.is-expanded
|
||||
flex-grow: 1
|
||||
flex-shrink: 1
|
||||
&.is-centered
|
||||
justify-content: center
|
||||
&:not(.has-addons)
|
||||
.button:not(.is-fullwidth)
|
||||
margin-left: 0.25rem
|
||||
margin-right: 0.25rem
|
||||
&.is-right
|
||||
justify-content: flex-end
|
||||
&:not(.has-addons)
|
||||
.button:not(.is-fullwidth)
|
||||
margin-left: 0.25rem
|
||||
margin-right: 0.25rem
|
||||
|
||||
+9
-11
@@ -1,25 +1,23 @@
|
||||
$container-offset: (2 * $gap) !default
|
||||
|
||||
.container
|
||||
flex-grow: 1
|
||||
margin: 0 auto
|
||||
position: relative
|
||||
width: auto
|
||||
+desktop
|
||||
max-width: $desktop - (2 * $gap)
|
||||
width: $desktop - (2 * $gap)
|
||||
max-width: $desktop - $container-offset
|
||||
&.is-fluid
|
||||
margin-left: $gap
|
||||
margin-right: $gap
|
||||
max-width: none
|
||||
width: auto
|
||||
+until-widescreen
|
||||
&.is-widescreen
|
||||
max-width: $widescreen - (2 * $gap)
|
||||
width: auto
|
||||
max-width: $widescreen - $container-offset
|
||||
+until-fullhd
|
||||
&.is-fullhd
|
||||
max-width: $fullhd - (2 * $gap)
|
||||
width: auto
|
||||
max-width: $fullhd - $container-offset
|
||||
+widescreen
|
||||
max-width: $widescreen - (2 * $gap)
|
||||
width: $widescreen - (2 * $gap)
|
||||
max-width: $widescreen - $container-offset
|
||||
+fullhd
|
||||
max-width: $fullhd - (2 * $gap)
|
||||
width: $fullhd - (2 * $gap)
|
||||
max-width: $fullhd - $container-offset
|
||||
|
||||
+5
-1
@@ -125,7 +125,8 @@ $content-table-foot-cell-color: $text-strong !default
|
||||
vertical-align: top
|
||||
th
|
||||
color: $content-table-cell-heading-color
|
||||
text-align: left
|
||||
&:not([align])
|
||||
text-align: left
|
||||
thead
|
||||
td,
|
||||
th
|
||||
@@ -142,6 +143,9 @@ $content-table-foot-cell-color: $text-strong !default
|
||||
td,
|
||||
th
|
||||
border-bottom-width: 0
|
||||
.tabs
|
||||
li + li
|
||||
margin-top: 0
|
||||
// Sizes
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
|
||||
/*# sourceMappingURL=form.css.map */
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"version": 3,
|
||||
"file": "form.css",
|
||||
"sources": [
|
||||
"form.sass"
|
||||
],
|
||||
"mappings": "",
|
||||
"names": []
|
||||
}
|
||||
+1
-602
@@ -1,602 +1 @@
|
||||
$input-color: $grey-darker !default
|
||||
$input-background-color: $white !default
|
||||
$input-border-color: $grey-lighter !default
|
||||
$input-height: $control-height !default
|
||||
$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default
|
||||
$input-placeholder-color: rgba($input-color, 0.3) !default
|
||||
|
||||
$input-hover-color: $grey-darker !default
|
||||
$input-hover-border-color: $grey-light !default
|
||||
|
||||
$input-focus-color: $grey-darker !default
|
||||
$input-focus-border-color: $link !default
|
||||
$input-focus-box-shadow-size: 0 0 0 0.125em !default
|
||||
$input-focus-box-shadow-color: rgba($link, 0.25) !default
|
||||
|
||||
$input-disabled-color: $text-light !default
|
||||
$input-disabled-background-color: $background !default
|
||||
$input-disabled-border-color: $background !default
|
||||
$input-disabled-placeholder-color: rgba($input-disabled-color, 0.3) !default
|
||||
|
||||
$input-arrow: $link !default
|
||||
|
||||
$input-icon-color: $grey-lighter !default
|
||||
$input-icon-active-color: $grey !default
|
||||
|
||||
$input-radius: $radius !default
|
||||
|
||||
$file-border-color: $border !default
|
||||
$file-radius: $radius !default
|
||||
|
||||
$file-cta-background-color: $white-ter !default
|
||||
$file-cta-color: $grey-dark !default
|
||||
$file-cta-hover-color: $grey-darker !default
|
||||
$file-cta-active-color: $grey-darker !default
|
||||
|
||||
$file-name-border-color: $border !default
|
||||
$file-name-border-style: solid !default
|
||||
$file-name-border-width: 1px 1px 1px 0 !default
|
||||
$file-name-max-width: 16em !default
|
||||
|
||||
$label-color: $grey-darker !default
|
||||
$label-weight: $weight-bold !default
|
||||
|
||||
$help-size: $size-small !default
|
||||
|
||||
=input
|
||||
@extend %control
|
||||
background-color: $input-background-color
|
||||
border-color: $input-border-color
|
||||
color: $input-color
|
||||
+placeholder
|
||||
color: $input-placeholder-color
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
border-color: $input-hover-border-color
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
border-color: $input-focus-border-color
|
||||
box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
background-color: $input-disabled-background-color
|
||||
border-color: $input-disabled-border-color
|
||||
box-shadow: none
|
||||
color: $input-disabled-color
|
||||
+placeholder
|
||||
color: $input-disabled-placeholder-color
|
||||
|
||||
.input,
|
||||
.textarea
|
||||
+input
|
||||
box-shadow: $input-shadow
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
&[readonly]
|
||||
box-shadow: none
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
border-color: $color
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
|
||||
// Sizes
|
||||
&.is-small
|
||||
+control-small
|
||||
&.is-medium
|
||||
+control-medium
|
||||
&.is-large
|
||||
+control-large
|
||||
// Modifiers
|
||||
&.is-fullwidth
|
||||
display: block
|
||||
width: 100%
|
||||
&.is-inline
|
||||
display: inline
|
||||
width: auto
|
||||
|
||||
.input
|
||||
&.is-rounded
|
||||
border-radius: $radius-rounded
|
||||
padding-left: 1em
|
||||
padding-right: 1em
|
||||
&.is-static
|
||||
background-color: transparent
|
||||
border-color: transparent
|
||||
box-shadow: none
|
||||
padding-left: 0
|
||||
padding-right: 0
|
||||
|
||||
.textarea
|
||||
display: block
|
||||
max-width: 100%
|
||||
min-width: 100%
|
||||
padding: 0.625em
|
||||
resize: vertical
|
||||
&:not([rows])
|
||||
max-height: 600px
|
||||
min-height: 120px
|
||||
&[rows]
|
||||
height: initial
|
||||
// Modifiers
|
||||
&.has-fixed-size
|
||||
resize: none
|
||||
|
||||
.checkbox,
|
||||
.radio
|
||||
cursor: pointer
|
||||
display: inline-block
|
||||
line-height: 1.25
|
||||
position: relative
|
||||
input
|
||||
cursor: pointer
|
||||
&:hover
|
||||
color: $input-hover-color
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
color: $input-disabled-color
|
||||
cursor: not-allowed
|
||||
|
||||
.radio
|
||||
& + .radio
|
||||
margin-left: 0.5em
|
||||
|
||||
.select
|
||||
display: inline-block
|
||||
max-width: 100%
|
||||
position: relative
|
||||
vertical-align: top
|
||||
&:not(.is-multiple)
|
||||
height: $input-height
|
||||
&:not(.is-multiple):not(.is-loading)
|
||||
&::after
|
||||
@extend %arrow
|
||||
border-color: $input-arrow
|
||||
right: 1.125em
|
||||
z-index: 4
|
||||
&.is-rounded
|
||||
select
|
||||
border-radius: $radius-rounded
|
||||
padding-left: 1em
|
||||
select
|
||||
+input
|
||||
cursor: pointer
|
||||
display: block
|
||||
font-size: 1em
|
||||
max-width: 100%
|
||||
outline: none
|
||||
&::-ms-expand
|
||||
display: none
|
||||
&[disabled]:hover,
|
||||
fieldset[disabled] &:hover
|
||||
border-color: $input-disabled-border-color
|
||||
&:not([multiple])
|
||||
padding-right: 2.5em
|
||||
&[multiple]
|
||||
height: auto
|
||||
padding: 0
|
||||
option
|
||||
padding: 0.5em 1em
|
||||
// States
|
||||
&:not(.is-multiple):not(.is-loading):hover
|
||||
&::after
|
||||
border-color: $input-hover-color
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
&:not(:hover)::after
|
||||
border-color: $color
|
||||
select
|
||||
border-color: $color
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
border-color: darken($color, 5%)
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
|
||||
// Sizes
|
||||
&.is-small
|
||||
+control-small
|
||||
&.is-medium
|
||||
+control-medium
|
||||
&.is-large
|
||||
+control-large
|
||||
// Modifiers
|
||||
&.is-disabled
|
||||
&::after
|
||||
border-color: $input-disabled-color
|
||||
&.is-fullwidth
|
||||
width: 100%
|
||||
select
|
||||
width: 100%
|
||||
&.is-loading
|
||||
&::after
|
||||
@extend %loader
|
||||
margin-top: 0
|
||||
position: absolute
|
||||
right: 0.625em
|
||||
top: 0.625em
|
||||
transform: none
|
||||
&.is-small:after
|
||||
font-size: $size-small
|
||||
&.is-medium:after
|
||||
font-size: $size-medium
|
||||
&.is-large:after
|
||||
font-size: $size-large
|
||||
|
||||
.file
|
||||
@extend %unselectable
|
||||
align-items: stretch
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
position: relative
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
$color-invert: nth($pair, 2)
|
||||
&.is-#{$name}
|
||||
.file-cta
|
||||
background-color: $color
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
.file-cta
|
||||
background-color: darken($color, 2.5%)
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
&:focus,
|
||||
&.is-focused
|
||||
.file-cta
|
||||
border-color: transparent
|
||||
box-shadow: 0 0 0.5em rgba($color, 0.25)
|
||||
color: $color-invert
|
||||
&:active,
|
||||
&.is-active
|
||||
.file-cta
|
||||
background-color: darken($color, 5%)
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
// Sizes
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
.file-icon
|
||||
.fa
|
||||
font-size: 21px
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
.file-icon
|
||||
.fa
|
||||
font-size: 28px
|
||||
// Modifiers
|
||||
&.has-name
|
||||
.file-cta
|
||||
border-bottom-right-radius: 0
|
||||
border-top-right-radius: 0
|
||||
.file-name
|
||||
border-bottom-left-radius: 0
|
||||
border-top-left-radius: 0
|
||||
&.is-empty
|
||||
.file-cta
|
||||
border-radius: $file-radius
|
||||
.file-name
|
||||
display: none
|
||||
&.is-boxed
|
||||
.file-label
|
||||
flex-direction: column
|
||||
.file-cta
|
||||
flex-direction: column
|
||||
height: auto
|
||||
padding: 1em 3em
|
||||
.file-name
|
||||
border-width: 0 1px 1px
|
||||
.file-icon
|
||||
height: 1.5em
|
||||
width: 1.5em
|
||||
.fa
|
||||
font-size: 21px
|
||||
&.is-small
|
||||
.file-icon .fa
|
||||
font-size: 14px
|
||||
&.is-medium
|
||||
.file-icon .fa
|
||||
font-size: 28px
|
||||
&.is-large
|
||||
.file-icon .fa
|
||||
font-size: 35px
|
||||
&.has-name
|
||||
.file-cta
|
||||
border-radius: $file-radius $file-radius 0 0
|
||||
.file-name
|
||||
border-radius: 0 0 $file-radius $file-radius
|
||||
border-width: 0 1px 1px
|
||||
&.is-centered
|
||||
justify-content: center
|
||||
&.is-fullwidth
|
||||
.file-label
|
||||
width: 100%
|
||||
.file-name
|
||||
flex-grow: 1
|
||||
max-width: none
|
||||
&.is-right
|
||||
justify-content: flex-end
|
||||
.file-cta
|
||||
border-radius: 0 $file-radius $file-radius 0
|
||||
.file-name
|
||||
border-radius: $file-radius 0 0 $file-radius
|
||||
border-width: 1px 0 1px 1px
|
||||
order: -1
|
||||
|
||||
.file-label
|
||||
align-items: stretch
|
||||
display: flex
|
||||
cursor: pointer
|
||||
justify-content: flex-start
|
||||
overflow: hidden
|
||||
position: relative
|
||||
&:hover
|
||||
.file-cta
|
||||
background-color: darken($file-cta-background-color, 2.5%)
|
||||
color: $file-cta-hover-color
|
||||
.file-name
|
||||
border-color: darken($file-name-border-color, 2.5%)
|
||||
&:active
|
||||
.file-cta
|
||||
background-color: darken($file-cta-background-color, 5%)
|
||||
color: $file-cta-active-color
|
||||
.file-name
|
||||
border-color: darken($file-name-border-color, 5%)
|
||||
|
||||
.file-input
|
||||
height: 100%
|
||||
left: 0
|
||||
opacity: 0
|
||||
outline: none
|
||||
position: absolute
|
||||
top: 0
|
||||
width: 100%
|
||||
|
||||
.file-cta,
|
||||
.file-name
|
||||
@extend %control
|
||||
border-color: $file-border-color
|
||||
border-radius: $file-radius
|
||||
font-size: 1em
|
||||
padding-left: 1em
|
||||
padding-right: 1em
|
||||
white-space: nowrap
|
||||
|
||||
.file-cta
|
||||
background-color: $file-cta-background-color
|
||||
color: $file-cta-color
|
||||
|
||||
.file-name
|
||||
border-color: $file-name-border-color
|
||||
border-style: $file-name-border-style
|
||||
border-width: $file-name-border-width
|
||||
display: block
|
||||
max-width: $file-name-max-width
|
||||
overflow: hidden
|
||||
text-align: left
|
||||
text-overflow: ellipsis
|
||||
|
||||
.file-icon
|
||||
align-items: center
|
||||
display: flex
|
||||
height: 1em
|
||||
justify-content: center
|
||||
margin-right: 0.5em
|
||||
width: 1em
|
||||
.fa
|
||||
font-size: 14px
|
||||
|
||||
.label
|
||||
color: $label-color
|
||||
display: block
|
||||
font-size: $size-normal
|
||||
font-weight: $label-weight
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.5em
|
||||
// Sizes
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
|
||||
.help
|
||||
display: block
|
||||
font-size: $help-size
|
||||
margin-top: 0.25rem
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
color: $color
|
||||
|
||||
// Containers
|
||||
|
||||
.field
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
// Modifiers
|
||||
&.has-addons
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
.control
|
||||
&:not(:last-child)
|
||||
margin-right: -1px
|
||||
&:not(:first-child):not(:last-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-radius: 0
|
||||
&:first-child:not(:only-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-bottom-right-radius: 0
|
||||
border-top-right-radius: 0
|
||||
&:last-child:not(:only-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-bottom-left-radius: 0
|
||||
border-top-left-radius: 0
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
&:not([disabled])
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
z-index: 2
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
z-index: 3
|
||||
&:hover
|
||||
z-index: 4
|
||||
&.is-expanded
|
||||
flex-grow: 1
|
||||
&.has-addons-centered
|
||||
justify-content: center
|
||||
&.has-addons-right
|
||||
justify-content: flex-end
|
||||
&.has-addons-fullwidth
|
||||
.control
|
||||
flex-grow: 1
|
||||
flex-shrink: 0
|
||||
&.is-grouped
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
& > .control
|
||||
flex-shrink: 0
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0
|
||||
margin-right: 0.75rem
|
||||
&.is-expanded
|
||||
flex-grow: 1
|
||||
flex-shrink: 1
|
||||
&.is-grouped-centered
|
||||
justify-content: center
|
||||
&.is-grouped-right
|
||||
justify-content: flex-end
|
||||
&.is-grouped-multiline
|
||||
flex-wrap: wrap
|
||||
& > .control
|
||||
&:last-child,
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
&:last-child
|
||||
margin-bottom: -0.75rem
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0
|
||||
&.is-horizontal
|
||||
+tablet
|
||||
display: flex
|
||||
|
||||
.field-label
|
||||
.label
|
||||
font-size: inherit
|
||||
+mobile
|
||||
margin-bottom: 0.5rem
|
||||
+tablet
|
||||
flex-basis: 0
|
||||
flex-grow: 1
|
||||
flex-shrink: 0
|
||||
margin-right: 1.5rem
|
||||
text-align: right
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
padding-top: 0.375em
|
||||
&.is-normal
|
||||
padding-top: 0.375em
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
padding-top: 0.375em
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
padding-top: 0.375em
|
||||
|
||||
.field-body
|
||||
.field .field
|
||||
margin-bottom: 0
|
||||
+tablet
|
||||
display: flex
|
||||
flex-basis: 0
|
||||
flex-grow: 5
|
||||
flex-shrink: 1
|
||||
.field
|
||||
margin-bottom: 0
|
||||
& > .field
|
||||
flex-shrink: 1
|
||||
&:not(.is-narrow)
|
||||
flex-grow: 1
|
||||
&:not(:last-child)
|
||||
margin-right: 0.75rem
|
||||
|
||||
.control
|
||||
box-sizing: border-box
|
||||
clear: both //fixes the icon floating out of the input when help text is floated right
|
||||
font-size: $size-normal
|
||||
position: relative
|
||||
text-align: left
|
||||
// Modifiers
|
||||
&.has-icons-left,
|
||||
&.has-icons-right
|
||||
.input,
|
||||
.select
|
||||
&:focus
|
||||
& ~ .icon
|
||||
color: $input-icon-active-color
|
||||
&.is-small ~ .icon
|
||||
font-size: $size-small
|
||||
&.is-medium ~ .icon
|
||||
font-size: $size-medium
|
||||
&.is-large ~ .icon
|
||||
font-size: $size-large
|
||||
.icon
|
||||
color: $input-icon-color
|
||||
height: $input-height
|
||||
pointer-events: none
|
||||
position: absolute
|
||||
top: 0
|
||||
width: $input-height
|
||||
z-index: 4
|
||||
&.has-icons-left
|
||||
.input,
|
||||
.select select
|
||||
padding-left: $input-height
|
||||
.icon.is-left
|
||||
left: 0
|
||||
&.has-icons-right
|
||||
.input,
|
||||
.select select
|
||||
padding-right: $input-height
|
||||
.icon.is-right
|
||||
right: 0
|
||||
&.is-loading
|
||||
&::after
|
||||
@extend %loader
|
||||
position: absolute !important
|
||||
right: 0.625em
|
||||
top: 0.625em
|
||||
z-index: 4
|
||||
&.is-small:after
|
||||
font-size: $size-small
|
||||
&.is-medium:after
|
||||
font-size: $size-medium
|
||||
&.is-large:after
|
||||
font-size: $size-large
|
||||
@warn "The form.sass file is DEPRECATED. It has moved into its own /form folder. Please import sass/form/_all instead."
|
||||
|
||||
+15
-13
@@ -1,5 +1,6 @@
|
||||
$progress-bar-background-color: $border !default
|
||||
$progress-value-background-color: $text !default
|
||||
$progress-border-radius: $radius-rounded !default
|
||||
|
||||
$progress-indeterminate-duration: 1.5s !default
|
||||
|
||||
@@ -8,7 +9,7 @@ $progress-indeterminate-duration: 1.5s !default
|
||||
-moz-appearance: none
|
||||
-webkit-appearance: none
|
||||
border: none
|
||||
border-radius: $radius-rounded
|
||||
border-radius: $progress-border-radius
|
||||
display: block
|
||||
height: $size-normal
|
||||
overflow: hidden
|
||||
@@ -23,6 +24,19 @@ $progress-indeterminate-duration: 1.5s !default
|
||||
&::-ms-fill
|
||||
background-color: $progress-value-background-color
|
||||
border: none
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
&::-webkit-progress-value
|
||||
background-color: $color
|
||||
&::-moz-progress-bar
|
||||
background-color: $color
|
||||
&::-ms-fill
|
||||
background-color: $color
|
||||
&:indeterminate
|
||||
background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
|
||||
|
||||
&:indeterminate
|
||||
animation-duration: $progress-indeterminate-duration
|
||||
animation-iteration-count: infinite
|
||||
@@ -37,18 +51,6 @@ $progress-indeterminate-duration: 1.5s !default
|
||||
background-color: transparent
|
||||
&::-moz-progress-bar
|
||||
background-color: transparent
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
&::-webkit-progress-value
|
||||
background-color: $color
|
||||
&::-moz-progress-bar
|
||||
background-color: $color
|
||||
&::-ms-fill
|
||||
background-color: $color
|
||||
&:indeterminate
|
||||
background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
|
||||
|
||||
// Sizes
|
||||
&.is-small
|
||||
|
||||
+2
-1
@@ -53,7 +53,8 @@ $table-striped-row-even-hover-background-color: $white-ter !default
|
||||
color: currentColor
|
||||
th
|
||||
color: $table-cell-heading-color
|
||||
text-align: left
|
||||
&:not([align])
|
||||
text-align: left
|
||||
tr
|
||||
&.is-selected
|
||||
background-color: $table-row-active-background-color
|
||||
|
||||
-9
@@ -23,15 +23,6 @@ $tag-delete-margin: 1px !default
|
||||
&.are-large
|
||||
.tag:not(.is-normal):not(.is-medium)
|
||||
font-size: $size-medium
|
||||
&.has-addons
|
||||
.tag
|
||||
margin-right: 0
|
||||
&:not(:first-child)
|
||||
border-bottom-left-radius: 0
|
||||
border-top-left-radius: 0
|
||||
&:not(:last-child)
|
||||
border-bottom-right-radius: 0
|
||||
border-top-right-radius: 0
|
||||
&.is-centered
|
||||
justify-content: center
|
||||
.tag
|
||||
|
||||
+6
@@ -1,4 +1,5 @@
|
||||
$title-color: $grey-darker !default
|
||||
$title-family: false !default
|
||||
$title-size: $size-3 !default
|
||||
$title-weight: $weight-semibold !default
|
||||
$title-line-height: 1.125 !default
|
||||
@@ -8,6 +9,7 @@ $title-sub-size: 0.75em !default
|
||||
$title-sup-size: 0.75em !default
|
||||
|
||||
$subtitle-color: $grey-dark !default
|
||||
$subtitle-family: false !default
|
||||
$subtitle-size: $size-5 !default
|
||||
$subtitle-weight: $weight-normal !default
|
||||
$subtitle-line-height: 1.25 !default
|
||||
@@ -31,6 +33,8 @@ $subtitle-negative-margin: -1.25rem !default
|
||||
|
||||
.title
|
||||
color: $title-color
|
||||
@if $title-family
|
||||
font-family: $title-family
|
||||
font-size: $title-size
|
||||
font-weight: $title-weight
|
||||
line-height: $title-line-height
|
||||
@@ -49,6 +53,8 @@ $subtitle-negative-margin: -1.25rem !default
|
||||
|
||||
.subtitle
|
||||
color: $subtitle-color
|
||||
@if $subtitle-family
|
||||
font-family: $subtitle-family
|
||||
font-size: $subtitle-size
|
||||
font-weight: $subtitle-weight
|
||||
line-height: $subtitle-line-height
|
||||
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
@charset "utf-8"
|
||||
|
||||
@import "shared.sass"
|
||||
@import "input-textarea.sass"
|
||||
@import "checkbox-radio.sass"
|
||||
@import "select.sass"
|
||||
@import "file.sass"
|
||||
@import "tools.sass"
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
%checkbox-radio
|
||||
cursor: pointer
|
||||
display: inline-block
|
||||
line-height: 1.25
|
||||
position: relative
|
||||
input
|
||||
cursor: pointer
|
||||
&:hover
|
||||
color: $input-hover-color
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
color: $input-disabled-color
|
||||
cursor: not-allowed
|
||||
|
||||
.checkbox
|
||||
@extend %checkbox-radio
|
||||
|
||||
.radio
|
||||
@extend %checkbox-radio
|
||||
& + .radio
|
||||
margin-left: 0.5em
|
||||
+180
@@ -0,0 +1,180 @@
|
||||
$file-border-color: $border !default
|
||||
$file-radius: $radius !default
|
||||
|
||||
$file-cta-background-color: $white-ter !default
|
||||
$file-cta-color: $grey-dark !default
|
||||
$file-cta-hover-color: $grey-darker !default
|
||||
$file-cta-active-color: $grey-darker !default
|
||||
|
||||
$file-name-border-color: $border !default
|
||||
$file-name-border-style: solid !default
|
||||
$file-name-border-width: 1px 1px 1px 0 !default
|
||||
$file-name-max-width: 16em !default
|
||||
|
||||
.file
|
||||
@extend %unselectable
|
||||
align-items: stretch
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
position: relative
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
$color-invert: nth($pair, 2)
|
||||
&.is-#{$name}
|
||||
.file-cta
|
||||
background-color: $color
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
.file-cta
|
||||
background-color: darken($color, 2.5%)
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
&:focus,
|
||||
&.is-focused
|
||||
.file-cta
|
||||
border-color: transparent
|
||||
box-shadow: 0 0 0.5em rgba($color, 0.25)
|
||||
color: $color-invert
|
||||
&:active,
|
||||
&.is-active
|
||||
.file-cta
|
||||
background-color: darken($color, 5%)
|
||||
border-color: transparent
|
||||
color: $color-invert
|
||||
// Sizes
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
.file-icon
|
||||
.fa
|
||||
font-size: 21px
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
.file-icon
|
||||
.fa
|
||||
font-size: 28px
|
||||
// Modifiers
|
||||
&.has-name
|
||||
.file-cta
|
||||
border-bottom-right-radius: 0
|
||||
border-top-right-radius: 0
|
||||
.file-name
|
||||
border-bottom-left-radius: 0
|
||||
border-top-left-radius: 0
|
||||
&.is-empty
|
||||
.file-cta
|
||||
border-radius: $file-radius
|
||||
.file-name
|
||||
display: none
|
||||
&.is-boxed
|
||||
.file-label
|
||||
flex-direction: column
|
||||
.file-cta
|
||||
flex-direction: column
|
||||
height: auto
|
||||
padding: 1em 3em
|
||||
.file-name
|
||||
border-width: 0 1px 1px
|
||||
.file-icon
|
||||
height: 1.5em
|
||||
width: 1.5em
|
||||
.fa
|
||||
font-size: 21px
|
||||
&.is-small
|
||||
.file-icon .fa
|
||||
font-size: 14px
|
||||
&.is-medium
|
||||
.file-icon .fa
|
||||
font-size: 28px
|
||||
&.is-large
|
||||
.file-icon .fa
|
||||
font-size: 35px
|
||||
&.has-name
|
||||
.file-cta
|
||||
border-radius: $file-radius $file-radius 0 0
|
||||
.file-name
|
||||
border-radius: 0 0 $file-radius $file-radius
|
||||
border-width: 0 1px 1px
|
||||
&.is-centered
|
||||
justify-content: center
|
||||
&.is-fullwidth
|
||||
.file-label
|
||||
width: 100%
|
||||
.file-name
|
||||
flex-grow: 1
|
||||
max-width: none
|
||||
&.is-right
|
||||
justify-content: flex-end
|
||||
.file-cta
|
||||
border-radius: 0 $file-radius $file-radius 0
|
||||
.file-name
|
||||
border-radius: $file-radius 0 0 $file-radius
|
||||
border-width: 1px 0 1px 1px
|
||||
order: -1
|
||||
|
||||
.file-label
|
||||
align-items: stretch
|
||||
display: flex
|
||||
cursor: pointer
|
||||
justify-content: flex-start
|
||||
overflow: hidden
|
||||
position: relative
|
||||
&:hover
|
||||
.file-cta
|
||||
background-color: darken($file-cta-background-color, 2.5%)
|
||||
color: $file-cta-hover-color
|
||||
.file-name
|
||||
border-color: darken($file-name-border-color, 2.5%)
|
||||
&:active
|
||||
.file-cta
|
||||
background-color: darken($file-cta-background-color, 5%)
|
||||
color: $file-cta-active-color
|
||||
.file-name
|
||||
border-color: darken($file-name-border-color, 5%)
|
||||
|
||||
.file-input
|
||||
height: 100%
|
||||
left: 0
|
||||
opacity: 0
|
||||
outline: none
|
||||
position: absolute
|
||||
top: 0
|
||||
width: 100%
|
||||
|
||||
.file-cta,
|
||||
.file-name
|
||||
@extend %control
|
||||
border-color: $file-border-color
|
||||
border-radius: $file-radius
|
||||
font-size: 1em
|
||||
padding-left: 1em
|
||||
padding-right: 1em
|
||||
white-space: nowrap
|
||||
|
||||
.file-cta
|
||||
background-color: $file-cta-background-color
|
||||
color: $file-cta-color
|
||||
|
||||
.file-name
|
||||
border-color: $file-name-border-color
|
||||
border-style: $file-name-border-style
|
||||
border-width: $file-name-border-width
|
||||
display: block
|
||||
max-width: $file-name-max-width
|
||||
overflow: hidden
|
||||
text-align: left
|
||||
text-overflow: ellipsis
|
||||
|
||||
.file-icon
|
||||
align-items: center
|
||||
display: flex
|
||||
height: 1em
|
||||
justify-content: center
|
||||
margin-right: 0.5em
|
||||
width: 1em
|
||||
.fa
|
||||
font-size: 14px
|
||||
+60
@@ -0,0 +1,60 @@
|
||||
%input-textarea
|
||||
@extend %input
|
||||
box-shadow: $input-shadow
|
||||
max-width: 100%
|
||||
width: 100%
|
||||
&[readonly]
|
||||
box-shadow: none
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
border-color: $color
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
|
||||
// Sizes
|
||||
&.is-small
|
||||
+control-small
|
||||
&.is-medium
|
||||
+control-medium
|
||||
&.is-large
|
||||
+control-large
|
||||
// Modifiers
|
||||
&.is-fullwidth
|
||||
display: block
|
||||
width: 100%
|
||||
&.is-inline
|
||||
display: inline
|
||||
width: auto
|
||||
|
||||
.input
|
||||
@extend %input-textarea
|
||||
&.is-rounded
|
||||
border-radius: $radius-rounded
|
||||
padding-left: 1em
|
||||
padding-right: 1em
|
||||
&.is-static
|
||||
background-color: transparent
|
||||
border-color: transparent
|
||||
box-shadow: none
|
||||
padding-left: 0
|
||||
padding-right: 0
|
||||
|
||||
.textarea
|
||||
@extend %input-textarea
|
||||
display: block
|
||||
max-width: 100%
|
||||
min-width: 100%
|
||||
padding: 0.625em
|
||||
resize: vertical
|
||||
&:not([rows])
|
||||
max-height: 600px
|
||||
min-height: 120px
|
||||
&[rows]
|
||||
height: initial
|
||||
// Modifiers
|
||||
&.has-fixed-size
|
||||
resize: none
|
||||
+85
@@ -0,0 +1,85 @@
|
||||
.select
|
||||
display: inline-block
|
||||
max-width: 100%
|
||||
position: relative
|
||||
vertical-align: top
|
||||
&:not(.is-multiple)
|
||||
height: $input-height
|
||||
&:not(.is-multiple):not(.is-loading)
|
||||
&::after
|
||||
@extend %arrow
|
||||
border-color: $input-arrow
|
||||
right: 1.125em
|
||||
z-index: 4
|
||||
&.is-rounded
|
||||
select
|
||||
border-radius: $radius-rounded
|
||||
padding-left: 1em
|
||||
select
|
||||
@extend %input
|
||||
cursor: pointer
|
||||
display: block
|
||||
font-size: 1em
|
||||
max-width: 100%
|
||||
outline: none
|
||||
&::-ms-expand
|
||||
display: none
|
||||
&[disabled]:hover,
|
||||
fieldset[disabled] &:hover
|
||||
border-color: $input-disabled-border-color
|
||||
&:not([multiple])
|
||||
padding-right: 2.5em
|
||||
&[multiple]
|
||||
height: auto
|
||||
padding: 0
|
||||
option
|
||||
padding: 0.5em 1em
|
||||
// States
|
||||
&:not(.is-multiple):not(.is-loading):hover
|
||||
&::after
|
||||
border-color: $input-hover-color
|
||||
// Colors
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
&:not(:hover)::after
|
||||
border-color: $color
|
||||
select
|
||||
border-color: $color
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
border-color: darken($color, 5%)
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
box-shadow: $input-focus-box-shadow-size rgba($color, 0.25)
|
||||
// Sizes
|
||||
&.is-small
|
||||
+control-small
|
||||
&.is-medium
|
||||
+control-medium
|
||||
&.is-large
|
||||
+control-large
|
||||
// Modifiers
|
||||
&.is-disabled
|
||||
&::after
|
||||
border-color: $input-disabled-color
|
||||
&.is-fullwidth
|
||||
width: 100%
|
||||
select
|
||||
width: 100%
|
||||
&.is-loading
|
||||
&::after
|
||||
@extend %loader
|
||||
margin-top: 0
|
||||
position: absolute
|
||||
right: 0.625em
|
||||
top: 0.625em
|
||||
transform: none
|
||||
&.is-small:after
|
||||
font-size: $size-small
|
||||
&.is-medium:after
|
||||
font-size: $size-medium
|
||||
&.is-large:after
|
||||
font-size: $size-large
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
$input-color: $grey-darker !default
|
||||
$input-background-color: $white !default
|
||||
$input-border-color: $grey-lighter !default
|
||||
$input-height: $control-height !default
|
||||
$input-shadow: inset 0 1px 2px rgba($black, 0.1) !default
|
||||
$input-placeholder-color: rgba($input-color, 0.3) !default
|
||||
|
||||
$input-hover-color: $grey-darker !default
|
||||
$input-hover-border-color: $grey-light !default
|
||||
|
||||
$input-focus-color: $grey-darker !default
|
||||
$input-focus-border-color: $link !default
|
||||
$input-focus-box-shadow-size: 0 0 0 0.125em !default
|
||||
$input-focus-box-shadow-color: rgba($link, 0.25) !default
|
||||
|
||||
$input-disabled-color: $text-light !default
|
||||
$input-disabled-background-color: $background !default
|
||||
$input-disabled-border-color: $background !default
|
||||
$input-disabled-placeholder-color: rgba($input-disabled-color, 0.3) !default
|
||||
|
||||
$input-arrow: $link !default
|
||||
|
||||
$input-icon-color: $grey-lighter !default
|
||||
$input-icon-active-color: $grey !default
|
||||
|
||||
$input-radius: $radius !default
|
||||
|
||||
=input
|
||||
@extend %control
|
||||
background-color: $input-background-color
|
||||
border-color: $input-border-color
|
||||
border-radius: $input-radius
|
||||
color: $input-color
|
||||
+placeholder
|
||||
color: $input-placeholder-color
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
border-color: $input-hover-border-color
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
border-color: $input-focus-border-color
|
||||
box-shadow: $input-focus-box-shadow-size $input-focus-box-shadow-color
|
||||
&[disabled],
|
||||
fieldset[disabled] &
|
||||
background-color: $input-disabled-background-color
|
||||
border-color: $input-disabled-border-color
|
||||
box-shadow: none
|
||||
color: $input-disabled-color
|
||||
+placeholder
|
||||
color: $input-disabled-placeholder-color
|
||||
|
||||
%input
|
||||
+input
|
||||
+205
@@ -0,0 +1,205 @@
|
||||
$label-color: $grey-darker !default
|
||||
$label-weight: $weight-bold !default
|
||||
|
||||
$help-size: $size-small !default
|
||||
|
||||
.label
|
||||
color: $label-color
|
||||
display: block
|
||||
font-size: $size-normal
|
||||
font-weight: $label-weight
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.5em
|
||||
// Sizes
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
|
||||
.help
|
||||
display: block
|
||||
font-size: $help-size
|
||||
margin-top: 0.25rem
|
||||
@each $name, $pair in $colors
|
||||
$color: nth($pair, 1)
|
||||
&.is-#{$name}
|
||||
color: $color
|
||||
|
||||
// Containers
|
||||
|
||||
.field
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
// Modifiers
|
||||
&.has-addons
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
.control
|
||||
&:not(:last-child)
|
||||
margin-right: -1px
|
||||
&:not(:first-child):not(:last-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-radius: 0
|
||||
&:first-child:not(:only-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-bottom-right-radius: 0
|
||||
border-top-right-radius: 0
|
||||
&:last-child:not(:only-child)
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
border-bottom-left-radius: 0
|
||||
border-top-left-radius: 0
|
||||
.button,
|
||||
.input,
|
||||
.select select
|
||||
&:not([disabled])
|
||||
&:hover,
|
||||
&.is-hovered
|
||||
z-index: 2
|
||||
&:focus,
|
||||
&.is-focused,
|
||||
&:active,
|
||||
&.is-active
|
||||
z-index: 3
|
||||
&:hover
|
||||
z-index: 4
|
||||
&.is-expanded
|
||||
flex-grow: 1
|
||||
flex-shrink: 1
|
||||
&.has-addons-centered
|
||||
justify-content: center
|
||||
&.has-addons-right
|
||||
justify-content: flex-end
|
||||
&.has-addons-fullwidth
|
||||
.control
|
||||
flex-grow: 1
|
||||
flex-shrink: 0
|
||||
&.is-grouped
|
||||
display: flex
|
||||
justify-content: flex-start
|
||||
& > .control
|
||||
flex-shrink: 0
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0
|
||||
margin-right: 0.75rem
|
||||
&.is-expanded
|
||||
flex-grow: 1
|
||||
flex-shrink: 1
|
||||
&.is-grouped-centered
|
||||
justify-content: center
|
||||
&.is-grouped-right
|
||||
justify-content: flex-end
|
||||
&.is-grouped-multiline
|
||||
flex-wrap: wrap
|
||||
& > .control
|
||||
&:last-child,
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
&:last-child
|
||||
margin-bottom: -0.75rem
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0
|
||||
&.is-horizontal
|
||||
+tablet
|
||||
display: flex
|
||||
|
||||
.field-label
|
||||
.label
|
||||
font-size: inherit
|
||||
+mobile
|
||||
margin-bottom: 0.5rem
|
||||
+tablet
|
||||
flex-basis: 0
|
||||
flex-grow: 1
|
||||
flex-shrink: 0
|
||||
margin-right: 1.5rem
|
||||
text-align: right
|
||||
&.is-small
|
||||
font-size: $size-small
|
||||
padding-top: 0.375em
|
||||
&.is-normal
|
||||
padding-top: 0.375em
|
||||
&.is-medium
|
||||
font-size: $size-medium
|
||||
padding-top: 0.375em
|
||||
&.is-large
|
||||
font-size: $size-large
|
||||
padding-top: 0.375em
|
||||
|
||||
.field-body
|
||||
.field .field
|
||||
margin-bottom: 0
|
||||
+tablet
|
||||
display: flex
|
||||
flex-basis: 0
|
||||
flex-grow: 5
|
||||
flex-shrink: 1
|
||||
.field
|
||||
margin-bottom: 0
|
||||
& > .field
|
||||
flex-shrink: 1
|
||||
&:not(.is-narrow)
|
||||
flex-grow: 1
|
||||
&:not(:last-child)
|
||||
margin-right: 0.75rem
|
||||
|
||||
.control
|
||||
box-sizing: border-box
|
||||
clear: both
|
||||
font-size: $size-normal
|
||||
position: relative
|
||||
text-align: left
|
||||
// Modifiers
|
||||
&.has-icons-left,
|
||||
&.has-icons-right
|
||||
.input,
|
||||
.select
|
||||
&:focus
|
||||
& ~ .icon
|
||||
color: $input-icon-active-color
|
||||
&.is-small ~ .icon
|
||||
font-size: $size-small
|
||||
&.is-medium ~ .icon
|
||||
font-size: $size-medium
|
||||
&.is-large ~ .icon
|
||||
font-size: $size-large
|
||||
.icon
|
||||
color: $input-icon-color
|
||||
height: $input-height
|
||||
pointer-events: none
|
||||
position: absolute
|
||||
top: 0
|
||||
width: $input-height
|
||||
z-index: 4
|
||||
&.has-icons-left
|
||||
.input,
|
||||
.select select
|
||||
padding-left: $input-height
|
||||
.icon.is-left
|
||||
left: 0
|
||||
&.has-icons-right
|
||||
.input,
|
||||
.select select
|
||||
padding-right: $input-height
|
||||
.icon.is-right
|
||||
right: 0
|
||||
&.is-loading
|
||||
&::after
|
||||
@extend %loader
|
||||
position: absolute !important
|
||||
right: 0.625em
|
||||
top: 0.625em
|
||||
z-index: 4
|
||||
&.is-small:after
|
||||
font-size: $size-small
|
||||
&.is-medium:after
|
||||
font-size: $size-medium
|
||||
&.is-large:after
|
||||
font-size: $size-large
|
||||
+7
-7
@@ -56,7 +56,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
.columns.is-mobile > &.is-offset-four-fifths
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
.columns.is-mobile > &.is-#{$i}
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
@@ -113,7 +113,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
&.is-offset-four-fifths-mobile
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i}-mobile
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
@@ -190,7 +190,7 @@ $column-gap: 0.75rem !default
|
||||
&.is-offset-four-fifths,
|
||||
&.is-offset-four-fifths-tablet
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i},
|
||||
&.is-#{$i}-tablet
|
||||
flex: none
|
||||
@@ -249,7 +249,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
&.is-offset-four-fifths-touch
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i}-touch
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
@@ -306,7 +306,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
&.is-offset-four-fifths-desktop
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i}-desktop
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
@@ -363,7 +363,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
&.is-offset-four-fifths-widescreen
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i}-widescreen
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
@@ -420,7 +420,7 @@ $column-gap: 0.75rem !default
|
||||
margin-left: 60%
|
||||
&.is-offset-four-fifths-fullhd
|
||||
margin-left: 80%
|
||||
@for $i from 1 through 12
|
||||
@for $i from 0 through 12
|
||||
&.is-#{$i}-fullhd
|
||||
flex: none
|
||||
width: percentage($i / 12)
|
||||
|
||||
+8
-6
@@ -1,3 +1,5 @@
|
||||
$tile-spacing: 0.75rem !default
|
||||
|
||||
.tile
|
||||
align-items: stretch
|
||||
display: block
|
||||
@@ -7,17 +9,17 @@
|
||||
min-height: min-content
|
||||
// Modifiers
|
||||
&.is-ancestor
|
||||
margin-left: -0.75rem
|
||||
margin-right: -0.75rem
|
||||
margin-top: -0.75rem
|
||||
margin-left: $tile-spacing * -1
|
||||
margin-right: $tile-spacing * -1
|
||||
margin-top: $tile-spacing * -1
|
||||
&:last-child
|
||||
margin-bottom: -0.75rem
|
||||
margin-bottom: $tile-spacing * -1
|
||||
&:not(:last-child)
|
||||
margin-bottom: 0.75rem
|
||||
margin-bottom: $tile-spacing
|
||||
&.is-child
|
||||
margin: 0 !important
|
||||
&.is-parent
|
||||
padding: 0.75rem
|
||||
padding: $tile-spacing
|
||||
&.is-vertical
|
||||
flex-direction: column
|
||||
& > .tile.is-child:not(:last-child)
|
||||
|
||||
+3
@@ -1,6 +1,9 @@
|
||||
$footer-background-color: $white-bis !default
|
||||
$footer-color: false !default
|
||||
$footer-padding: 3rem 1.5rem 6rem !default
|
||||
|
||||
.footer
|
||||
background-color: $footer-background-color
|
||||
padding: $footer-padding
|
||||
@if $footer-color
|
||||
color: $footer-color
|
||||
|
||||
+1
-14
@@ -17,7 +17,7 @@
|
||||
&.is-#{$name}
|
||||
background-color: $color
|
||||
color: $color-invert
|
||||
a:not(.button):not(.dropdown-item):not(.tag),
|
||||
a:not(.button):not(.dropdown-item):not(.tag):not(.pagination-link.is-current),
|
||||
strong
|
||||
color: inherit
|
||||
.title
|
||||
@@ -68,19 +68,6 @@
|
||||
+mobile
|
||||
.navbar-menu
|
||||
background-image: linear-gradient(141deg, $gradient-top-left 0%, $color 71%, $gradient-bottom-right 100%)
|
||||
// Responsiveness
|
||||
// +mobile
|
||||
// .nav-toggle
|
||||
// span
|
||||
// background-color: $color-invert
|
||||
// &:hover
|
||||
// background-color: rgba($black, 0.1)
|
||||
// &.is-active
|
||||
// span
|
||||
// background-color: $color-invert
|
||||
// .nav-menu
|
||||
// .nav-item
|
||||
// border-top-color: rgba($color-invert, 0.2)
|
||||
// Sizes
|
||||
&.is-small
|
||||
.hero-body
|
||||
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
|
||||
/*# sourceMappingURL=initial-variables.css.map */
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"version": 3,
|
||||
"file": "initial-variables.css",
|
||||
"sources": [
|
||||
"initial-variables.sass"
|
||||
],
|
||||
"mappings": "",
|
||||
"names": []
|
||||
}
|
||||
+5
-1
@@ -43,10 +43,14 @@ $weight-medium: 500 !default
|
||||
$weight-semibold: 600 !default
|
||||
$weight-bold: 700 !default
|
||||
|
||||
// Spacing
|
||||
|
||||
$block-spacing: 1.5rem !default
|
||||
|
||||
// Responsiveness
|
||||
|
||||
// The container horizontal gap, which acts as the offset for breakpoints
|
||||
$gap: 64px !default
|
||||
$gap: 32px !default
|
||||
// 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16
|
||||
$tablet: 769px !default
|
||||
// 960px container + 4rem
|
||||
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
|
||||
/*# sourceMappingURL=mixins.css.map */
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"version": 3,
|
||||
"file": "mixins.css",
|
||||
"sources": [
|
||||
"mixins.sass",
|
||||
"initial-variables.sass"
|
||||
],
|
||||
"mappings": "",
|
||||
"names": []
|
||||
}
|
||||
+2
-2
@@ -159,9 +159,9 @@
|
||||
%arrow
|
||||
+arrow
|
||||
|
||||
=block
|
||||
=block($spacing: $block-spacing)
|
||||
&:not(:last-child)
|
||||
margin-bottom: 1.5rem
|
||||
margin-bottom: $spacing
|
||||
|
||||
%block
|
||||
+block
|
||||
|
||||
Reference in New Issue
Block a user