an app to share curated trails
sidetrail.app
atproto
nextjs
react
rsc
1.BackButton {
2 background: none;
3 border: none;
4 padding: 0.5rem 0;
5 font-family: inherit;
6 text-decoration: none;
7 color: #666;
8 font-size: 0.875rem;
9 transition: all 0.2s ease;
10 text-transform: lowercase;
11 cursor: pointer;
12 display: block;
13 width: 100%;
14 text-align: center;
15}
16
17@media (hover: hover) {
18 .BackButton:hover {
19 color: var(--accent-color);
20 }
21}
22
23.BackButton:active {
24 color: var(--accent-color);
25 transition-duration: 0.05s;
26}
27
28.BackButton-top {
29 width: 100%;
30 align-self: center;
31 padding-top: 2.5rem;
32 transition:
33 background 0.2s ease,
34 text-decoration 0.2s ease;
35}
36
37@media (hover: hover) {
38 .BackButton-top:hover {
39 background: linear-gradient(
40 to bottom,
41 color-mix(in srgb, var(--accent-color) 12%, transparent),
42 transparent
43 );
44 text-decoration: underline;
45 text-decoration-color: var(--accent-color);
46 }
47}
48
49.BackButton-top:active {
50 text-decoration: underline;
51 text-decoration-color: var(--accent-color);
52 transition-duration: 0.05s;
53}