Commit bb26ace5 authored by m26lebla's avatar m26lebla

adding the bread crumb css and update to territorial statement font family to use function

parent 681a6427
@charset "UTF-8";
/**
* Breakpoint Configuration
* @see https://github.com/Team-Sass/breakpoint/wiki
......@@ -2024,13 +2025,17 @@ ul.toolbar-menu {
font-weight: normal;
text-align: left; }
.uw-site--breadcrumb {
line-height: 1.25;
text-align: center; }
@media (min-width: 48.0625em) {
.uw-site--breadcrumb {
text-align: left; } }
.breadcrumb {
background-color: #112E51;
color: #fff;
font-size: 1rem;
margin: 1rem 0;
min-height: 2.5rem;
padding-top: 1rem; }
color: #000;
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-size: 0.79rem; }
.breadcrumb::after {
clear: both;
content: "";
......@@ -2046,38 +2051,29 @@ ul.toolbar-menu {
display: inline; }
.breadcrumb__item {
margin-right: 0.75em; }
display: inline;
margin: 0;
padding: 0; }
.breadcrumb__item::after {
color: #eee;
content: '/';
margin-left: 0.75em; }
color: #000;
content: ' » '; }
.breadcrumb__item:last-child::after {
content: '';
margin-left: 0; }
@media (max-width: 40.0625em) {
.breadcrumb__list .breadcrumb__item {
display: none; }
.breadcrumb__list .breadcrumb__item:nth-last-child(2) {
display: block; }
.breadcrumb__list .breadcrumb__item:nth-last-child(2)::after {
display: none; }
.breadcrumb__list .breadcrumb__item:nth-last-child(2)::before {
color: #eee;
content: '<';
margin-right: 0.75em; } }
.breadcrumb__link {
color: #A2A2A2;
color: #4e4e4e;
text-decoration: underline;
text-decoration: none; }
.breadcrumb__link:visited {
color: #A2A2A2; }
color: #4e4e4e; }
.breadcrumb__link:hover, .breadcrumb__link:focus {
color: #fff;
color: #000;
text-decoration: none; }
.breadcrumb__link:active {
color: #fff; }
color: #000; }
.breadcrumb__link:hover, .breadcrumb__link:focus {
text-decoration: underline; }
.button {
background-color: #757575;
......@@ -4878,7 +4874,7 @@ html:not(.js) .uw-tabcontent[role="tabpanel"][hidden] {
text-align: center; }
.uw-territorial p {
color: #fff;
font-family: Typ1451-Regular;
font-family: Typ1451-Medium,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen-Sans", Ubuntu, Cantarell, "Fira Sans", Droid Sans, sans-serif;
font-size: 0.79rem;
font-weight: 200;
letter-spacing: 0.5px;
......
// @file
// Styles for Breadcrumb trail.
$breadcrumb-background-color: gesso-color(ui, generic, accent-dark) !default;
$breadcrumb-divider-color: gesso-color(ui, generic, border-light) !default;
$breadcrumb-link-color: gesso-color(ui, generic, text-light) !default;
$breadcrumb-text-color: gesso-color(text, on-dark) !default;
$breadcrumb-divider-color: gesso-color(text ,primary) !default;
$breadcrumb-link-color: gesso-color(text, link) !default;
$breadcrumb-text-color: gesso-color(text, primary) !default;
.uw-site--breadcrumb{
line-height:1.25;
text-align:center;
@include breakpoint(gesso-breakpoint(md)) {
text-align: left;
}
}
.breadcrumb {
@include clearfix();
background-color: $breadcrumb-background-color;
color: $breadcrumb-text-color;
font-size: rem(gesso-font-size(0));
margin: rem(gesso-spacing(sm)) 0;
min-height: rem(gesso-spacing(lg));
padding-top: rem(gesso-spacing(sm));
font-family: gesso-font-family(systemmedium);
font-size: rem(gesso-font-size(-2));
}
.breadcrumb__title {
......@@ -25,40 +29,24 @@ $breadcrumb-text-color: gesso-color(text, on-dark) !default;
}
.breadcrumb__item {
margin-right: 0.75em;
display: inline;
margin: 0;
padding: 0;
&::after {
color: $breadcrumb-divider-color;
content: '/';
margin-left: 0.75em;
content: ' » ';
}
&:last-child::after {
content: '';
margin-left: 0;
}
}
.breadcrumb__list .breadcrumb__item {
@include breakpoint(max-width gesso-breakpoint(sm)) {
display: none;
&:nth-last-child(2) {
display: block;
&::after {
display: none;
}
&::before {
color: $breadcrumb-divider-color;
content: '<';
margin-right: 0.75em;
}
}
}
}
.breadcrumb__link {
@include link($breadcrumb-link-color, $breadcrumb-text-color);
text-decoration: none;
&:hover,
&:focus{
text-decoration:underline;
}
}
<nav aria-labelled="breadcrumb-label" class="breadcrumb {{ modifier_classes }}" role="navigation">
<div class="l-constrain">
<div class="uw-site--breadcrumb">
<nav aria-labelled="Breadcrumb" class="breadcrumb {{ modifier_classes }}" role="navigation">
<h2 class="breadcrumb__title visually-hidden" id="breadcrumb-label">{{ heading|default('You are here') }}</h2>
<ol class="breadcrumb__list">
{% for item in breadcrumb %}
<li class="breadcrumb__item">
{% if item.url %}
<a class="breadcrumb__link" href="{{ item.url }}">{{ item.text }}</a>
<a class="breadcrumb__link {% if loop.index0 > 0 %} active_trail {% endif %} " title="{{ item.link_title }}" href="{{ item.url }}">{{ item.text }}</a>
{% else %}
<span aria-current="page">
{{ item.text }}
......@@ -14,5 +14,5 @@
</li>
{% endfor %}
</ol>
</div>
</nav>
</div>
......@@ -5,11 +5,15 @@ breadcrumb:
-
url: '#'
text: 'Home'
link_title: 'this is link title'
-
url: '#'
text: 'Level 1'
link_title: 'this is link title'
-
url: '#'
text: 'Level 2'
link_title: 'this is link title'
-
text: 'Current item'
link_title: 'this is link title'
......@@ -8,7 +8,7 @@
text-align:center;
p{
color:gesso-brand(org-default,uw-white,lvl1);
font-family: Typ1451-Regular;
font-family: gesso-font-family(systemmedium);
font-size: rem(gesso-font-size(-2));
font-weight:200;
letter-spacing:0.5px;
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment