Ark/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma synced 2026-03-18 11:24:29 -07:00
Code Issues Packages Projects Releases Wiki Activity

Add block documentation

Browse Source
This commit is contained in:
Jeremy Thomas
2020-09-17 00:30:49 +01:00
parent 98090feaf8
commit 9e0c9a35db
27 changed files with 597 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/_data/icons.json
View File

@@ -1,6 +1,6 @@
{
"fontawesome4": "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css",
"fontawesome5": "https://use.fontawesome.com/releases/v5.3.1/js/all.js",
"fontawesome5": "https://use.fontawesome.com/releases/v5.14.0/js/all.js",
"ionicons": "https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css",
"mdi": "https://cdn.materialdesignicons.com/2.1.19/css/materialdesignicons.min.css"
}

9
docs/_data/links.json
View File

@@ -372,6 +372,13 @@
"icon": "cube",
"path": "/documentation/elements"
},
"elements-block": {
"name": "Block",
"subtitle": "Bulma's most basic spacer <strong>block</strong>",
"color": "grey",
"icon": "arrows-alt-v",
"path": "/documentation/elements/block"
},
"elements-box": {
"name": "Box",
"subtitle": "A white <strong>box</strong> to contain other elements",
@@ -633,7 +640,7 @@
"columns": ["columns-basics", "columns-sizes", "columns-responsiveness", "columns-nesting", "columns-gap", "columns-options"],
"layout": ["layout-container", "layout-level", "layout-media", "layout-hero", "layout-section", "layout-footer", "layout-tiles"],
"form": ["form-general", "form-input", "form-textarea", "form-select", "form-checkbox", "form-radio", "form-file"],
"elements": ["elements-box", "elements-button", "elements-content", "elements-delete", "elements-icon", "elements-image", "elements-notification", "elements-progress", "elements-table", "elements-tag", "elements-title"],
"elements": ["elements-block", "elements-box", "elements-button", "elements-content", "elements-delete", "elements-icon", "elements-image", "elements-notification", "elements-progress", "elements-table", "elements-tag", "elements-title"],
"components": ["components-breadcrumb", "components-card", "components-dropdown", "components-menu", "components-message", "components-modal", "components-navbar", "components-pagination", "components-panel", "components-tabs"]
}
}

9
docs/_data/sponsors.json
View File

@@ -253,6 +253,14 @@
"title": "vpn for netflix",
"width":"137",
"height":"85"
},
"dfds": {
"name": "dfds",
"url": "https://www.dietfooddeliveryservice.com/",
"title": "vpn for netflix",
"width":"60",
"height":"60",
"follow": true
}
},
"home": [
@@ -280,6 +288,7 @@
,"edusson"
,"inkoop"
,"vpnreview"
,"dfds"
],
"footer": [
"polygon"

5
docs/_data/variables/components/card.json
View File

@@ -22,7 +22,7 @@
"$card-radius": {
"name": "$card-radius",
"value": "0",
"type": "size"
"type": "string"
},
"$card-header-background-color": {
"name": "$card-header-background-color",
@@ -90,6 +90,7 @@
"$card-color",
"$card-background-color",
"$card-shadow",
"$card-radius",
"$card-header-background-color",
"$card-header-color",
"$card-header-padding",
@@ -103,4 +104,4 @@
"$card-media-margin"
],
"file_path": "components/card.sass"
}
}

10
docs/_data/variables/components/modal.json
View File

@@ -116,6 +116,13 @@
"name": "$modal-card-body-padding",
"value": "20px",
"type": "size"
},
"$modal-breakpoint": {
"name": "$modal-breakpoint",
"value": "$tablet",
"type": "variable",
"computed_type": "size",
"computed_value": "769px"
}
},
"list": [
@@ -139,7 +146,8 @@
"$modal-card-foot-radius",
"$modal-card-foot-border-top",
"$modal-card-body-background-color",
"$modal-card-body-padding"
"$modal-card-body-padding",
"$modal-breakpoint"
],
"file_path": "components/modal.sass"
}

10
docs/_data/variables/components/navbar.json
View File

