settel/knowyt
1
0
Fork 0
Code Issues Pull Requests Packages Releases Activity

feat: add hover effect to QuoteCardNew

Browse Source
This commit is contained in:
Settel 2022-08-11 20:19:42 +02:00
parent f5ed80feb5
commit fba11d6855
2 changed files with 9 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
client/src/assets/css/colors.scss
View File

@ -48,6 +48,9 @@ $quote-text-color: #384048;
$quote-new-background-color: none; $quote-new-background-color: none;
$quote-new-border: 5px dashed #ffffff; $quote-new-border: 5px dashed #ffffff;
$quote-new-text-color: #ffffff; $quote-new-text-color: #ffffff;
$quote-new-hover-background-color: lighten($background-primary-color, 10%);
$quote-new-hover-border: $quote-new-border;
$quote-new-hover-text-color: $quote-new-text-color;
// Quote Button // Quote Button
$quote-button-background-color: #00a0e0; $quote-button-background-color: #00a0e0;

6
client/src/components/QuoteCardNew.vue
View File

@ -25,6 +25,12 @@ const newQuote = () => useEngine().createQuote('something is going to happen')
border: $quote-new-border; border: $quote-new-border;
border-radius: 0 16px 0 0; border-radius: 0 16px 0 0;
cursor: pointer; cursor: pointer;
&:hover {
background-color: $quote-new-hover-background-color;
border: $quote-new-hover-border;
color: $quote-new-hover-text-color;
}
} }
&__new { &__new {