pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Invert icon active / inactive colors

Browse Source
This commit is contained in:
richard-dds 2019-06-04 13:12:54 -04:00
parent 6456241289
commit 11c258ef7d
2 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
styles/components/_portfolio_layout.scss
View File

@ -55,11 +55,19 @@
.icon-link { .icon-link {
padding: 0.8rem 1.2rem; padding: 0.8rem 1.2rem;
&.active {
color: $color-gray; color: $color-gray;
opacity: 0.3;
.icon { .icon {
@include icon-color($color-gray); @include icon-color($color-gray);
} }
&.active {
opacity: 1.0;
color: $color-blue;
.icon {
@include icon-color($color-blue);
}
} }
.icon-link--icon { .icon-link--icon {

2
templates/portfolios/header.html
View File

@ -2,7 +2,7 @@
{% from "components/tooltip.html" import Tooltip %} {% from "components/tooltip.html" import Tooltip %}
{% macro Link(icon, text, url, active=False) %} {% macro Link(icon, text, url, active=False) %}
<a class='icon-link {{ "active icon-link--disabled" if active }}' href='{{ url }}'> <a class='icon-link {{ "active" if active }}' href='{{ url }}'>
<div class='col'> <div class='col'>
<div class='icon-link--icon'>{{ Icon(icon) }}</div> <div class='icon-link--icon'>{{ Icon(icon) }}</div>
<div class='icon-link--name'>{{ text }}</div> <div class='icon-link--name'>{{ text }}</div>