aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/styles/theme.css
blob: ee7a2e612dd363f4f4fc77663ceb0a3d8c9b98ba (plain) (blame)
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
:root {
    --ns-primary: #0063AB;
    --ns-primary-25: rgba(0, 99, 171, 0.25);
    --ns-primary-50: rgba(0, 99, 171, 0.5);
    --ns-accent: #00a8e8;
    --ns-bg: #003459;
    --ns-bg-light-30: rgba(0, 152, 189, 0.3);
    --ns-bg-dark-100: rgba(0, 65, 101, 1.0);
    --ns-bg-dark-50: rgba(0, 65, 101, 0.5);
    --offwhite: #dfd7d7;
    --ns-warn: #f9b7b7;
    --ns-alt: #002b49;
}

body {
    /*background-image: url('/assets/images/add_model_background.jpg');*/
    background-color: var(--ns-bg);
}

.bg-light {
    background-color: var(--ns-bg-light-30) !important;
}

.bg-alt {
    background-color: var(--ns-alt);
}

.ns-border-primary {
    border: 1px solid var(--ns-primary);
}

.ns-bg-dark-50 {
    background-color: var(--ns-bg-dark-50) !important;
}

.ns-bg-dark-100 {
    background-color: var(--ns-bg-dark-100) !important;
}

a {
    color: var(--ns-primary) !important;
}

.text-offwhite {
    color: var(--offwhite) !important;
}

.highlight {
    color: var(--ns-accent);
}


/* Ripple effect */

.bubble {
    background-position: center;
    transition: background 0.2s;
}

.bubble:hover {
    background: var(--ns-primary-50) radial-gradient(circle, transparent 1%, var(--ns-accent) 1%) center/15000%;
}

.bubble:active {
    background-color: #6eb9f7;
    background-size: 100%;
    transition: background 0s;
}