From 0150eb62f0e33a0c0ef9e75d9f55e71d79d5ba03 Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Tue, 15 Aug 2017 18:21:48 +0800 Subject: Fix Docs bugs --- docs/css/docs.css | 33 ++++++++++++++++++--------------- 1 file changed, 18 insertions(+), 15 deletions(-) (limited to 'docs/css/docs.css') diff --git a/docs/css/docs.css b/docs/css/docs.css index 02a6090..4a05927 100644 --- a/docs/css/docs.css +++ b/docs/css/docs.css @@ -256,23 +256,15 @@ color: #727e96; } /* Spectre Homepage style */ -.section-header { - -webkit-backdrop-filter: blur(.5rem); - backdrop-filter: blur(.5rem); - background: rgba(248, 249, 250, .9); +.section-hero { padding: 1rem .5rem; - position: fixed; - top: 0; - width: 100%; - z-index: 200; + position: relative; } -.section-header .s-brand { - padding: 0; - position: static; +.section-hero .s-brand { + position: absolute; } -.section-hero { - padding: 1.5rem .5rem; - position: relative; +.section-hero .s-brand h2 { + color: #5764c6; } .section-hero .column { padding: .4rem; @@ -302,7 +294,7 @@ } .grid-hero { margin-bottom: 2rem; - margin-top: 5rem; + margin-top: 6rem; } .grid-hero h1 { color: #454d5d; @@ -419,6 +411,17 @@ .s-content .s-subtitle::before { display: none; } + .section-hero .s-brand { + height: 5rem; + padding: 1.5rem .5rem; + } + .section-hero .s-brand .s-logo { + height: auto; + } + .section-hero .s-brand img { + height: 3.2rem; + width: 3.2rem; + } } @media screen and (max-width: 600px) { .grid-hero h2 { -- cgit v1.3.1-23-gd82d From b56b14d2f4a5c30c9a3d106377b40d3a7f595b8a Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Wed, 16 Aug 2017 19:53:45 +0800 Subject: Move Panels and Empty states to Components from Layout --- README.md | 4 +- docs/components.html | 334 ++++++++++++++++++++++++++++++++++++++-------- docs/css/docs.css | 1 + docs/elements.html | 84 ++++++------ docs/experimentals.html | 54 ++++---- docs/getting-started.html | 50 ++++--- docs/layout.html | 256 ++--------------------------------- docs/src/docs.less | 1 + docs/utilities.html | 48 +++---- 9 files changed, 420 insertions(+), 412 deletions(-) (limited to 'docs/css/docs.css') diff --git a/README.md b/README.md index 65b957a..483884f 100644 --- a/README.md +++ b/README.md @@ -55,8 +55,6 @@ You can compile your custom version of Spectre.css. Read [the documentation](htt - [Flexbox grid](https://picturepan2.github.io/spectre/layout.html#grid) - flexbox based responsive grid system - [Responsive](https://picturepan2.github.io/spectre/layout.html#responsive) - responsive grid and utilities - [Navbar](https://picturepan2.github.io/spectre/layout.html#navbar) - layout container that appears in the header of apps and websites -- [Panels](https://picturepan2.github.io/spectre/layout.html#panels) - flexible view container layout with auto-expand content section -- [Empty states](https://picturepan2.github.io/spectre/layout.html#empty) - empty states/blank slates for first time use, empty data and error screens #### Components - [Accordions](https://picturepan2.github.io/spectre/components.html#accordions) - used to toggle sections of content @@ -67,10 +65,12 @@ You can compile your custom version of Spectre.css. Read [the documentation](htt - [Bars](https://picturepan2.github.io/spectre/components.html#bars) - progress of a task or the value within the known range - [Cards](https://picturepan2.github.io/spectre/components.html#cards) - flexible content containers - [Chips](https://picturepan2.github.io/spectre/components.html#chips) - complex entities in small blocks +- [Empty states](https://picturepan2.github.io/spectre/components.html#empty) - empty states/blank slates for first time use, empty data and error screens - [Menus](https://picturepan2.github.io/spectre/components.html#menus) - list of links or buttons for actions and navigation - [Navs](https://picturepan2.github.io/spectre/components.html#navs) - navigational list of links - [Modals](https://picturepan2.github.io/spectre/components.html#modals) - flexible dialog prompts - [Pagination](https://picturepan2.github.io/spectre/components.html#pagination) - navigational links for multiple pages +- [Panels](https://picturepan2.github.io/spectre/components.html#panels) - flexible view container with auto-expand content section - [Popovers](https://picturepan2.github.io/spectre/components.html#popovers) - small overlay content containers - [Steps](https://picturepan2.github.io/spectre/components.html#steps) - progress indicators of a sequence of task steps - [Tabs](https://picturepan2.github.io/spectre/components.html#tabs) - toggle for different views diff --git a/docs/components.html b/docs/components.html index 3143683..c87bd8e 100644 --- a/docs/components.html +++ b/docs/components.html @@ -104,12 +104,6 @@
  • Navbar
    • -
  • - Panels -
    • -
  • - Empty states -
    • @@ -144,6 +138,9 @@
  • Chips
    • +
  • + Empty states +
  • Menus
    • @@ -156,6 +153,9 @@
  • Pagination
    • +
  • + Panels +
  • Popovers
    • @@ -251,8 +251,8 @@
    -
    -

    Accordions

    +
    +

    Accordions

    Accordions are used to toggle sections of content.

    @@ -402,8 +402,8 @@
    -
    -

    Autocomplete

    +
    +

    Autocomplete

    Autocomplete form component provides suggestions while you type. It is often used for tags and contacts input.

    @@ -529,8 +529,8 @@
    -
    -

    Avatars

    +
    +

    Avatars

    Avatars are user profile pictures.

    @@ -610,8 +610,8 @@
    -
    -

    Badges

    +
    +

    Badges

    Badges are often used as unread number indicators.

    @@ -686,8 +686,8 @@
    -
    -

    Bars

    +
    +

    Bars

    Bars represent the progress of a task or the value within the known range. Bars are custom components for displaying HTML5 progress, meter and input range elements.

    @@ -732,7 +732,7 @@ </div> -

    Slider bars

    +

    Slider bars

    @@ -781,8 +781,8 @@
    -