From: Jeremy Thomas Date: Wed, 11 Apr 2018 08:41:32 +0000 (+0100) Subject: Add more icons X-Git-Tag: 0.7.0~1^2~21 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=93f2e047e8b48ac5fcc0fd81b8a6aaf16626aade;p=thirdparty%2Fbulma.git Add more icons --- diff --git a/docs/_data/links.json b/docs/_data/links.json index 0a7c12bfb..1efa1bbd1 100644 --- a/docs/_data/links.json +++ b/docs/_data/links.json @@ -19,78 +19,107 @@ "overview-start": { "name": "Getting started", "subtitle": "You only need 1 CSS file to use Bulma", + "color": "danger", + "icon": "rocket", "path": "/documentation/overview/start" }, "overview-customize": { "name": "Customize", "subtitle": "Create your own theme with a simple set of variables", + "color": "star", + "icon": "paint-brush", "path": "/documentation/overview/customize" }, "overview-classes": { "name": "CSS Classes", "subtitle": "Bulma is simply a collection 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 need", + "color": "success", + "icon": "cubes", "path": "/documentation/overview/modular" }, "overview-responsiveness": { "name": "Responsiveness", "subtitle": "Bulma is a mobile-first framework", + "color": "primary", + "icon": "arrows-alt-h", "path": "/documentation/overview/responsiveness" }, "overview-variables": { "name": "Variables", - "subtitle": "Easily customize Bulma to match your design", + "subtitle": "See how Bulma uses Sass variables to allows easy customization", + "color": "grey", + "icon": "cogs", "path": "/documentation/overview/variables" }, "overview-colors": { "name": "Colors", "subtitle": "The colors that style 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 easy-to-read naming system designed for humans", - "color": "info", + "color": "grey", "icon": "cogs", "path": "/documentation/modifiers" }, "modifiers-syntax": { "name": "Syntax", "subtitle": "Most Bulma elements have alternative styles. To apply them, you only need to append one of the modifier classes. They all start with is- or has-.", + "color": "orange", + "icon": "code", "path": "/documentation/modifiers/syntax" }, "modifiers-helpers": { "name": "Helpers", "subtitle": "Apply helper classes 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": "Show/hide content 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 color of the text and/or background", + "color": "info", + "icon": "tint", "path": "/documentation/modifiers/color-helpers" }, "modifiers-typography-helpers": { "name": "Typography helpers", "subtitle": "Change the size and color 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 responsive columns", + "color": "star", + "icon": "columns", "path": "/documentation/columns/basics" }, - "columns-gap": { - "name": "Gap", - "subtitle": Customize the gap between the columns, - "path": "/documentation/columns/gap" + "columns-sizes": { + "name": "Sizes", + "subtitle": "Define the size of each column individually", + "color": "success", + "icon": "expand-arrows-alt", + "path": "/documentation/columns/sizes" + }, + "columns-responsiveness": { + "name": "Responsiveness", + "subtitle": "Handle different column layouts for each breakpoint", + "color": "primary", + "icon": "arrows-alt-h", + "path": "/documentation/columns/responsiveness" }, "columns-nesting": { "name": "Nesting", "subtitle": "A simple way to build responsive columns", + "color": "danger", + "icon": "sitemap", "path": "/documentation/columns/nesting" }, + "columns-gap": { + "name": "Gap", + "subtitle": "Customize the gap between the columns", + "color": "info", + "icon": "pause", + "path": "/documentation/columns/gap" + }, "columns-options": { "name": "Options", "subtitle": "Design different types of column layouts", + "color": "grey", + "icon": "cogs", "path": "/documentation/columns/options" }, - "columns-responsiveness": { - "name": "Responsiveness", - "subtitle": "Handle different column layouts for each breakpoint", - "path": "/documentation/columns/responsiveness" - }, - "columns-sizes": { - "name": "Sizes", - "subtitle": "Define the size of each column individually", - "path": "/documentation/columns/sizes" - }, "layout": { "name": "Layout", "subtitle": "Design the structure of your webpage with these CSS classes", @@ -277,7 +318,7 @@ "elements-image": { "name": "Image", "subtitle": "A container for responsive images", - "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"], diff --git a/docs/_sass/specific.sass b/docs/_sass/specific.sass index f792ad604..8e69a1bdd 100644 --- a/docs/_sass/specific.sass +++ b/docs/_sass/specific.sass @@ -184,6 +184,9 @@ .has-text-orange color: $orange !important +.has-text-purple + color: $purple !important + .has-text-bootstrap color: $bootstrap !important diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index 6bbaac3d3..6ab913763 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -11229,6 +11229,10 @@ svg { color: #ff470f !important; } +.has-text-purple { + color: #b86bff !important; +} + .has-text-bootstrap { color: #6f5499 !important; }