]> jfr.im git - irc/unrealircd/unrealircd-webpanel.git/blame - css/unrealircd-admin.css
Move user functionality fully into the base
[irc/unrealircd/unrealircd-webpanel.git] / css / unrealircd-admin.css
CommitLineData
709b97f3 1.unrealircd_overview {
371aa651
VP
2 font-family: arial, sans-serif;
3 border-collapse: collapse;
4 border-radius: 7px;
5 width: 25%;
6 box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
82f5bcbf 7}
5cc8ca4a 8
d843c1de
VP
9.badge-pill {
10 box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
11}
12
d1d9caa9
VP
13.curvy {
14 border-radius: 7px;
0d846731 15 margin: 2px;
d1d9caa9
VP
16}
17
62d4ea03 18
d1d9caa9
VP
19.short-form-control {
20 width: 70%;
21}
22
5cc8ca4a 23
35ccb286 24.align_right {
371aa651
VP
25 width: 10px;
26 text-align: right;
35ccb286
VP
27}
28
35ccb286 29.input_text {
371aa651 30 border-radius: 7px;
35ccb286 31}
1d7e7ff8 32
4d834e71 33.filter-fields {
371aa651
VP
34 height: 30px;
35 width: 400px;
36 padding: 5px 5px;
37 margin: 8px 0;
38 border-radius: 7px;
4d834e71
VP
39}
40
35ccb286
VP
41
42.align_label {
371aa651
VP
43 width: 80px;
44 display: inline-block;
45 text-align: right;
35ccb286
VP
46}
47
809f7483
VP
48body {
49 padding-bottom: 120px;
50}
51footer {
52 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
53 position: absolute;
54 bottom: 0;
55 width: 100%;
56 height: 55px;
57 }
26971737 58
709b97f3 59.topnav {
371aa651
VP
60 background-color: #333;
61 overflow: hidden;
62 font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
c8ac611d 63
709b97f3
VP
64}
65
66/* Style the links inside the navigation bar */
67.topnav a {
371aa651
VP
68 float: left;
69 color: #f2f2f2;
70 text-align: center;
71 padding: 14px 16px;
72 text-decoration: none;
73 font-size: 17px;
709b97f3
VP
74}
75
709b97f3 76
82f5bcbf 77body {
911a6472 78 padding-top: 45px;
7e8dc7cb 79 background-image: url("../img/background.jpg");
371aa651
VP
80 display: flex;
81 flex-direction: column;
76200e36
VP
82}
83
2fba9a82 84
ca8cae9d
VP
85.alert-short {
86 width: 40%;
87}
88
89/* The close button */
90.closebtn {
91 color: black;
92 font-weight: bold;
93 float: right;
94 font-size: 22px;
95 line-height: 20px;
96 cursor: pointer;
97 transition: 0.3s;
98}
99
100
2fba9a82 101.checkbox-dropdown {
371aa651
VP
102 width: 200px;
103 border: 1px solid #aaa;
104 padding: 10px;
105 position: relative;
106 margin: 0 auto;
107
108 user-select: first;
2fba9a82
VP
109}
110
111/* Display CSS arrow to the right of the dropdown text */
112.checkbox-dropdown:after {
371aa651
VP
113 content:'';
114 height: 0;
115 position: absolute;
116 width: 0;
117 border: 6px solid transparent;
118 border-top-color: #000;
119 top: 50%;
120 right: 10px;
121 margin-top: -3px;
2fba9a82
VP
122}
123
124/* Reverse the CSS arrow when the dropdown is active */
125.checkbox-dropdown.is-active:after {
371aa651
VP
126 border-bottom-color: #000;
127 border-top-color: #fff;
128 margin-top: -9px;
2fba9a82
VP
129}
130
131.checkbox-dropdown-list {
371aa651
VP
132 list-style: none;
133 margin: 0;
134 padding: 0;
135 position: absolute;
136 top: 100%; /* align the dropdown right below the dropdown text */
137 border: inherit;
138 border-top: none;
139 left: -1px; /* align the dropdown to the left */
140 right: -1px; /* align the dropdown to the right */
141 opacity: 0; /* hide the dropdown */
2fba9a82 142
371aa651
VP
143 transition: opacity 0.4s ease-in-out;
144 height: 100px;
145 overflow: scroll;
146 overflow-x: hidden;
147 pointer-events: none; /* avoid mouse click events inside the dropdown */
2fba9a82
VP
148}
149.is-active .checkbox-dropdown-list {
371aa651
VP
150 opacity: 1; /* display the dropdown */
151 pointer-events: auto; /* make sure that the user still can select checkboxes */
2fba9a82
VP
152}
153
154.checkbox-dropdown-list li label {
371aa651
VP
155 display: block;
156 border-bottom: 1px solid silver;
157 padding: 10px;
2fba9a82 158
371aa651 159 transition: all 0.2s ease-out;
2fba9a82
VP
160}
161
162.checkbox-dropdown-list li label:hover {
371aa651
VP
163 background-color: #555;
164 color: white;
2fba9a82 165}
1e3f5fed
BM
166
167.table-striped>tbody>tr:nth-child(even)>td,
168.table-striped>tbody>tr:nth-child(even)>th {
8cfa32c5 169 background-color: #a5a5a549;
1e3f5fed 170 }
f41baac8
VP
171 .table-striped>tbody>tr:nth-child(odd)>td,
172 .table-striped>tbody>tr:nth-child(odd)>th {
87fc15eb 173 background-color: #ffffff;
f41baac8 174 }
ce9cf366
VP
175
176 /* Small screens (max-width: 576px) */
177@media (max-width: 576px) {
178 /* Change the font size for all headings */
179 h1, h2, h3, h4, h5, h6 {
180 font-size: 18px;
181 }
182
183 /* Hide the sidebar */
184 .sidebar {
185 display: none;
186 }
187
188 /* Make the main content take up the full width of the screen */
189 .main-content {
190 width: 100%;
191 }
192}
193
194/* Medium screens (min-width: 577px) and (max-width: 768px) */
195@media (min-width: 577px) and (max-width: 768px) {
196 /* Change the font size for all headings */
197
198}
199
200/* Large screens (min-width: 769px) */
201@media (min-width: 769px) {
202 /* CSS rules for large screens go here */
203}
204/* Portrait screens (max-width: 576px) */
205@media (max-width: 576px) and (max-height: 812px) {
206 /* CSS rules for portrait screens go here */
207}
208
209/* Landscape screens (min-width: 577px) and (max-height: 812px) */
210@media (min-width: 577px) and (max-height: 812px) {
211 /* CSS rules for landscape screens go here */
212}
0a963606
M
213
214.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
215 width: inherit;
216}
4d96f7e7
M
217
218.card-header i.fa {
219 line-height: 74px;
220}