@@ -227,6 +227,13 @@
"type": "variable",
"computed_type": "computed",
"computed_value": "960px + (2 * $gap)"
},
"$navbar-colors": {
"name": "$navbar-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
@@ -267,7 +274,8 @@
"$navbar-divider-background-color",
"$navbar-divider-height",
"$navbar-bottom-box-shadow-size",
"$navbar-breakpoint"
"$navbar-breakpoint",
"$navbar-colors"
],
"file_path": "components/navbar.sass"
}

10
docs/_data/variables/elements/button.json
View File

@@ -163,6 +163,13 @@
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 86%)"
},
"$button-colors": {
"name": "$button-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
@@ -191,7 +198,8 @@
"$button-disabled-opacity",
"$button-static-color",
"$button-static-background-color",
"$button-static-border-color"
"$button-static-border-color",
"$button-colors"
],
"file_path": "elements/button.sass"
}

22
docs/_data/variables/elements/notification.json
View File

@@ -25,13 +25,33 @@
"name": "$notification-padding",
"value": "1.25rem 2.5rem 1.25rem 1.5rem",
"type": "size"
},
"$notification-padding-ltr": {
"name": "$notification-padding-ltr",
"value": "1.25rem 2.5rem 1.25rem 1.5rem",
"type": "size"
},
"$notification-padding-rtl": {
"name": "$notification-padding-rtl",
"value": "1.25rem 1.5rem 1.25rem 2.5rem",
"type": "size"
},
"$notification-colors": {
"name": "$notification-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
"$notification-background-color",
"$notification-code-background-color",
"$notification-radius",
"$notification-padding"
"$notification-padding",
"$notification-padding-ltr",
"$notification-padding-rtl",
"$notification-colors"
],
"file_path": "elements/notification.sass"
}

10
docs/_data/variables/elements/progress.json
View File

@@ -25,13 +25,21 @@
"name": "$progress-indeterminate-duration",
"value": "1.5s",
"type": "string"
},
"$progress-colors": {
"name": "$progress-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
"$progress-bar-background-color",
"$progress-value-background-color",
"$progress-border-radius",
"$progress-indeterminate-duration"
"$progress-indeterminate-duration",
"$progress-colors"
],
"file_path": "elements/progress.sass"
}

10
docs/_data/variables/elements/table.json
View File

@@ -109,6 +109,13 @@
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(0, 0%, 96%)"
},
"$table-colors": {
"name": "$table-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
@@ -129,7 +136,8 @@
"$table-row-active-background-color",
"$table-row-active-color",
"$table-striped-row-even-background-color",
"$table-striped-row-even-hover-background-color"
"$table-striped-row-even-hover-background-color",
"$table-colors"
],
"file_path": "elements/table.sass"
}

10
docs/_data/variables/elements/tag.json
View File

@@ -25,13 +25,21 @@
"name": "$tag-delete-margin",
"value": "1px",
"type": "size"
},
"$tag-colors": {
"name": "$tag-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
"$tag-background-color",
"$tag-color",
"$tag-radius",
"$tag-delete-margin"
"$tag-delete-margin",
"$tag-colors"
],
"file_path": "elements/tag.sass"
}

8
docs/_data/variables/form/file.json
View File

@@ -63,6 +63,11 @@
"name": "$file-name-max-width",
"value": "16em",
"type": "size"
},
"$file-colors": {
"name": "$file-colors",
"value": "$form-colors",
"type": "variable"
}
},
"list": [
@@ -75,7 +80,8 @@
"$file-name-border-color",
"$file-name-border-style",
"$file-name-border-width",
"$file-name-max-width"
"$file-name-max-width",
"$file-colors"
],
"file_path": "form/file.sass"
}

8
docs/_data/variables/form/input-textarea.json
View File

@@ -14,12 +14,18 @@
"name": "$textarea-min-height",
"value": "8em",
"type": "size"
},
"$textarea-colors": {
"name": "$textarea-colors",
"value": "$form-colors",
"type": "variable"
}
},
"list": [
"$textarea-padding",
"$textarea-max-height",
"$textarea-min-height"
"$textarea-min-height",
"$textarea-colors"
],
"file_path": "form/input-textarea.sass"
}

13
docs/_data/variables/form/select.json Normal file
View File

@@ -0,0 +1,13 @@
{
"by_name": {
"$select-colors": {
"name": "$select-colors",
"value": "$form-colors",
"type": "variable"
}
},
"list": [
"$select-colors"
],
"file_path": "form/select.sass"
}

