library-mirrors/bulma
1
0
Fork 0
mirror of https://github.com/jgthms/bulma.git synced 2024-11-14 11:14:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add more icons

Browse Source
This commit is contained in:
Jeremy Thomas 2018-04-11 09:41:32 +01:00
parent 0c4bd24d5b
commit 93f2e047e8
3 changed files with 72 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
docs/_data/links.json
View File

@ -19,78 +19,107 @@
"overview-start": {
"name": "Getting started",
"subtitle": "You only need <strong>1 CSS file</strong> to use Bulma",
"color": "danger",
"icon": "rocket",
"path": "/documentation/overview/start"
},
"overview-customize": {
"name": "Customize",
"subtitle": "Create your <strong>own theme</strong> with a simple set of <strong>variables</strong>",
"color": "star",
"icon": "paint-brush",
"path": "/documentation/overview/customize"
},
"overview-classes": {
"name": "CSS Classes",
"subtitle": "Bulma is simply a <strong>collection</strong> of CSS classes. Write the HTML code you want.",
"color": "link",
"icon_brand": "true",
"icon": "css3",
"path": "/documentation/overview/classes"
},
"overview-modular": {
"name": "Modularity",
"subtitle": "Just import what you <strong>need</strong>",
"color": "success",
"icon": "cubes",
"path": "/documentation/overview/modular"
},
"overview-responsiveness": {
"name": "Responsiveness",
"subtitle": "Bulma is a <strong>mobile-first</strong> framework",
"color": "primary",
"icon": "arrows-alt-h",
"path": "/documentation/overview/responsiveness"
},
"overview-variables": {
"name": "Variables",
"subtitle": "Easily <strong>customize</strong> Bulma to match your design",
"subtitle": "See how Bulma uses <strong>Sass variables</strong> to allows easy customization",
"color": "grey",
"icon": "cogs",
"path": "/documentation/overview/variables"
},
"overview-colors": {
"name": "Colors",
"subtitle": "The <strong>colors</strong> that <strong>style</strong> most Bulma elements and components",
"color": "info",
"icon": "tint",
"path": "/documentation/overview/colors"
},
"overview-functions": {
"name": "Functions",
"subtitle": "Utility functions to calculate colors and other values",
"color": "orange",
"icon": "code",
"path": "/documentation/overview/functions"
},
"overview-mixins": {
"name": "Mixins",
"subtitle": "Utility mixins for custom elements and responsive helpers",
"color": "purple",
"icon": "plus",
"path": "/documentation/overview/mixins"
},
"modifiers": {
"name": "Modifiers",
"subtitle": "An <strong>easy-to-read</strong> naming system designed for humans",
"color": "info",
"color": "grey",
"icon": "cogs",
"path": "/documentation/modifiers"
},
"modifiers-syntax": {
"name": "Syntax",
"subtitle": "Most Bulma elements have <strong>alternative</strong> styles. To apply them, you only need to append one of the <strong>modifier classes</strong>. They all start with <code>is-</code> or <code>has-</code>.",
"color": "orange",
"icon": "code",
"path": "/documentation/modifiers/syntax"
},
"modifiers-helpers": {
"name": "Helpers",
"subtitle": "Apply <strong>helper classes</strong> to almost any element, in order to alter its style",
"color": "danger",
"icon": "medkit",
"path": "/documentation/modifiers/helpers"
},
"modifiers-responsive-helpers": {
"name": "Responsive helpers",
"subtitle": "<strong>Show/hide content</strong> depending on the width of the viewport",
"color": "primary",
"icon": "arrows-alt-h",
"path": "/documentation/modifiers/responsive-helpers"
},
"modifiers-color-helpers": {
"name": "Color helpers",
"subtitle": "Change the <strong>color</strong> of the text and/or background",
"color": "info",
"icon": "tint",
"path": "/documentation/modifiers/color-helpers"
},
"modifiers-typography-helpers": {
"name": "Typography helpers",
"subtitle": "Change the <strong>size</strong> and <strong>color</strong> of the text for one or multiple viewport width",
"color": "grey-dark",
"icon": "font",
"path": "/documentation/modifiers/typography-helpers"
},
"columns": {
@ -103,33 +132,45 @@
"columns-basics": {
"name": "Basics",
"subtitle": "A simple way to build <strong>responsive columns</strong>",
"color": "star",
"icon": "columns",
"path": "/documentation/columns/basics"
},
"columns-gap": {
"name": "Gap",
"subtitle": Customize the <strong>gap</strong> between the columns,
"path": "/documentation/columns/gap"
},
"columns-nesting": {
"name": "Nesting",
"subtitle": "A simple way to build <strong>responsive columns</strong>",
"path": "/documentation/columns/nesting"
},
"columns-options": {
"name": "Options",
"subtitle": "Design different <strong>types</strong> of column layouts",
"path": "/documentation/columns/options"
},
"columns-responsiveness": {
"name": "Responsiveness",
"subtitle": "Handle <strong>different</strong> column layouts for each <strong>breakpoint</strong>",
"path": "/documentation/columns/responsiveness"
},
"columns-sizes": {
"name": "Sizes",
"subtitle": "Define the <strong>size</strong> of each column <strong>individually</strong>",
"color": "success",
"icon": "expand-arrows-alt",
"path": "/documentation/columns/sizes"
},
"columns-responsiveness": {
"name": "Responsiveness",
"subtitle": "Handle <strong>different</strong> column layouts for each <strong>breakpoint</strong>",
"color": "primary",
"icon": "arrows-alt-h",
"path": "/documentation/columns/responsiveness"
},
"columns-nesting": {
"name": "Nesting",
"subtitle": "A simple way to build <strong>responsive columns</strong>",
"color": "danger",
"icon": "sitemap",
"path": "/documentation/columns/nesting"
},
"columns-gap": {
"name": "Gap",
"subtitle": "Customize the <strong>gap</strong> between the columns",
"color": "info",
"icon": "pause",
"path": "/documentation/columns/gap"
},
"columns-options": {
"name": "Options",
"subtitle": "Design different <strong>types</strong> of column layouts",
"color": "grey",
"icon": "cogs",
"path": "/documentation/columns/options"
},
"layout": {
"name": "Layout",
"subtitle": "Design the <strong>structure</strong> of your webpage with these CSS classes",
@ -277,7 +318,7 @@
"elements-image": {
"name": "Image",
"subtitle": "A container for <strong>responsive images</strong>",
"color": "bootstrap",
"color": "purple",
"icon": "image",
"path": "/documentation/elements/image"
},
@ -440,7 +481,7 @@
"extensions"
],
"categories": {
"overview": ["overview-start", "overview-classes", "overview-modular", "overview-responsiveness", "overview-variables", "overview-colors", "overview-functions", "overview-mixins"],
"overview": ["overview-start", "overview-customize", "overview-classes", "overview-modular", "overview-responsiveness", "overview-variables", "overview-colors", "overview-functions", "overview-mixins"],
"modifiers": ["modifiers-syntax", "modifiers-helpers", "modifiers-responsive-helpers", "modifiers-color-helpers", "modifiers-typography-helpers"],
"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"],

3
docs/_sass/specific.sass
View File

@ -184,6 +184,9 @@
.has-text-orange
color: $orange !important
.has-text-purple
color: $purple !important
.has-text-bootstrap
color: $bootstrap !important

4
docs/css/bulma-docs.css
View File

@ -11229,6 +11229,10 @@ svg {
color: #ff470f !important;
}
.has-text-purple {
color: #b86bff !important;
}
.has-text-bootstrap {
color: #6f5499 !important;
}