Replace font awesome font with svg
This commit is contained in:
+9
-119
@@ -1,119 +1,9 @@
|
||||
|
||||
|
||||
|
||||
@use 'fa/solid' with (
|
||||
$fa-css-prefix: fa,
|
||||
$fa-font-path: "fonts"
|
||||
);
|
||||
@use 'fa/mixins';
|
||||
@use 'fa/core';
|
||||
@use 'fa/sizing';
|
||||
@use 'fa/fixed-width';
|
||||
@use 'fa/list';
|
||||
@use 'fa/bordered-pulled';
|
||||
@use 'fa/animated';
|
||||
@use 'fa/rotated-flipped';
|
||||
@use 'fa/stacked';
|
||||
@use "fa/functions";
|
||||
@use "fa/variables";
|
||||
|
||||
|
||||
.fa {
|
||||
&.push {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
&.push-left {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* Navigation */
|
||||
.#{variables.$fa-css-prefix}-menu:before { content: functions.fa-content(variables.$fa-var-bars); }
|
||||
.#{variables.$fa-css-prefix}-error:before { content: functions.fa-content(variables.$fa-var-square-exclamation); }
|
||||
.#{variables.$fa-css-prefix}-warning:before { content: functions.fa-content(variables.$fa-var-exclamation-triangle); }
|
||||
.#{variables.$fa-css-prefix}-success:before { content: functions.fa-content(variables.$fa-var-check-circle); }
|
||||
.#{variables.$fa-css-prefix}-new:before { content: functions.fa-content(variables.$fa-var-plus); }
|
||||
.#{variables.$fa-css-prefix}-refresh:before { content: functions.fa-content(variables.$fa-var-sync); }
|
||||
.#{variables.$fa-css-prefix}-refresh:before { content: functions.fa-content(variables.$fa-var-sync); }
|
||||
.#{variables.$fa-css-prefix}-cancel:before { content: functions.fa-content(variables.$fa-var-image); }
|
||||
.#{variables.$fa-css-prefix}-prev:before,
|
||||
.#{variables.$fa-css-prefix}-back:before { content: functions.fa-content(variables.$fa-var-chevron-left); }
|
||||
.#{variables.$fa-css-prefix}-next:before { content: functions.fa-content(variables.$fa-var-chevron-right); }
|
||||
.#{variables.$fa-css-prefix}-close:before { content: functions.fa-content(variables.$fa-var-times-circle); }
|
||||
|
||||
/* Map */
|
||||
.#{variables.$fa-css-prefix}-map:before { content: functions.fa-content(variables.$fa-var-map-marked); }
|
||||
.#{variables.$fa-css-prefix}-marker:before { content: functions.fa-content(variables.$fa-var-map-marker); }
|
||||
.#{variables.$fa-css-prefix}-footprint:before { content: functions.fa-content(variables.$fa-var-shoe-prints); }
|
||||
.#{variables.$fa-css-prefix}-track-off-track:before { content: functions.fa-content(variables.$fa-var-hiking); }
|
||||
.#{variables.$fa-css-prefix}-track-main:before { content: functions.fa-content(variables.$fa-var-hiking); }
|
||||
.#{variables.$fa-css-prefix}-track-hitchhiking:before { content: functions.fa-content(variables.$fa-var-car-side); }
|
||||
.#{variables.$fa-css-prefix}-track-start:before { content: functions.fa-content(variables.$fa-var-hiking);}
|
||||
.#{variables.$fa-css-prefix}-track-end:before { content: functions.fa-content(variables.$fa-var-hiking);}
|
||||
.#{variables.$fa-css-prefix}-layers:before { content: functions.fa-content(variables.$fa-var-layer-group); }
|
||||
.#{variables.$fa-css-prefix}-elev-chart:before { content: functions.fa-content(variables.$fa-var-chart-area); }
|
||||
.#{variables.$fa-css-prefix}-distance:before { content: functions.fa-content(variables.$fa-var-arrow-circle-right); }
|
||||
.#{variables.$fa-css-prefix}-elev-drop:before { content: functions.fa-content(variables.$fa-var-arrow-circle-down); }
|
||||
.#{variables.$fa-css-prefix}-elev-gain:before { content: functions.fa-content(variables.$fa-var-arrow-circle-up); }
|
||||
.#{variables.$fa-css-prefix}-download:before { content: functions.fa-content(variables.$fa-var-file-download); }
|
||||
|
||||
/* Admin */
|
||||
.#{variables.$fa-css-prefix}-newsletter:before { content: functions.fa-content(variables.$fa-var-wifi); }
|
||||
.#{variables.$fa-css-prefix}-project:before { content: functions.fa-content(variables.$fa-var-hiking); }
|
||||
.#{variables.$fa-css-prefix}-unsubscribe:before { content: functions.fa-content(variables.$fa-var-times); }
|
||||
.#{variables.$fa-css-prefix}-credits:before { content: functions.fa-content(variables.$fa-var-paw); }
|
||||
.#{variables.$fa-css-prefix}-admin:before { content: functions.fa-content(variables.$fa-var-tools); }
|
||||
.#{variables.$fa-css-prefix}-config:before { content: functions.fa-content(variables.$fa-var-cogs); }
|
||||
.#{variables.$fa-css-prefix}-upload:before { content: functions.fa-content(variables.$fa-var-cloud-upload); }
|
||||
|
||||
/* Upload */
|
||||
.#{variables.$fa-css-prefix}-save:before { content: functions.fa-content(variables.$fa-var-floppy-disk); }
|
||||
|
||||
/* Feed */
|
||||
.#{variables.$fa-css-prefix}-post:before { content: functions.fa-content(variables.$fa-var-comment); }
|
||||
.#{variables.$fa-css-prefix}-media:before { content: functions.fa-content(variables.$fa-var-photo-video); }
|
||||
.#{variables.$fa-css-prefix}-video:before { content: functions.fa-content(variables.$fa-var-film); }
|
||||
.#{variables.$fa-css-prefix}-image:before { content: functions.fa-content(variables.$fa-var-image); }
|
||||
.#{variables.$fa-css-prefix}-message:before { content: functions.fa-content(variables.$fa-var-map-marker); }
|
||||
.#{variables.$fa-css-prefix}-time:before { content: functions.fa-content(variables.$fa-var-clock); }
|
||||
.#{variables.$fa-css-prefix}-coords:before { content: functions.fa-content(variables.$fa-var-compass); }
|
||||
.#{variables.$fa-css-prefix}-altitude:before { content: functions.fa-content(variables.$fa-var-mountain); }
|
||||
.#{variables.$fa-css-prefix}-drill-video:before { content: functions.fa-content(variables.$fa-var-play-circle); }
|
||||
.#{variables.$fa-css-prefix}-drill-image:before { content: functions.fa-content(variables.$fa-var-search); }
|
||||
.#{variables.$fa-css-prefix}-drill-message:before { content: functions.fa-content(variables.$fa-var-magnifying-glass-location); }
|
||||
.#{variables.$fa-css-prefix}-video-shot:before { content: functions.fa-content(variables.$fa-var-camcorder); }
|
||||
.#{variables.$fa-css-prefix}-image-shot:before { content: functions.fa-content(variables.$fa-var-camera-alt); }
|
||||
.#{variables.$fa-css-prefix}-link:before { content: functions.fa-content(variables.$fa-var-link); }
|
||||
.#{variables.$fa-css-prefix}-copied:before { content: functions.fa-content(variables.$fa-var-check); }
|
||||
|
||||
/* Feed - Poster */
|
||||
.#{variables.$fa-css-prefix}-poster:before { content: functions.fa-content(variables.$fa-var-comment-edit); }
|
||||
.#{variables.$fa-css-prefix}-send:before { content: functions.fa-content(variables.$fa-var-paper-plane); }
|
||||
|
||||
/* Lightbox */
|
||||
.#{variables.$fa-css-prefix}-timezone:before { content: functions.fa-content(variables.$fa-var-globe); }
|
||||
|
||||
/* Weather */
|
||||
.#{variables.$fa-css-prefix}-temperature:before { content: functions.fa-content(variables.$fa-var-thermometer-three-quarters); }
|
||||
.#{variables.$fa-css-prefix}-clear-day:before { content: functions.fa-content(variables.$fa-var-sun); }
|
||||
.#{variables.$fa-css-prefix}-clear-night:before { content: functions.fa-content(variables.$fa-var-moon-stars); }
|
||||
.#{variables.$fa-css-prefix}-cloudy:before { content: functions.fa-content(variables.$fa-var-clouds); }
|
||||
.#{variables.$fa-css-prefix}-fog:before { content: functions.fa-content(variables.$fa-var-fog); }
|
||||
.#{variables.$fa-css-prefix}-hail:before { content: functions.fa-content(variables.$fa-var-cloud-hail); }
|
||||
.#{variables.$fa-css-prefix}-partly-cloudy-day:before { content: functions.fa-content(variables.$fa-var-cloud-sun); }
|
||||
.#{variables.$fa-css-prefix}-partly-cloudy-night:before { content: functions.fa-content(variables.$fa-var-cloud-moon); }
|
||||
.#{variables.$fa-css-prefix}-rain-snow-showers-day:before { content: functions.fa-content(variables.$fa-var-cloud-sun-rain); }
|
||||
.#{variables.$fa-css-prefix}-rain-snow-showers-night:before { content: functions.fa-content(variables.$fa-var-cloud-moon-rain); }
|
||||
.#{variables.$fa-css-prefix}-rain-snow:before { content: functions.fa-content(variables.$fa-var-cloud-sleet); }
|
||||
.#{variables.$fa-css-prefix}-rain:before { content: functions.fa-content(variables.$fa-var-cloud-rain); }
|
||||
.#{variables.$fa-css-prefix}-showers-day:before { content: functions.fa-content(variables.$fa-var-cloud-sun-rain); }
|
||||
.#{variables.$fa-css-prefix}-showers-night:before { content: functions.fa-content(variables.$fa-var-cloud-moon-rain); }
|
||||
.#{variables.$fa-css-prefix}-sleet:before { content: functions.fa-content(variables.$fa-var-cloud-sleet); }
|
||||
.#{variables.$fa-css-prefix}-snow-showers-day:before { content: functions.fa-content(variables.$fa-var-cloud-snow); }
|
||||
.#{variables.$fa-css-prefix}-snow-showers-night:before { content: functions.fa-content(variables.$fa-var-cloud-snow); }
|
||||
.#{variables.$fa-css-prefix}-snow:before { content: functions.fa-content(variables.$fa-var-cloud-snow); }
|
||||
.#{variables.$fa-css-prefix}-thunder-rain:before { content: functions.fa-content(variables.$fa-var-thunderstorm); }
|
||||
.#{variables.$fa-css-prefix}-thunder-showers-day:before { content: functions.fa-content(variables.$fa-var-thunderstorm-sun); }
|
||||
.#{variables.$fa-css-prefix}-thunder-showers-night:before { content: functions.fa-content(variables.$fa-var-thunderstorm-moon); }
|
||||
.#{variables.$fa-css-prefix}-thunder:before { content: functions.fa-content(variables.$fa-var-thunderstorm); }
|
||||
.#{variables.$fa-css-prefix}-wind:before { content: functions.fa-content(variables.$fa-var-wind); }
|
||||
.spot-icon {
|
||||
&.push {
|
||||
margin-right: 0.3rem;
|
||||
}
|
||||
|
||||
&.push-left {
|
||||
margin-left: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
+23
-10
@@ -1,13 +1,26 @@
|
||||
@use "common";
|
||||
@use "fa/variables";
|
||||
@use "fa";
|
||||
@use "color";
|
||||
|
||||
@mixin lightbox-icon($icon) {
|
||||
background: none;
|
||||
font-size: 2em;
|
||||
@extend .fa;
|
||||
@extend .#{variables.$fa-css-prefix}-#{$icon};
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
|
||||
&:before {
|
||||
@if $icon == prev {
|
||||
content: "‹";
|
||||
}
|
||||
@else if $icon == next {
|
||||
content: "›";
|
||||
}
|
||||
@else if $icon == close {
|
||||
content: "×";
|
||||
}
|
||||
@else if $icon == cancel {
|
||||
content: "□";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
body.lb-disable-scrolling {
|
||||
@@ -89,9 +102,9 @@ body.lb-disable-scrolling {
|
||||
line-height: 1.33333333em;
|
||||
|
||||
&.comment {
|
||||
.fa {
|
||||
vertical-align: center;
|
||||
}
|
||||
.spot-icon {
|
||||
vertical-align: center;
|
||||
}
|
||||
.comment-text {
|
||||
display: inline-block;
|
||||
width: calc(100% - 1.25em*1.33333333333 - 0.5rem);
|
||||
@@ -263,12 +276,12 @@ body.lb-disable-scrolling {
|
||||
|
||||
.lb-closeContainer .lb-close {
|
||||
@include lightbox-icon(close);
|
||||
@extend .fa-lg;
|
||||
@extend .fa-fw;
|
||||
@extend .clickable;
|
||||
height: auto;
|
||||
font-size: 1.3333333333em;
|
||||
line-height: 1em;
|
||||
text-align: center;
|
||||
width: 1.25em;
|
||||
|
||||
&:hover {
|
||||
color: color.$default-inv-hover;
|
||||
@@ -276,4 +289,4 @@ body.lb-disable-scrolling {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,23 +1,29 @@
|
||||
@use "fa/variables";
|
||||
@use "var";
|
||||
@use "color";
|
||||
@use "fa";
|
||||
|
||||
#feed {
|
||||
#feed-panel {
|
||||
#feed-header {
|
||||
.poster {
|
||||
textarea[name=post] {
|
||||
margin-bottom: 1em;
|
||||
width: calc(100% - 2em);
|
||||
}
|
||||
.poster-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var.$block-spacing;
|
||||
|
||||
input[name=name] {
|
||||
width: calc(100% - 6em);
|
||||
}
|
||||
.poster-actions {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
gap: var.$block-spacing;
|
||||
|
||||
button[name=submit] {
|
||||
margin-left: 1em;
|
||||
input[name=name] {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
button[name=submit] {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,7 +70,6 @@
|
||||
width: 25%;
|
||||
|
||||
.link {
|
||||
margin-left: var.$elem-spacing;
|
||||
padding: 0;
|
||||
line-height: 1;
|
||||
}
|
||||
@@ -84,9 +89,6 @@
|
||||
}
|
||||
|
||||
&.headerless {
|
||||
.header {
|
||||
display: none;
|
||||
}
|
||||
.body {
|
||||
padding-top: var.$block-spacing;
|
||||
text-align: center;
|
||||
@@ -94,7 +96,7 @@
|
||||
p {
|
||||
margin: 0;
|
||||
|
||||
.fa {
|
||||
.spot-icon {
|
||||
display: inline-block;
|
||||
font-size: 2em;
|
||||
margin: var.$elem-spacing 0;
|
||||
@@ -126,18 +128,20 @@
|
||||
line-height: 0;
|
||||
|
||||
.drill-icon {
|
||||
transform: translate(-16px, -32px);
|
||||
|
||||
.drill-hover-icon {
|
||||
display: none;
|
||||
text-shadow: color.$over-img-shadow 3px 3px 3px;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
@extend .#{variables.$fa-css-prefix}-drill-message;
|
||||
top: 13px;
|
||||
left: 3px;
|
||||
}
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
.sub {
|
||||
display: none;
|
||||
}
|
||||
.drill-hover-icon {
|
||||
color: color.$message-flashy;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -146,17 +150,23 @@
|
||||
top: var.$block-spacing;
|
||||
right: var.$block-spacing;
|
||||
|
||||
.fa {
|
||||
.spot-icon {
|
||||
font-size: 1.3em;
|
||||
vertical-align: middle;
|
||||
line-height: 1rem;
|
||||
height: 1rem;
|
||||
background: color.$message;
|
||||
color: color.$message-bg;
|
||||
border-radius: var.$block-radius 0 0 var.$block-radius;
|
||||
padding: var.$elem-spacing;
|
||||
|
||||
&.push {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.temperature {
|
||||
display: inline-block;
|
||||
line-height: 1rem;
|
||||
vertical-align: middle;
|
||||
padding: var.$elem-spacing;
|
||||
background: color.$message-bg;
|
||||
@@ -173,7 +183,7 @@
|
||||
|
||||
&.post {
|
||||
.body {
|
||||
padding: 0em 1em 0.5em;
|
||||
padding: 0 var.$block-spacing var.$elem-spacing;
|
||||
|
||||
.message {
|
||||
margin: 0;
|
||||
@@ -218,19 +228,18 @@
|
||||
}
|
||||
|
||||
.drill-icon {
|
||||
font-size: 3em;
|
||||
|
||||
.fa-drill-image {
|
||||
.drill-image {
|
||||
color: transparent;
|
||||
}
|
||||
.fa-drill-video {
|
||||
.drill-video {
|
||||
color: color.$over-img-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.drill-icon {
|
||||
.fa-drill-image, .fa-drill-video {
|
||||
.drill-image, .drill-video {
|
||||
color: color.$media-bg;
|
||||
text-shadow: color.$over-img-shadow 3px 3px 3px;
|
||||
}
|
||||
|
||||
@@ -62,15 +62,15 @@ $thumbnail-max-size: 60px;
|
||||
&.drill {
|
||||
font-size: 2em;
|
||||
|
||||
.fa-drill-image {
|
||||
.drill-image {
|
||||
color: transparent;
|
||||
}
|
||||
.fa-drill-video {
|
||||
.drill-video {
|
||||
color: color.$over-img-bg;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.fa-drill-video, .fa-drill-image {
|
||||
.drill-video, .drill-image {
|
||||
color: color.$default-bg;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
@use "common";
|
||||
@use "var";
|
||||
@use "color";
|
||||
@use "fa";
|
||||
|
||||
$panel-width: 30vw;
|
||||
$panel-width-max: "400px + 3 * #{var.$block-spacing}";
|
||||
@@ -91,9 +90,6 @@ $panel-actual-width: min($panel-width, #{$panel-width-max});
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&+ button, &+ a.button {
|
||||
margin-left: var.$elem-spacing;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -141,15 +137,14 @@ $panel-actual-width: min($panel-width, #{$panel-width-max});
|
||||
&.map-control-icon {
|
||||
cursor: pointer;
|
||||
|
||||
.fa {
|
||||
@extend .fa-fw;
|
||||
.spot-icon {
|
||||
color: color.$default;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: color.$default-inv-bg;
|
||||
|
||||
.fa {
|
||||
.spot-icon {
|
||||
color: color.$default-inv;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
@use "fa/variables";
|
||||
@use "var";
|
||||
@use "color";
|
||||
|
||||
@@ -28,9 +27,15 @@
|
||||
display: inline-block;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
transform: translate(-50%, -50%);
|
||||
font-size: 2.5em;
|
||||
filter: drop-shadow(3px 3px 3px color.$over-img-shadow);
|
||||
|
||||
&.message {
|
||||
transform: translate(-50%, -100%);
|
||||
}
|
||||
|
||||
i {
|
||||
.spot-icon {
|
||||
transition: color 0.3s, text-shadow 0.3s;
|
||||
}
|
||||
}
|
||||
@@ -38,45 +43,37 @@
|
||||
|
||||
/* Icon Stack */
|
||||
|
||||
.icon-stack {
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
font-size: 32px;
|
||||
text-shadow: color.$over-img-shadow 3px 3px 3px;
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
font-size: 13px;
|
||||
.spot-icon-stack {
|
||||
&:not(.drill-icon) {
|
||||
font-size: 2.5em;
|
||||
filter: drop-shadow(3px 3px 3px color.$over-img-shadow);
|
||||
}
|
||||
|
||||
&.message {
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
.main {
|
||||
color: color.$message-flashy;
|
||||
}
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
.sub {
|
||||
color: color.$message;
|
||||
}
|
||||
}
|
||||
|
||||
&.media {
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
.main {
|
||||
color: color.$media-flashy;
|
||||
}
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
.sub {
|
||||
color: color.$media;
|
||||
}
|
||||
}
|
||||
|
||||
&.track {
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
font-size: 14px;
|
||||
top: 1px;
|
||||
}
|
||||
.#{variables.$fa-css-prefix}-track-start {
|
||||
.track-start {
|
||||
color: color.$track-start;
|
||||
}
|
||||
.#{variables.$fa-css-prefix}-track-end {
|
||||
.track-end {
|
||||
color: color.$track-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
@use "common";
|
||||
@use "var";
|
||||
@use "color";
|
||||
@use "fa";
|
||||
|
||||
#settings {
|
||||
#settings-panel {
|
||||
@@ -114,34 +113,49 @@
|
||||
}
|
||||
|
||||
&.newsletter {
|
||||
input#email {
|
||||
width: calc(100% - 6em);
|
||||
.newsletter-form {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
gap: var.$block-spacing;
|
||||
margin-bottom: var.$block-spacing;
|
||||
|
||||
&:disabled {
|
||||
color: color.$default-disabled;
|
||||
background: color.$default-bg-trans-disabled;
|
||||
input#email {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
|
||||
&:disabled {
|
||||
color: color.$default-disabled;
|
||||
background: color.$default-bg-trans-disabled;
|
||||
}
|
||||
}
|
||||
|
||||
button#nl_btn {
|
||||
flex: 0 0 auto;
|
||||
|
||||
&.loading {
|
||||
background-color: color.$message;
|
||||
color: color.$post-input-bg;
|
||||
span {
|
||||
@extend .flicker;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
button#nl_btn {
|
||||
margin-left: 1em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
&.subscribe .fa {
|
||||
@extend .fa-send;
|
||||
}
|
||||
&.unsubscribe .fa {
|
||||
@extend .fa-unsubscribe;
|
||||
}
|
||||
&.loading {
|
||||
background-color: color.$message;
|
||||
color: color.$post-input-bg;
|
||||
span {
|
||||
@extend .flicker;
|
||||
}
|
||||
&.admin {
|
||||
.admin-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: var.$block-spacing;
|
||||
|
||||
a.button {
|
||||
flex: 0 0 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,155 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// animating icons
|
||||
// --------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-beat {
|
||||
animation-name: #{variables.$fa-css-prefix}-beat;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, ease-in-out);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-bounce {
|
||||
animation-name: #{variables.$fa-css-prefix}-bounce;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, cubic-bezier(0.280, 0.840, 0.420, 1));
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-fade {
|
||||
animation-name: #{variables.$fa-css-prefix}-fade;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-beat-fade {
|
||||
animation-name: #{variables.$fa-css-prefix}-beat-fade;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, cubic-bezier(.4,0,.6,1));
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-flip {
|
||||
animation-name: #{variables.$fa-css-prefix}-flip;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, ease-in-out);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-shake {
|
||||
animation-name: #{variables.$fa-css-prefix}-shake;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, linear);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-spin {
|
||||
animation-name: #{variables.$fa-css-prefix}-spin;
|
||||
animation-delay: var(--#{variables.$fa-css-prefix}-animation-delay, 0s);
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 2s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, linear);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-spin-reverse {
|
||||
--#{variables.$fa-css-prefix}-animation-direction: reverse;
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-pulse,
|
||||
.#{variables.$fa-css-prefix}-spin-pulse {
|
||||
animation-name: #{variables.$fa-css-prefix}-spin;
|
||||
animation-direction: var(--#{variables.$fa-css-prefix}-animation-direction, normal);
|
||||
animation-duration: var(--#{variables.$fa-css-prefix}-animation-duration, 1s);
|
||||
animation-iteration-count: var(--#{variables.$fa-css-prefix}-animation-iteration-count, infinite);
|
||||
animation-timing-function: var(--#{variables.$fa-css-prefix}-animation-timing, steps(8));
|
||||
}
|
||||
|
||||
// if agent or operating system prefers reduced motion, disable animations
|
||||
// see: https://www.smashingmagazine.com/2020/09/design-reduced-motion-sensitivities/
|
||||
// see: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.#{variables.$fa-css-prefix}-beat,
|
||||
.#{variables.$fa-css-prefix}-bounce,
|
||||
.#{variables.$fa-css-prefix}-fade,
|
||||
.#{variables.$fa-css-prefix}-beat-fade,
|
||||
.#{variables.$fa-css-prefix}-flip,
|
||||
.#{variables.$fa-css-prefix}-pulse,
|
||||
.#{variables.$fa-css-prefix}-shake,
|
||||
.#{variables.$fa-css-prefix}-spin,
|
||||
.#{variables.$fa-css-prefix}-spin-pulse {
|
||||
animation-delay: -1ms;
|
||||
animation-duration: 1ms;
|
||||
animation-iteration-count: 1;
|
||||
transition-delay: 0s;
|
||||
transition-duration: 0s;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-beat {
|
||||
0%, 90% { transform: scale(1); }
|
||||
45% { transform: scale(var(--#{variables.$fa-css-prefix}-beat-scale, 1.25)); }
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-bounce {
|
||||
0% { transform: scale(1,1) translateY(0); }
|
||||
10% { transform: scale(var(--#{variables.$fa-css-prefix}-bounce-start-scale-x, 1.1),var(--#{variables.$fa-css-prefix}-bounce-start-scale-y, 0.9)) translateY(0); }
|
||||
30% { transform: scale(var(--#{variables.$fa-css-prefix}-bounce-jump-scale-x, 0.9),var(--#{variables.$fa-css-prefix}-bounce-jump-scale-y, 1.1)) translateY(var(--#{variables.$fa-css-prefix}-bounce-height, -0.5em)); }
|
||||
50% { transform: scale(var(--#{variables.$fa-css-prefix}-bounce-land-scale-x, 1.05),var(--#{variables.$fa-css-prefix}-bounce-land-scale-y, 0.95)) translateY(0); }
|
||||
57% { transform: scale(1,1) translateY(var(--#{variables.$fa-css-prefix}-bounce-rebound, -0.125em)); }
|
||||
64% { transform: scale(1,1) translateY(0); }
|
||||
100% { transform: scale(1,1) translateY(0); }
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-fade {
|
||||
50% { opacity: var(--#{variables.$fa-css-prefix}-fade-opacity, 0.4); }
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-beat-fade {
|
||||
0%, 100% {
|
||||
opacity: var(--#{variables.$fa-css-prefix}-beat-fade-opacity, 0.4);
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
transform: scale(var(--#{variables.$fa-css-prefix}-beat-fade-scale, 1.125));
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-flip {
|
||||
50% {
|
||||
transform: rotate3d(var(--#{variables.$fa-css-prefix}-flip-x, 0), var(--#{variables.$fa-css-prefix}-flip-y, 1), var(--#{variables.$fa-css-prefix}-flip-z, 0), var(--#{variables.$fa-css-prefix}-flip-angle, -180deg));
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-shake {
|
||||
0% { transform: rotate(-15deg); }
|
||||
4% { transform: rotate(15deg); }
|
||||
8%, 24% { transform: rotate(-18deg); }
|
||||
12%, 28% { transform: rotate(18deg); }
|
||||
16% { transform: rotate(-22deg); }
|
||||
20% { transform: rotate(22deg); }
|
||||
32% { transform: rotate(-12deg); }
|
||||
36% { transform: rotate(12deg); }
|
||||
40%, 100% { transform: rotate(0deg); }
|
||||
}
|
||||
|
||||
@keyframes #{variables.$fa-css-prefix}-spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// bordered + pulled icons
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-border {
|
||||
border-color: var(--#{variables.$fa-css-prefix}-border-color, #{variables.$fa-border-color});
|
||||
border-radius: var(--#{variables.$fa-css-prefix}-border-radius, #{variables.$fa-border-radius});
|
||||
border-style: var(--#{variables.$fa-css-prefix}-border-style, #{variables.$fa-border-style});
|
||||
border-width: var(--#{variables.$fa-css-prefix}-border-width, #{variables.$fa-border-width});
|
||||
padding: var(--#{variables.$fa-css-prefix}-border-padding, #{variables.$fa-border-padding});
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-pull-left {
|
||||
float: left;
|
||||
margin-right: var(--#{variables.$fa-css-prefix}-pull-margin, #{variables.$fa-pull-margin});
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-pull-right {
|
||||
float: right;
|
||||
margin-left: var(--#{variables.$fa-css-prefix}-pull-margin, #{variables.$fa-pull-margin});
|
||||
}
|
||||
@@ -1,78 +0,0 @@
|
||||
@use "mixins";
|
||||
@use "variables";
|
||||
|
||||
// base icon class definition
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix} {
|
||||
font-family: var(--#{variables.$fa-css-prefix}-style-family, '#{variables.$fa-style-family}');
|
||||
font-weight: var(--#{variables.$fa-css-prefix}-style, #{variables.$fa-style});
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix},
|
||||
.#{variables.$fa-css-prefix}-classic,
|
||||
.#{variables.$fa-css-prefix}-sharp,
|
||||
.fas,
|
||||
.#{variables.$fa-css-prefix}-solid,
|
||||
.far,
|
||||
.#{variables.$fa-css-prefix}-regular,
|
||||
.fasr,
|
||||
.fal,
|
||||
.#{variables.$fa-css-prefix}-light,
|
||||
.fasl,
|
||||
.fat,
|
||||
.#{variables.$fa-css-prefix}-thin,
|
||||
.fast,
|
||||
.fad,
|
||||
.#{variables.$fa-css-prefix}-duotone,
|
||||
.fass,
|
||||
.#{variables.$fa-css-prefix}-sharp-solid,
|
||||
.fab,
|
||||
.#{variables.$fa-css-prefix}-brands {
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
display: var(--#{variables.$fa-css-prefix}-display, #{variables.$fa-display});
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
line-height: 1;
|
||||
text-rendering: auto;
|
||||
}
|
||||
|
||||
.fas,
|
||||
.#{variables.$fa-css-prefix}-classic,
|
||||
.#{variables.$fa-css-prefix}-solid,
|
||||
.far,
|
||||
.#{variables.$fa-css-prefix}-regular,
|
||||
.fal,
|
||||
.#{variables.$fa-css-prefix}-light,
|
||||
.fat,
|
||||
.#{variables.$fa-css-prefix}-thin {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
}
|
||||
|
||||
.fab,
|
||||
.#{variables.$fa-css-prefix}-brands {
|
||||
font-family: 'Font Awesome 6 Brands';
|
||||
}
|
||||
|
||||
.fad,
|
||||
.#{variables.$fa-css-prefix}-classic.#{variables.$fa-css-prefix}-duotone,
|
||||
.#{variables.$fa-css-prefix}-duotone {
|
||||
font-family: 'Font Awesome 6 Duotone';
|
||||
}
|
||||
|
||||
.fass,
|
||||
.fasr,
|
||||
.fasl,
|
||||
.fast,
|
||||
.#{variables.$fa-css-prefix}-sharp {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
}
|
||||
.fass,
|
||||
.#{variables.$fa-css-prefix}-sharp {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
%fa-icon {
|
||||
@include mixins.fa-icon;
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
// specific duotone icon class definition
|
||||
// -------------------------
|
||||
|
||||
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */
|
||||
|
||||
|
||||
@each $name, $icon in $fa-icons {
|
||||
.fad.#{$fa-css-prefix}-#{$name}::after, .#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-#{$name}::after {
|
||||
content: unquote("\"#{ $icon }#{ $icon }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// fixed-width icons
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-fw {
|
||||
text-align: center;
|
||||
width: variables.$fa-fw-width;
|
||||
}
|
||||
@@ -1,59 +0,0 @@
|
||||
@use "sass:math";
|
||||
@use "sass:string";
|
||||
// functions
|
||||
// --------------------------
|
||||
|
||||
// fa-content: convenience function used to set content property
|
||||
@function fa-content($fa-var) {
|
||||
@return string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
|
||||
// fa-divide: Originally obtained from the Bootstrap https://github.com/twbs/bootstrap
|
||||
//
|
||||
// Licensed under: The MIT License (MIT)
|
||||
//
|
||||
// Copyright (c) 2011-2021 Twitter, Inc.
|
||||
// Copyright (c) 2011-2021 The Bootstrap Authors
|
||||
//
|
||||
// Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
// of this software and associated documentation files (the "Software"), to deal
|
||||
// in the Software without restriction, including without limitation the rights
|
||||
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
// copies of the Software, and to permit persons to whom the Software is
|
||||
// furnished to do so, subject to the following conditions:
|
||||
//
|
||||
// The above copyright notice and this permission notice shall be included in
|
||||
// all copies or substantial portions of the Software.
|
||||
//
|
||||
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
// THE SOFTWARE.
|
||||
|
||||
@function fa-divide($dividend, $divisor, $precision: 10) {
|
||||
$sign: if(sass($dividend > 0 and $divisor > 0): 1; else: -1);
|
||||
$dividend: math.abs($dividend);
|
||||
$divisor: math.abs($divisor);
|
||||
$quotient: 0;
|
||||
$remainder: $dividend;
|
||||
@if $dividend == 0 {
|
||||
@return 0;
|
||||
}
|
||||
@if $divisor == 0 {
|
||||
@error "Cannot divide by 0";
|
||||
}
|
||||
@if $divisor == 1 {
|
||||
@return $dividend;
|
||||
}
|
||||
@while $remainder >= $divisor {
|
||||
$quotient: $quotient + 1;
|
||||
$remainder: $remainder - $divisor;
|
||||
}
|
||||
@if $remainder > 0 and $precision > 0 {
|
||||
$remainder: fa-divide($remainder * 10, $divisor, $precision - 1) * .1;
|
||||
}
|
||||
@return ($quotient + $remainder) * $sign;
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
// specific icon class definition
|
||||
// -------------------------
|
||||
|
||||
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
|
||||
readers do not read off random characters that represent icons */
|
||||
|
||||
@each $name, $icon in $fa-icons {
|
||||
.#{$fa-css-prefix}-#{$name}::before { content: unquote("\"#{ $icon }\""); }
|
||||
}
|
||||
|
||||
@@ -1,20 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// icons in a list
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-ul {
|
||||
list-style-type: none;
|
||||
margin-left: var(--#{variables.$fa-css-prefix}-li-margin, #{variables.$fa-li-margin});
|
||||
padding-left: 0;
|
||||
|
||||
> li { position: relative; }
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-li {
|
||||
left: calc(var(--#{variables.$fa-css-prefix}-li-width, #{variables.$fa-li-width}) * -1);
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: var(--#{variables.$fa-css-prefix}-li-width, #{variables.$fa-li-width});
|
||||
line-height: inherit;
|
||||
}
|
||||
@@ -1,152 +0,0 @@
|
||||
@use "sass:string";
|
||||
@use "functions";
|
||||
@use "variables";
|
||||
|
||||
// mixins
|
||||
// --------------------------
|
||||
|
||||
// base rendering for an icon
|
||||
@mixin fa-icon {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
display: inline-block;
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
// sets relative font-sizing and alignment (in _sizing)
|
||||
@mixin fa-size ($font-size) {
|
||||
font-size: functions.fa-divide($font-size, variables.$fa-size-scale-base) * 1em; // converts step in sizing scale into an em-based value that's relative to the scale's base
|
||||
line-height: functions.fa-divide(1, $font-size) * 1em; // sets the line-height of the icon back to that of it's parent
|
||||
vertical-align: (functions.fa-divide(6, $font-size) - functions.fa-divide(3, 8)) * 1em; // vertically centers the icon taking into account the surrounding text's descender
|
||||
}
|
||||
|
||||
// only display content to screen readers
|
||||
// see: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
|
||||
// see: https://hugogiraudel.com/2016/10/13/css-hide-and-seek/
|
||||
@mixin fa-sr-only() {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
// use in conjunction with .sr-only to only display content when it's focused
|
||||
@mixin fa-sr-only-focusable() {
|
||||
&:not(:focus) {
|
||||
@include fa-sr-only();
|
||||
}
|
||||
}
|
||||
|
||||
// sets a specific icon family to use alongside style + icon mixins
|
||||
@mixin fa-family-classic() {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
}
|
||||
|
||||
@mixin fa-family-sharp() {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
}
|
||||
|
||||
// convenience mixins for declaring pseudo-elements by CSS variable,
|
||||
// including all style-specific font properties, and both the ::before
|
||||
// and ::after elements in the duotone case.
|
||||
@mixin fa-icon-solid($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-solid;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-regular($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-regular;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-light($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-light;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-thin($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-thin;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-duotone($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-duotone;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
&::after {
|
||||
content: string.unquote("\"#{ $fa-var }#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-sharp-solid($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-sharp-solid;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-sharp-regular($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-sharp-regular;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-sharp-light($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-sharp-light;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-sharp-thin($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-sharp-thin;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fa-icon-brands($fa-var) {
|
||||
@extend %fa-icon;
|
||||
@extend .fa-brands;
|
||||
|
||||
&::before {
|
||||
content: string.unquote("\"#{ $fa-var }\"");
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,33 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// rotating + flipping icons
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-rotate-90 {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-rotate-180 {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-rotate-270 {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-flip-horizontal {
|
||||
transform: scale(-1, 1);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-flip-vertical {
|
||||
transform: scale(1, -1);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-flip-both,
|
||||
.#{variables.$fa-css-prefix}-flip-horizontal.#{variables.$fa-css-prefix}-flip-vertical {
|
||||
transform: scale(-1, -1);
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-rotate-by {
|
||||
transform: rotate(var(--#{variables.$fa-css-prefix}-rotate-angle, none));
|
||||
}
|
||||
@@ -1,14 +0,0 @@
|
||||
// screen-reader utilities
|
||||
// -------------------------
|
||||
|
||||
// only display content to screen readers
|
||||
.sr-only,
|
||||
.#{$fa-css-prefix}-sr-only {
|
||||
@include fa-sr-only;
|
||||
}
|
||||
|
||||
// use in conjunction with .sr-only to only display content when it's focused
|
||||
.sr-only-focusable,
|
||||
.#{$fa-css-prefix}-sr-only-focusable {
|
||||
@include fa-sr-only-focusable;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,19 +0,0 @@
|
||||
@use "mixins";
|
||||
@use "variables";
|
||||
|
||||
// sizing icons
|
||||
// -------------------------
|
||||
|
||||
// literal magnification scale
|
||||
@for $i from 1 through 10 {
|
||||
.#{variables.$fa-css-prefix}-#{$i}x {
|
||||
font-size: $i * 1em;
|
||||
}
|
||||
}
|
||||
|
||||
// step-based scale (with alignment)
|
||||
@each $size, $value in variables.$fa-sizes {
|
||||
.#{variables.$fa-css-prefix}-#{$size} {
|
||||
@include mixins.fa-size($value);
|
||||
}
|
||||
}
|
||||
@@ -1,34 +0,0 @@
|
||||
@use "variables";
|
||||
|
||||
// stacking icons
|
||||
// -------------------------
|
||||
|
||||
.#{variables.$fa-css-prefix}-stack {
|
||||
display: inline-block;
|
||||
height: 2em;
|
||||
line-height: 2em;
|
||||
position: relative;
|
||||
vertical-align: variables.$fa-stack-vertical-align;
|
||||
width: variables.$fa-stack-width;
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-stack-1x,
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
z-index: var(--#{variables.$fa-css-prefix}-stack-z-index, #{variables.$fa-stack-z-index});
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-stack-1x {
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-stack-2x {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.#{variables.$fa-css-prefix}-inverse {
|
||||
color: var(--#{variables.$fa-css-prefix}-inverse, #{variables.$fa-inverse});
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,30 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-brands: 'Font Awesome 6 Brands';
|
||||
--#{$fa-css-prefix}-font-brands: normal 400 1em/1 'Font Awesome 6 Brands';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Brands';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fab,
|
||||
.#{$fa-css-prefix}-brands {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@each $name, $icon in $fa-brand-icons {
|
||||
.#{$fa-css-prefix}-#{$name}:before { content: unquote("\"#{ $icon }\""); }
|
||||
}
|
||||
@@ -1,65 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-duotone: 'Font Awesome 6 Duotone';
|
||||
--#{$fa-css-prefix}-font-duotone: normal 900 1em/1 'Font Awesome 6 Duotone';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Duotone';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-duotone-900.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-duotone-900.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fad,
|
||||
.#{$fa-css-prefix}-duotone {
|
||||
position: relative;
|
||||
font-weight: 900;
|
||||
letter-spacing: normal;
|
||||
}
|
||||
|
||||
.fad::before,
|
||||
.#{$fa-css-prefix}-duotone::before {
|
||||
position: absolute;
|
||||
color: var(--#{$fa-css-prefix}-primary-color, inherit);
|
||||
opacity: var(--#{$fa-css-prefix}-primary-opacity, #{$fa-primary-opacity});
|
||||
}
|
||||
|
||||
.fad::after,
|
||||
.#{$fa-css-prefix}-duotone::after {
|
||||
color: var(--#{$fa-css-prefix}-secondary-color, inherit);
|
||||
opacity: var(--#{$fa-css-prefix}-secondary-opacity, #{$fa-secondary-opacity});
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-swap-opacity .fad::before,
|
||||
.#{$fa-css-prefix}-swap-opacity .fa-duotone::before,
|
||||
.fad.#{$fa-css-prefix}-swap-opacity::before,
|
||||
.fa-duotone.#{$fa-css-prefix}-swap-opacity::before {
|
||||
opacity: var(--#{$fa-css-prefix}-secondary-opacity, #{$fa-secondary-opacity});
|
||||
}
|
||||
|
||||
.#{$fa-css-prefix}-swap-opacity .fad::after,
|
||||
.#{$fa-css-prefix}-swap-opacity .fa-duotone::after,
|
||||
.fad.#{$fa-css-prefix}-swap-opacity::after,
|
||||
.fa-duotone.#{$fa-css-prefix}-swap-opacity::after {
|
||||
opacity: var(--#{$fa-css-prefix}-primary-opacity, #{$fa-primary-opacity});
|
||||
}
|
||||
|
||||
.fad.#{$fa-css-prefix}-inverse,
|
||||
.#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-inverse {
|
||||
color: var(--#{$fa-css-prefix}-inverse, $fa-inverse);
|
||||
}
|
||||
|
||||
.fad.#{$fa-css-prefix}-stack-1x, .fad.#{$fa-css-prefix}-stack-2x,
|
||||
.#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-stack-1x, .#{$fa-css-prefix}-duotone.#{$fa-css-prefix}-stack-2x {
|
||||
position: absolute;
|
||||
}
|
||||
Vendored
-21
@@ -1,21 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
// Font Awesome core compile (Web Fonts-based)
|
||||
// -------------------------
|
||||
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'core';
|
||||
@import 'sizing';
|
||||
@import 'fixed-width';
|
||||
@import 'list';
|
||||
@import 'bordered-pulled';
|
||||
@import 'animated';
|
||||
@import 'rotated-flipped';
|
||||
@import 'stacked';
|
||||
@import 'icons';
|
||||
@import 'screen-reader';
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-classic: '#{ $fa-style-family }';
|
||||
--#{$fa-css-prefix}-font-light: normal 300 1em/1 '#{ $fa-style-family }';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-light-300.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-light-300.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fal,
|
||||
.#{$fa-css-prefix}-light {
|
||||
font-weight: 300;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-classic: '#{ $fa-style-family }';
|
||||
--#{$fa-css-prefix}-font-regular: normal 400 1em/1 '#{ $fa-style-family }';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.far,
|
||||
.#{$fa-css-prefix}-regular {
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-sharp: 'Font Awesome 6 Sharp';
|
||||
--#{$fa-css-prefix}-font-sharp-light: normal 300 1em/1 'Font Awesome 6 Sharp';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-sharp-light-300.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-sharp-light-300.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fasl,
|
||||
.#{$fa-css-prefix}-light {
|
||||
font-weight: 300;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-sharp: 'Font Awesome 6 Sharp';
|
||||
--#{$fa-css-prefix}-font-sharp-regular: normal 400 1em/1 'Font Awesome 6 Sharp';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-sharp-regular-400.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-sharp-regular-400.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fasr,
|
||||
.#{$fa-css-prefix}-regular {
|
||||
font-weight: 400;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-sharp: 'Font Awesome 6 Sharp';
|
||||
--#{$fa-css-prefix}-font-sharp-solid: normal 900 1em/1 'Font Awesome 6 Sharp';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-sharp-solid-900.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-sharp-solid-900.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fass,
|
||||
.#{$fa-css-prefix}-solid {
|
||||
font-weight: 900;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-sharp: 'Font Awesome 6 Sharp';
|
||||
--#{$fa-css-prefix}-font-sharp-thin: normal 100 1em/1 'Font Awesome 6 Sharp';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-sharp-thin-100.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-sharp-thin-100.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fast,
|
||||
.#{$fa-css-prefix}-thin {
|
||||
font-weight: 100;
|
||||
}
|
||||
@@ -1,27 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@use 'functions';
|
||||
@forward 'variables' show $fa-css-prefix, $fa-font-path;
|
||||
@use 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{variables.$fa-css-prefix}-style-family-classic: '#{ variables.$fa-style-family }';
|
||||
--#{variables.$fa-css-prefix}-font-solid: normal 900 1em/1 '#{ variables.$fa-style-family }';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 900;
|
||||
font-display: variables.$fa-font-display;
|
||||
src: url('#{variables.$fa-font-path}/fa-solid-900.woff2') format('woff2'),
|
||||
url('#{variables.$fa-font-path}/fa-solid-900.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fas,
|
||||
.#{variables.$fa-css-prefix}-solid {
|
||||
font-weight: 900;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
|
||||
:root, :host {
|
||||
--#{$fa-css-prefix}-style-family-classic: '#{ $fa-style-family }';
|
||||
--#{$fa-css-prefix}-font-thin: normal 100 1em/1 '#{ $fa-style-family }';
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Font Awesome 6 Pro';
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
font-display: $fa-font-display;
|
||||
src: url('#{$fa-font-path}/fa-thin-100.woff2') format('woff2'),
|
||||
url('#{$fa-font-path}/fa-thin-100.ttf') format('truetype');
|
||||
}
|
||||
|
||||
.fat,
|
||||
.#{$fa-css-prefix}-thin {
|
||||
font-weight: 100;
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
/*!
|
||||
* Font Awesome Pro 6.5.0 by @fontawesome - https://fontawesome.com
|
||||
* License - https://fontawesome.com/license (Commercial License)
|
||||
* Copyright 2023 Fonticons, Inc.
|
||||
*/
|
||||
// V4 shims compile (Web Fonts-based)
|
||||
// -------------------------
|
||||
|
||||
@import 'functions';
|
||||
@import 'variables';
|
||||
@import 'shims';
|
||||
Binary file not shown.
Binary file not shown.
@@ -1,6 +1,5 @@
|
||||
/* Site Global CSS */
|
||||
@use "sass:meta";
|
||||
@use 'fonts';
|
||||
@use 'common';
|
||||
|
||||
/* Modules */
|
||||
|
||||
Reference in New Issue
Block a user