From 4380aacda6c050ec286946ce53dfe23dfb40da96 Mon Sep 17 00:00:00 2001 From: Jeremy Thomas Date: Wed, 11 Apr 2018 15:43:26 +0100 Subject: [PATCH] Add component icons --- docs/_data/links.json | 29 ++++++++++++++++++++---- docs/_sass/index.sass | 6 ++++- docs/css/bulma-docs.css | 8 ++++++- docs/documentation/components/panel.html | 2 +- 4 files changed, 38 insertions(+), 7 deletions(-) diff --git a/docs/_data/links.json b/docs/_data/links.json index 1efa1bbd..1736e395 100644 --- a/docs/_data/links.json +++ b/docs/_data/links.json @@ -289,7 +289,7 @@ "elements-button": { "name": "Button", "subtitle": "The classic button, in different colors, sizes, and states", - "color": "primary", + "color": "success", "icon": "hand-pointer", "icon_regular": "true", "path": "/documentation/elements/button" @@ -297,7 +297,7 @@ "elements-content": { "name": "Content", "subtitle": "A single class to handle WYSIWYG generated content, where only HTML tags are available", - "color": "success", + "color": "primary", "icon": "align-left", "path": "/documentation/elements/content" }, @@ -325,7 +325,7 @@ "elements-notification": { "name": "Notification", "subtitle": "Bold notification blocks, to alert your users of something", - "color": "danger", + "color": "orange", "icon": "exclamation-triangle", "path": "/documentation/elements/notification" }, @@ -346,7 +346,7 @@ "elements-tag": { "name": "Tag", "subtitle": "Small tag labels to insert anywhere", - "color": "orange", + "color": "success", "icon": "tag", "path": "/documentation/elements/tag" }, @@ -367,51 +367,72 @@ "components-breadcrumb": { "name": "Breadcrumb", "subtitle": "A simple breadcrumb component to improve your navigation experience", + "color": "star", + "icon": "ellipsis-h", "path": "/documentation/components/breadcrumb" }, "components-card": { "name": "Card", "subtitle": "An all-around flexible and composable component", + "color": "success", + "icon": "id-card", "path": "/documentation/components/card" }, "components-dropdown": { "name": "Dropdown", "subtitle": "An interactive dropdown menu for discoverable content", + "color": "success", + "icon": "angle-down", "path": "/documentation/components/dropdown" }, "components-menu": { "name": "Menu", "subtitle": "A simple menu, for any type of vertical navigation", + "icon": "bars", "path": "/documentation/components/menu" }, "components-message": { "name": "Message", "subtitle": "Colored message blocks, to emphasize part of your page", + "color": "info", + "icon": "window-maximize", + "icon_regular": "true", "path": "/documentation/components/message" }, "components-modal": { "name": "Modal", "subtitle": "A classic modal overlay, in which you can include any content you want", + "color": "danger", + "icon": "clone", "path": "/documentation/components/modal" }, "components-navbar": { "name": "Navbar", "subtitle": "A responsive horizontal navbar that can support images, links, buttons, and dropdowns", + "color": "primary", + "icon": "minus", "path": "/documentation/components/navbar" }, "components-pagination": { "name": "Pagination", "subtitle": "A responsive, usable, and flexible pagination", + "color": "orange", + "icon": "caret-square-right", "path": "/documentation/components/pagination" }, "components-panel": { "name": "Panel", "subtitle": "A composable panel, for compact controls", + "color": "grey-dark", + "icon": "list-alt", + "icon_regular": "true", "path": "/documentation/components/panel" }, "components-tabs": { "name": "Tabs", "subtitle": "Simple responsive horizontal navigation tabs, with different styles", + "color": "purple", + "icon": "folder", "path": "/documentation/components/tabs" }, "blog": { diff --git a/docs/_sass/index.sass b/docs/_sass/index.sass index 8efe1d87..670f1c60 100644 --- a/docs/_sass/index.sass +++ b/docs/_sass/index.sass @@ -2,12 +2,16 @@ .bd-index-header text-align: center + a, + strong + transition-duration: $speed + transition-property: color a color: currentColor &:hover color: $blue strong - color: currentColor + color: $link strong font-weight: $weight-semibold .title diff --git a/docs/css/bulma-docs.css b/docs/css/bulma-docs.css index 06c6ad0d..82110f50 100644 --- a/docs/css/bulma-docs.css +++ b/docs/css/bulma-docs.css @@ -10295,6 +10295,12 @@ svg { text-align: center; } +.bd-index-header a, +.bd-index-header strong { + transition-duration: 86ms; + transition-property: color; +} + .bd-index-header a { color: currentColor; } @@ -10304,7 +10310,7 @@ svg { } .bd-index-header a:hover strong { - color: currentColor; + color: #3273dc; } .bd-index-header strong { diff --git a/docs/documentation/components/panel.html b/docs/documentation/components/panel.html index 9fa379ad..e71456ba 100644 --- a/docs/documentation/components/panel.html +++ b/docs/documentation/components/panel.html @@ -108,6 +108,6 @@ meta:

-{% include elements/snippet.html content=panel_example size="one-third" %} +{% include elements/snippet.html content=panel_example %} {% include elements/variables.html type='component' %}