8
docs/_data/variables/form/shared.json
View File

@@ -1,5 +1,12 @@
{
"by_name": {
"$form-colors": {
"name": "$form-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
},
"$input-color": {
"name": "$input-color",
"value": "$text-strong",
@@ -130,6 +137,7 @@
}
},
"list": [
"$form-colors",
"$input-color",
"$input-background-color",
"$input-border-color",

8
docs/_data/variables/form/tools.json
View File

@@ -20,12 +20,18 @@
"type": "variable",
"computed_type": "size",
"computed_value": "0.75rem"
},
"$label-colors": {
"name": "$label-colors",
"value": "$form-colors",
"type": "variable"
}
},
"list": [
"$label-color",
"$label-weight",
"$help-size"
"$help-size",
"$label-colors"
],
"file_path": "form/tools.sass"
}

37
docs/_data/variables/helpers/spacing.json Normal file
View File

@@ -0,0 +1,37 @@
{
"by_name": {
"$spacing-shortcuts": {
"name": "$spacing-shortcuts",
"value": "(\"margin\": \"m\", \"padding\": \"p\")",
"type": "string"
},
"$spacing-directions": {
"name": "$spacing-directions",
"value": "(\"top\": \"t\", \"right\": \"r\", \"bottom\": \"b\", \"left\": \"l\")",
"type": "string"
},
"$spacing-horizontal": {
"name": "$spacing-horizontal",
"value": "\"x\"",
"type": "string"
},
"$spacing-vertical": {
"name": "$spacing-vertical",
"value": "\"y\"",
"type": "string"
},
"$spacing-values": {
"name": "$spacing-values",
"value": "(\"0\": 0, \"1\": 0.25rem, \"2\": 0.5rem, \"3\": 0.75rem, \"4\": 1rem, \"5\": 1.5rem, \"6\": 3rem)",
"type": "string"
}
},
"list": [
"$spacing-shortcuts",
"$spacing-directions",
"$spacing-horizontal",
"$spacing-vertical",
"$spacing-values"
],
"file_path": "helpers/spacing.sass"
}

10
docs/_data/variables/layout/hero.json
View File

@@ -19,13 +19,21 @@
"name": "$hero-body-padding-large",
"value": "18rem 1.5rem",
"type": "size"
},
"$hero-colors": {
"name": "$hero-colors",
"value": "$colors",
"type": "variable",
"computed_type": "function",
"computed_value": "mergeColorMaps((\"white\": ($white, $black), \"black\": ($black, $white), \"light\": ($light, $light-invert), \"dark\": ($dark, $dark-invert), \"primary\": ($primary, $primary-invert, $primary-light, $primary-dark), \"link\": ($link, $link-invert, $link-light, $link-dark), \"info\": ($info, $info-invert, $info-light, $info-dark), \"success\": ($success, $success-invert, $success-light, $success-dark), \"warning\": ($warning, $warning-invert, $warning-light, $warning-dark), \"danger\": ($danger, $danger-invert, $danger-light, $danger-dark)), $custom-colors)"
}
},
"list": [
"$hero-body-padding",
"$hero-body-padding-small",
"$hero-body-padding-medium",
"$hero-body-padding-large"
"$hero-body-padding-large",
"$hero-colors"
],
"file_path": "layout/hero.sass"
}

6
docs/_data/variables/utilities/derived-variables.json
View File

@@ -311,10 +311,8 @@
},
"$code": {
"name": "$code",
"value": "$red",
"type": "variable",
"computed_type": "color",
"computed_value": "hsl(348, 86%, 61%)"
"value": "darken($red, 15%)",
"type": "compound"
},
"$code-background": {
"name": "$code-background",

8
docs/_data/variables/utilities/initial-variables.json
View File

@@ -249,6 +249,11 @@
"name": "$variable-columns",
"value": "true",
"type": "boolean"
},
"$rtl": {
"name": "$rtl",
"value": "false",
"type": "boolean"
}
},
"list": [
@@ -301,7 +306,8 @@
"$radius-large",
"$radius-rounded",
"$speed",
"$variable-columns"
"$variable-columns",
"$rtl"
],
"file_path": "utilities/initial-variables.sass"
}