docs/style.css at main · hackutd/docs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
/* HackUTD docs theme */

@import url('https://api.fontshare.com/v2/css?f[]=satoshi@300,400,500,700,900&display=swap');

:root {
  --hackutd-gradient: radial-gradient(
    119.34% 84.58% at 6.07% 6.94%,
    #f4f4f4 23.56%,
    #ffa21f 43.27%,
    #ff491b 60.58%,
    #ff005e 80.77%,
    #6c17fe 100%
  );
  --font-family-sans: 'Satoshi', ui-sans-serif, system-ui, -apple-system,
    'Segoe UI', sans-serif;
}

/* Apply Satoshi across the site */
html,
body,
button,
input,
select,
textarea,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-family-sans) !important;
}

/* Brand gradient wash behind page content (light mode) */
body {
  background-image: var(--hackutd-gradient);
  background-attachment: fixed;
  background-size: cover;
}

/* Dark mode: keep a dark base so content and the white logo stay readable,
   with a subtle brand glow */
html.dark body,
[data-theme='dark'] body {
  background-color: #0a0a0a;
  background-image: radial-gradient(
    119.34% 84.58% at 6.07% 6.94%,
    rgba(255, 162, 31, 0.18) 0%,
    rgba(255, 73, 27, 0.16) 35%,
    rgba(255, 0, 94, 0.16) 60%,
    rgba(108, 23, 254, 0.2) 100%
  );
  background-attachment: fixed;
  background-size: cover;
}

/* Brand button (e.g. external links to live apps) */
a.brand-button {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.625rem 1.25rem;
  border-radius: 0.75rem;
  font-weight: 600;
  color: #ffffff !important;
  text-decoration: none !important;
  background: #ff005e;
  transition: background 0.15s ease;
}

a.brand-button:hover {
  background: #e60054;
}

/* Cards: branded hover accent */
a[class*='card']:hover,
.card:hover {
  border-color: #ff491b;
  box-shadow: 0 8px 30px -12px rgba(255, 73, 27, 0.35);
}