KevinMidboe/brewpi
1
0
Fork 0
mirror of https://github.com/KevinMidboe/brewPi.git synced 2025-10-29 08:40:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

.link animated style on hover & --orange

Browse Source
This commit is contained in:
Kevin
2023-08-27 13:55:20 +02:00
parent b34b18ad37
commit 2da44956be
2 changed files with 21 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/styles/global.css
View File

@@ -6,6 +6,7 @@
--text-color: black; --text-color: black;
--red: #ff97a3; --red: #ff97a3;
--blue: #9ad9ff; --blue: #9ad9ff;
--orange: orange;
--green: #19a786; --green: #19a786;
--header-height: 80px; --header-height: 80px;
@@ -39,6 +40,21 @@ a {
text-decoration: inherit; /* no underline */ text-decoration: inherit; /* no underline */
} }
a.link {
--color-text: white;
text-decoration: none;
transition: all 0.3s ease;
-webkit-transition: -webkit-transform 0.15s linear;
transition: transform 0.15s linear;
-webkit-transform-origin: 50% 80%;
transform-origin: 50% 80%;
border-bottom: 2px solid var(--green);
}
a.link:hover {
border-color: white;
transform: skew(-15deg);
}
ul, ul,
li { li {
margin: 0; margin: 0;

10
src/styles/media-queries.scss
View File

@@ -1,14 +1,14 @@
$tablet-width: 1200px; $tablet-width: 1200px;
$mobile-width: 768px; $mobile-width: 768px;
@mixin tablet { @mixin mobile {
@media (min-width: #{$mobile-width}) { @media (max-width: #{$mobile-width}) {
@content; @content;
} }
} }
@mixin mobile { @mixin tablet {
@media (max-width: #{$mobile-width}) { @media (min-width: #{$mobile-width}) {
@content; @content;
} }
} }
@@ -29,4 +29,4 @@ $mobile-width: 768px;
@include tablet { @include tablet {
display: none !important; display: none !important;
} }
} }