Skip to content
Snippets Groups Projects
Commit 1ba835b9 authored by Kevin Paxman's avatar Kevin Paxman
Browse files

Merge branch 'feature/ISTWCMS-5151-m26lebla-update-home-icon' into '3.0.x'

Feature/istwcms 5151 m26lebla update home icon

See merge request !112
parents 6c3a08e3 0ffb0f75
No related branches found
No related tags found
1 merge request!112Feature/istwcms 5151 m26lebla update home icon
...@@ -12,20 +12,37 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat' ...@@ -12,20 +12,37 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
.#{$faculty} { .#{$faculty} {
.uw-horizontal-nav { .uw-horizontal-nav {
.uw-site-home__link{ .uw-site-home__link{
background-color:gesso-brand(org-default,uw-black, lvl4);
svg{ svg{
fill:gesso-brand(org-default,uw-gold,primary); .bg-circle{
fill:gesso-brand(org-default,uw-black, lvl4);
stroke:gesso-brand(org-default,uw-black, lvl4);
}
.house{
fill:gesso-brand(org-default,uw-gold,primary);
}
} }
&:focus{ &:focus{
background-color: gesso-brand(org-default,uw-white,lvl1);
svg{ svg{
fill:gesso-brand(org-default,uw-gold,primary); .bg-circle {
fill: gesso-brand(org-default, uw-gold, primary);
stroke: gesso-brand(org-default, uw-gold, primary);
}
.house {
fill: gesso-brand(org-default, uw-black, lvl4);
}
} }
} }
&:hover{ &:hover{
background-color:gesso-brand(org-default,uw-gold,primary);
svg{ svg{
fill:gesso-brand(org-default,uw-black, lvl4); .bg-circle {
fill: gesso-brand(org-default, uw-gold, primary);
stroke: gesso-brand(org-default, uw-gold, primary);
}
.house {
fill: gesso-brand(org-default, uw-black, lvl4);
}
} }
} }
} }
...@@ -102,20 +119,36 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat' ...@@ -102,20 +119,36 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
.#{$faculty} { .#{$faculty} {
.uw-horizontal-nav { .uw-horizontal-nav {
.uw-site-home__link{ .uw-site-home__link{
background-color:gesso-brand($faculty, lvl4);
svg{ svg{
fill:gesso-brand(org-default,uw-white,lvl1); .bg-circle{
fill:gesso-brand($faculty, lvl4);
stroke:gesso-brand($faculty, lvl4);
}
.house{
fill:gesso-brand(org-default,uw-white,lvl1);
}
} }
&:focus{ &:focus{
background-color: gesso-brand(org-default,uw-white,lvl1);
svg{ svg{
fill:gesso-brand($faculty, lvl4); .bg-circle{
fill:gesso-brand(org-default,uw-white,lvl1);
stroke:gesso-brand(org-default,uw-white,lvl1);
}
.house{
fill:gesso-brand($faculty, lvl4);
}
} }
} }
&:hover{ &:hover{
background-color:gesso-brand(org-default,uw-white,lvl1);
svg{ svg{
fill:gesso-brand($faculty, lvl4); .bg-circle{
fill:gesso-brand(org-default,uw-white,lvl1);
stroke:gesso-brand(org-default,uw-white,lvl1);
}
.house{
fill:gesso-brand($faculty, lvl4);
}
} }
} }
} }
...@@ -203,7 +236,9 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat' ...@@ -203,7 +236,9 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
grid-template-columns: 3rem auto; grid-template-columns: 3rem auto;
padding:0 gesso-spacing(xs); padding:0 gesso-spacing(xs);
} }
@include xl{
padding:0;
}
} }
&--home{ &--home{
display:none; display:none;
...@@ -212,26 +247,20 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat' ...@@ -212,26 +247,20 @@ $faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat'
grid-column: 1/2; grid-column: 1/2;
padding:gesso-spacing(xxs); padding:gesso-spacing(xxs);
.uw-site-home__link{ .uw-site-home__link{
border:1px solid $menu-horizontal-bg;
border-radius:50%;
display:block; display:block;
height:1.6rem; height:24px;
width:24px;
outline:none;
overflow:hidden;
position:relative;
width:1.6rem;
svg{ svg{
height:1.9rem; .bg-circle{
//padding-left:gesso-spacing(xxs); stroke-miterlimit:10;
//padding-top:gesso-spacing(xxs); stroke-width:0.5;
left:5px; }
position:absolute;
top:2px;
width:1.9rem;
} }
} }
} }
@include xl{
padding:gesso-spacing(xxs) 0;
}
} }
&--menu { &--menu {
@include uw-full-width; @include uw-full-width;
......
...@@ -2,8 +2,10 @@ ...@@ -2,8 +2,10 @@
<div class="uw-horizontal-nav--wrapper"> <div class="uw-horizontal-nav--wrapper">
<div class="uw-horizontal-nav--home"> <div class="uw-horizontal-nav--home">
<a href="{{ home_link }}" class="uw-site-home__link"> <a href="{{ home_link }}" class="uw-site-home__link">
{{ source('@components/svg/icons/_home.svg') }} <div class="uw-icon uw-svg uw-svg__home">
<span class="off-screen">Home</span> {% include '@components/svg/icons/_home.svg.twig' %}
</div>
<span class="off-screen">Home</span>
</a> </a>
</div> </div>
<div class="uw-horizontal-nav--menu"> <div class="uw-horizontal-nav--menu">
......
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
<path d="M10.982,5.04a.384.384,0,0,0-.375-.4H9.481a.384.384,0,0,0-.375.4V6.187L7.367,4.621a.479.479,0,0,0-.638,0L.9,9.818l.638.837L2.389,9.9v6.479a.384.384,0,0,0,.375.4h2.9a.384.384,0,0,0,.375-.4V13h2v3.375a.384.384,0,0,0,.375.4h2.9a.384.384,0,0,0,.375-.4V9.9l.851.756.638-.837-2.2-1.957Z"/>
</svg>
<svg height="20" width="26" xmlns="http://www.w3.org/2000/svg" version="1.1"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
<path fill="#fff" d="m13 4-9 6 0 10 7 0 0-7 4 0 0 7 7 0 0-10zM5 0v5.3l-5 3.3 1 1.3 12-8 12 8 1-1.3-13-8.7-5 3.3v-3.3h-3z"/> viewBox="0 0 24 24">
<title>Home</title>
<circle class="bg-circle" cx="12" cy="11.9" r="11.6"/>
<path class="house" d="M15.9,6.6c0-0.2-0.2-0.4-0.4-0.4c0,0,0,0,0,0h-1.1c-0.2,0-0.4,0.2-0.4,0.4c0,0,0,0,0,0v1.1l-1.7-1.6
c-0.2-0.2-0.5-0.2-0.6,0l-5.8,5.2l0.6,0.8l0.9-0.8V18c0,0.2,0.2,0.4,0.4,0.4c0,0,0,0,0,0h2.9c0.2,0,0.4-0.2,0.4-0.4c0,0,0,0,0,0
v-3.4h2V18c0,0.2,0.2,0.4,0.4,0.4c0,0,0,0,0,0h2.9c0.2,0,0.4-0.2,0.4-0.4c0,0,0,0,0,0v-6.5l0.9,0.8l0.6-0.8l-2.2-2L15.9,6.6z"/>
</svg> </svg>
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment