Extract related list selector styles to mixin

This commit is contained in:
Javi Martín
2021-02-26 18:14:34 +01:00
committed by taitus
parent 522684cd2f
commit d741ccdb36
2 changed files with 31 additions and 16 deletions

View File

@@ -244,10 +244,12 @@
width: calc(100% + #{$spacing});
width: calc(100% + #{$max-spacing});
> * {
> *,
> .tabs-title {
margin-bottom: 0;
margin-left: $spacing;
margin-left: $max-spacing;
margin-right: 0;
margin-top: $spacing;
margin-top: $max-spacing;
}
@@ -261,6 +263,33 @@
@include sdg-goal-list;
}
%sdg-goal-list-expanded {
$spacing: 0.5%;
@include sdg-goal-list($spacing);
label,
li {
min-width: $sdg-icon-min-width;
width: calc(100% / 17 - #{$spacing});
&:hover {
cursor: pointer;
}
.sdg-goal-icon {
width: 100%;
}
a:focus {
outline: none;
img {
outline: $outline-focus;
}
}
}
}
%tags {
margin-bottom: 0;
margin-left: 0;

View File

@@ -17,27 +17,13 @@
}
.goals {
$spacing: 0.5%;
@include sdg-goal-list($spacing);
@extend %sdg-goal-list-expanded;
legend {
font-weight: normal;
font-style: italic;
}
label {
min-width: $sdg-icon-min-width;
width: calc(100% / 17 - #{$spacing});
&:hover {
cursor: pointer;
}
.sdg-goal-icon {
width: 100%;
}
}
input {
@include element-invisible;