Squashed commit of the following:

commit 4d88df1c381c4136cfe4780b6b5464d9c984bb31
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Wed Oct 30 14:24:53 2024 -0400

    fixing active/focus states

commit 630f74db6365625af210de81d577d43945f62df4
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Wed Oct 23 13:25:14 2024 -0400

    sign-up/login/debug menu updates

commit f85ef1c58e367219923c46aeebe77d1aa846b6f3
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Tue Oct 15 13:56:36 2024 -0400

    more color standardization

commit cd2ee3350fc51016cc75fb799debeefa0b1d9b64
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Tue Oct 15 13:39:02 2024 -0400

    updates per comments

commit e91371522bb9a6dae5c6d02eb6f16f0b632f7a24
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Fri Oct 4 14:25:45 2024 -0400

    class selection active state

commit 4fcdca1eb07eb67aacd84feb1c9357d52fd6f23f
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Thu Oct 3 14:31:00 2024 -0400

    fixing a few more buttons

commit 475e21aae7733cfa072f828c559cc0930f0ad878
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Wed Oct 2 15:57:25 2024 -0400

    line-heights converted to unitless multipliers

commit c5dca257274a60b02e1f12e3c6daf103cec53096
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Fri Sep 27 13:48:20 2024 -0400

    second pass

commit 685f4d4d64b8b234afbb702d1b8a52d4670d3825
Author: CuriousMagpie <eilatan@gmail.com>
Date:   Thu Sep 26 16:58:59 2024 -0400

    first pass
This commit is contained in:
Kalista Payne
2024-11-21 12:37:02 -06:00
parent 529f856ab9
commit a36114e904
16 changed files with 234 additions and 115 deletions

View File

@@ -186,7 +186,7 @@
</div>
<div class="donate-button">
<button
class="button btn-contribute"
class="btn button btn-secondary btn-contribute"
@click="donate()"
>
<div class="text">
@@ -309,7 +309,7 @@
<div class="my-2">
Time Traveling! It is {{ new Date().toLocaleDateString() }}
<a
class="btn btn-warning btn-small"
class="btn btn-small"
@click="resetTime()"
>
Reset
@@ -341,7 +341,7 @@
</button>
<div
v-if="debugMenuShown"
class="debug-toggle debug-group"
class="btn debug-toggle debug-group"
>
<div class="debug-pop">
<a
@@ -512,7 +512,14 @@ li {
grid-area: debug-pop;
}
.time-travel { grid-area: time-travel;}
.time-travel {
grid-area: time-travel;
a:hover {
text-decoration: none !important;
}
}
footer {
background-color: $gray-500;
@@ -584,42 +591,65 @@ h3 {
}
.debug {
margin-top: 16px;
border: 2px solid transparent;
box-shadow: 0 1px 3px 0 rgba($black, 0.12), 0 1px 2px 0 rgba($black, 0.24);
display: flex;
justify-content: center;
margin-top: 16px;
padding: 2px 12px;
&:hover {
box-shadow: 0 3px 6px 0 rgba($black, 0.12), 0 3px 6px 0 rgba($black, 0.24);
}
&:focus {
border: 2px solid $purple-400 !important;
box-shadow: 0 3px 6px 0 rgba($black, 0.12), 0 3px 6px 0 rgba($black, 0.24);
}
:active {
border: 2px solid $purple-600 !important;
box-shadow: none;
}
}
.debug-group {
border-radius: 4px;
padding: 16px;
box-shadow: 0 1px 3px 0 rgba(26, 24, 29, 0.12), 0 1px 2px 0 rgba(26, 24, 29, 0.24);
font-weight: 700;
background-color: $gray-600;
border: 2px solid transparent;
border-radius: 4px;
box-shadow: 0 1px 3px 0 rgba($black, 0.12), 0 1px 2px 0 rgba($black, 0.24);
font-weight: 700;
padding: 8px 16px;
.btn {
margin: 2px;
}
a:hover {
border: 2px solid transparent;
box-shadow: 0 1px 3px 0 rgba($black, 0.12), 0 1px 2px 0 rgba($black, 0.24);
text-decoration: none !important;
}
}
.btn-small {
background-color: $maroon-100;
border: 2px solid transparent;
color: $white !important;
line-height: 18px;
&:hover {
background-color: $maroon-100;
text-decoration: none !important;
border: 2px solid $maroon-100;
}
}
.btn-secondary {
padding: 2px 12px;
}
.btn-secondary a:hover {
text-decoration: none !important;
}
.btn-contribute {
background: $white;
border-radius: 2px;
width: 175px;
height: 32px;
color: $gray-50;
text-align: center;
vertical-align: middle;
padding: 0;
margin: 0;
&:hover {
color:$purple-300;
box-shadow: 0 3px 6px 0 rgba(26, 24, 29, 0.16), 0 3px 6px 0 rgba(26, 24, 29, 0.24);
&:active:not(:disabled) {
color:$purple-300;
border: 1px solid $purple-400;
box-shadow: 0 3px 6px 0 rgba(26, 24, 29, 0.16), 0 3px 6px 0 rgba(26, 24, 29, 0.24);
}
}
border: 2px solid transparent;
a {
display: flex;