From aabd81f3ec626753d4af32de3016dd0b343e0987 Mon Sep 17 00:00:00 2001 From: eupiteco Date: Sat, 4 Aug 2018 10:51:15 -0300 Subject: [PATCH] added navbar to the components page --- _includes/components/navbar.html | 34 ++++++++++++++++++++++++ _layouts/components.html | 1 + _site/assets/styles/components.scss | 24 ++++++++++++++--- _site/assets/styles/main.css | 6 +++++ _site/components/index.html | 41 +++++++++++++++++++++++++++++ assets/styles/components.scss | 24 ++++++++++++++--- components.md | 1 + 7 files changed, 123 insertions(+), 8 deletions(-) create mode 100644 _includes/components/navbar.html diff --git a/_includes/components/navbar.html b/_includes/components/navbar.html new file mode 100644 index 0000000..b44e773 --- /dev/null +++ b/_includes/components/navbar.html @@ -0,0 +1,34 @@ + +
+ +
diff --git a/_layouts/components.html b/_layouts/components.html index 4ff44d6..0396cd7 100644 --- a/_layouts/components.html +++ b/_layouts/components.html @@ -19,6 +19,7 @@ {% include components/buttons.html %} {% include components/badges.html %} {% include components/forms.html %} + {% include components/navbar.html %} {% include components/tables.html %} {% include components/cards.html %} {% include components/paginate.html %} diff --git a/_site/assets/styles/components.scss b/_site/assets/styles/components.scss index f40e6e8..7e2f9d4 100644 --- a/_site/assets/styles/components.scss +++ b/_site/assets/styles/components.scss @@ -1,7 +1,3 @@ -.navbar { - // background-color: $oc-white !important; -} - .background-primary { background-color: $primary; } @@ -246,6 +242,26 @@ background-color: $secondary !important; } +#styleguide-nav { + background-color: $oc-white !important; + .nav-item:hover { + box-shadow: inset 0 -5px $primary; + + & .nav-link { + color: $primary; + } + } + .nav-link { + color: $oc-gray-9; + } + + .show { + .nav-item:hover { + box-shadow: 0 0; + } + } +} + .rb-link { color: $primary !important; &:hover { diff --git a/_site/assets/styles/main.css b/_site/assets/styles/main.css index 50ef7b4..5a6f17b 100644 --- a/_site/assets/styles/main.css +++ b/_site/assets/styles/main.css @@ -161,6 +161,12 @@ h4.header-display::before { height: 2.25rem; transform: translate(-15px, 0.5625r .badge-secondary { background-color: #60AB60 !important; } +#styleguide-nav { background-color: #ffffff !important; } +#styleguide-nav .nav-item:hover { box-shadow: inset 0 -5px #4661A9; } +#styleguide-nav .nav-item:hover .nav-link { color: #4661A9; } +#styleguide-nav .nav-link { color: #212529; } +#styleguide-nav .show .nav-item:hover { box-shadow: 0 0; } + .rb-link { color: #4661A9 !important; } .rb-link:hover { color: #60AB60 !important; } diff --git a/_site/components/index.html b/_site/components/index.html index 10f2eb6..ed4ca27 100644 --- a/_site/components/index.html +++ b/_site/components/index.html @@ -93,6 +93,12 @@ +
  • + Header +
    • + + +
  • Tables
    • @@ -186,6 +192,41 @@ + +
    + +
    +

    Tables

    diff --git a/assets/styles/components.scss b/assets/styles/components.scss index f40e6e8..7e2f9d4 100644 --- a/assets/styles/components.scss +++ b/assets/styles/components.scss @@ -1,7 +1,3 @@ -.navbar { - // background-color: $oc-white !important; -} - .background-primary { background-color: $primary; } @@ -246,6 +242,26 @@ background-color: $secondary !important; } +#styleguide-nav { + background-color: $oc-white !important; + .nav-item:hover { + box-shadow: inset 0 -5px $primary; + + & .nav-link { + color: $primary; + } + } + .nav-link { + color: $oc-gray-9; + } + + .show { + .nav-item:hover { + box-shadow: 0 0; + } + } +} + .rb-link { color: $primary !important; &:hover { diff --git a/components.md b/components.md index d62ea60..6bda1b5 100644 --- a/components.md +++ b/components.md @@ -7,6 +7,7 @@ - buttons: Buttons - badges: Badges - forms: Forms + - header: Header - tables: Tables - cards: Cards - scrollspy: Scrollspy