style.css (view raw)
1/* App layout */
2
3#editor,
4#footer,
5#copy,
6#progress {
7 position: absolute;
8 left: 0;
9 right: 0;
10}
11
12#editor {
13 top: 0;
14 bottom: 46px;
15}
16.readonly #editor {
17 bottom: 0;
18}
19
20.CodeMirror {
21 height: 100%;
22 font-size: 14px;
23 font-family: JetBrainsMono, sans-serif;
24}
25
26#footer,
27#copy {
28 bottom: 0;
29 height: 38px;
30 padding: 8px 8px 0;
31 background-color: #3b3b47;
32 display: flex;
33 flex-wrap: wrap;
34}
35#footer > *,
36#copy > * {
37 margin: 0 6px;
38}
39
40.readonly #footer {
41 display: none;
42}
43
44#progress {
45 top: 0;
46 height: 3px;
47 background: #ff79c6;
48 z-index: 5;
49 width: 0;
50}
51
52#copy-link {
53 font-family: JetBrainsMono, sans-serif;
54}
55
56.grow {
57 flex-grow: 1;
58}
59
60/* Form elements */
61
62.ss-main {
63 max-width: 300px;
64 width: calc(100% - 150px);
65 font-family: sans-serif;
66}
67
68.ss-main .ss-single-selected,
69button,
70input[type='text'],
71input[type='search'] {
72 height: 28px;
73 background-color: #3b3b47 !important;
74 color: #fff !important;
75 border-radius: 2px !important;
76 border: 1px solid #ccc !important;
77 font-size: 14px !important;
78}
79input[type='text'],
80input[type='search'] {
81 height: 26px !important;
82 padding: 0 5px;
83}
84input::-moz-selection {
85 background-color: rgba(90, 95, 128, 0.99);
86}
87input::selection {
88 background-color: rgba(90, 95, 128, 0.99);
89}
90button {
91 cursor: pointer;
92 padding: 4px 8px;
93}
94button:hover {
95 background-color: rgba(255, 255, 255, 0.1) !important;
96}
97.ss-content {
98 background-color: #282936;
99 color: #dedede;
100 font-size: 14px;
101}
102.ss-content .ss-disabled {
103 background-color: #3b3b47 !important;
104}
105
106/* Fonts */
107@font-face {
108 font-family: 'JetBrainsMono';
109 src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Regular.woff2')
110 format('woff2'),
111 url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Regular.woff') format('woff'),
112 url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/ttf/JetBrainsMono-Regular.ttf') format('truetype');
113 font-weight: 400;
114 font-style: normal;
115}