apps/sipp/server/static/styles.css 1.1 K raw
1
/* sipp — app-specific styles.
2
 * Shared reset / tokens / components come from /assets/darkmatter.css.
3
 */
4
5
/* Logo wraps an h1 in sipp markup. */
6
7
.logo h1 {
8
  font-size: 28px;
9
  font-weight: 700;
10
  text-transform: uppercase;
11
}
12
13
/* Snippet icon links */
14
15
.icon {
16
  display: flex;
17
  align-items: center;
18
  justify-content: center;
19
  color: #878787;
20
  width: 24px;
21
  height: 24px;
22
}
23
24
.icon svg {
25
  width: 24px;
26
  height: 24px;
27
}
28
29
.icon svg path {
30
  fill: #878787;
31
}
32
33
.icon:hover svg path {
34
  fill: #ffffff;
35
}
36
37
/* Create-snippet form */
38
39
#snippetForm {
40
  display: flex;
41
  flex-direction: column;
42
  gap: 1rem;
43
  width: 100%;
44
}
45
46
#snippetName {
47
  font-size: 14px;
48
  opacity: 0.7;
49
}
50
51
/* Highlighted snippet viewer */
52
53
.code-container {
54
  border: 1px solid #ffffff;
55
  height: 400px;
56
  overflow: auto;
57
  -webkit-overflow-scrolling: touch;
58
}
59
60
.code-container pre {
61
  background-color: #121113 !important;
62
  padding: 6px;
63
  margin: 0;
64
  min-height: 100%;
65
  font-size: 13px;
66
  line-height: 1.4;
67
  border: none;
68
}
69
70
/* Viewer action row */
71
72
.button-group {
73
  display: flex;
74
  gap: 0.5rem;
75
  flex-wrap: wrap;
76
}
77