1/*
2=========================================================
3*  Argon Dokuwiki Template
4*  Based on the Argon Design System by Creative Tim
5*  Ported to Dokuwiki by Anchit (@IceWreck)
6=========================================================
7*/
8
9@import 'argon-design-system';
10
11// ------ General ------
12
13button {
14    @extend .btn;
15    @extend .btn-neutral;
16}
17
18legend {
19    @extend .h3;
20    font-style: normal;
21}
22
23input, select {
24    background-color: white !important;
25    border-radius: 0.25rem;
26    border-color: #5e72e4;
27}
28
29// Highlight Search Results
30.search_hit {
31    @extend mark;
32}
33
34// Fix Content Hidden behind navbar when you reach via anchor
35// Fixed somewhere else.
36// :target {
37//     padding-top: 6rem;
38//  }
39
40// Selection
41::-moz-selection {
42    text-shadow: none;
43    background: #dfe2f1;
44}
45
46::selection {
47    text-shadow: none;
48    background: #dfe2f1;
49}
50
51// Breadrumbs
52
53.breadcrumb {
54    flex-direction: column;
55}
56
57
58// ------ Main Content ------
59
60#dokuwiki__content {
61    p {
62        font-weight: 400;
63    }
64
65    // HAX. Still don't understand why it works, but it does.
66    // https://developer.mozilla.org/en-US/docs/Web/CSS/::before
67    h1::before, h2::before, h3::before, h4::before, h5::before, h6::before {
68        content: '';
69        display: block;
70        height:      6rem;
71        margin-top: -6rem;
72        visibility: hidden;
73
74    }
75
76
77    // Edit Button
78    .secedit button {
79        @extend .btn;
80        @extend .btn-outline-secondary;
81        //@extend .btn-secondary;
82        @extend .btn-sm;
83
84        margin-bottom: 1em;
85        float: right;
86        //color: #999;
87        //background-color: white;
88        box-shadow: none;
89        //font-size: 0.65rem;
90        &:focus,&:hover{
91            background-color: white;
92            box-shadow: none;
93        }
94    }
95
96    // Non-existant links
97    .wikilink2 {
98        color: #dc3545;
99    }
100
101    // Page Revisions Button
102    #page__revisions button {
103        @extend .btn;
104        @extend .btn-primary;
105    }
106
107    // Wiki Edit Menu Buttons
108    .editButtons button{
109        @extend .btn;
110        @extend .btn-primary;
111        @extend .btn-sm;
112        margin-top: 1em;
113        margin-bottom: 1em;
114    }
115
116
117    // Inline Code
118    :not(pre)>code {
119        background-color: inherit;
120        padding: .1em;
121        border-radius: .3em;
122
123
124    }
125
126    // Emoticons
127    img.icon {
128        width: 1rem;
129        height: 1rem;
130    }
131
132    // Tables
133    .table-responsive {
134        border-width: 0rem;
135    }
136    table {
137        @extend .table-responsive;
138        @extend .table;
139    }
140
141    // Code Blocks
142    pre {
143        font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier, monospace;
144        font-size: 14px;
145        line-height: 1.375;
146        direction: ltr;
147        text-align: left;
148        white-space: pre;
149        word-spacing: normal;
150        word-break: normal;
151        -moz-tab-size: 4;
152        -o-tab-size: 4;
153        tab-size: 4;
154        -webkit-hyphens: none;
155        -moz-hyphens: none;
156        -ms-hyphens: none;
157        hyphens: none;
158        background: #f5f7ff;
159        color: #5e6687;
160        border: 0;
161        border-radius: .55rem;
162        padding: 1.25rem;
163        margin: 0;
164        margin-bottom: 1rem;
165        margin-top: 1rem;
166        overflow: auto;
167
168    }
169
170}
171
172// ------ Editor ------
173
174// Tool Bar Buttons
175#tool__bar button {
176    @extend .btn;
177    @extend .btn-secondary;
178    @extend .btn-sm;
179    margin-bottom: 2em;
180}
181
182// Edit Area
183
184textarea {
185    @extend .form-control;
186    width: 95%;
187    max-width: 100%;
188}
189
190// ------ Table of Contents ------
191.ct-toc {
192    #dw__toc {
193
194        float:inherit;
195        margin:inherit;
196        width:inherit;
197        background-color:inherit;
198        color:inherit;
199        box-sizing: border-box;
200        margin-right: 0em;
201        padding-left: 0;
202        border-left: 1px solid #eee;
203
204
205        h3 {
206            display: none;
207        }
208
209        a {
210            display: block;
211            padding: .125rem 1rem;
212            color: #99979c;
213            font-size: 100%;
214        }
215
216        a:hover {
217            color:#5e72e4;
218            text-decoration: none;
219        }
220
221
222        ol, ul, dl {
223            margin-top: 0;
224            margin-bottom: 1rem;
225        }
226
227        ul {
228            margin-bottom: 0.5rem;
229        }
230
231        ul {
232            list-style: disc outside;
233            list-style-position: outside;
234            list-style-image: none;
235            list-style-type: disc;
236        }
237    }
238    // .clear {
239    //     @extend .section-nav;
240    //     .li {
241    //         @extend .toc-entry;
242    //         @extend .toc-h6 !optional;
243    //     }
244    //     display: content;
245    // }
246
247}
248
249// ------ Navbar ------
250
251.header-title a {
252    color: white;
253    font-weight: 600;
254    font-size: 1.2rem;
255}
256
257// Navbar Icons
258.argon-doku-navbar-icon {
259    fill: white;
260    :hover {
261        fill: #e6e6e6;
262    }
263}
264
265// Search Bar
266.doku_form{
267    .no {
268        @extend .form-group;
269        @extend .input-group;
270        @extend .mb-4;
271        margin: 0rem;
272        height: 1.5rem;
273        padding: 0rem;
274
275        #qsearch__in {
276            @extend .form-control;
277            width: 10rem;
278            height:1.5rem;
279            margin: 0rem;
280            margin-right: 1rem;
281            margin-left: 1rem;
282            border-radius: 0.25rem !important;
283            overflow: hidden;
284            border: none;
285        }
286        button {
287            @extend .btn;
288            @extend .btn-neutral;
289            margin: 0rem;
290            overflow: hidden;
291            height: 92%;
292        }
293    }
294
295}
296
297// ------ Search Form ------
298
299.search-form {
300    top:50%;
301    position: relative;
302}
303
304
305.toggleAssistant {
306    @extend .btn;
307    @extend .btn-default;
308}
309
310.search-results-form{
311    // button {
312    //     @extend .btn;
313    //     @extend .btn-primary;
314    // }
315
316    .toggleAssistant {
317        @extend .btn;
318        @extend .btn-default;
319    }
320
321    fieldset input {
322        @extend .form-control;
323        display: block;
324        width: 90%;
325        height:1.5rem;
326        margin-top: 2rem;
327        margin-bottom: 2rem;
328        margin-left: 5%;
329        margin-right: 5%;
330    }
331}
332
333.advancedOptions {
334    width: 30%;
335    border-style: dotted;
336    border-width: 0.01rem;
337    border-radius: 0.45rem;
338    margin-top: 1rem;
339    padding: 1rem;
340    margin-left: 5rem;
341    .toggle > ul > li {
342        list-style-type: disclosure-closed;
343    }
344}
345
346
347// ------ Admin Area ------
348
349.admin_tasks {
350    svg {
351        margin-right: 1rem;
352    }
353}
354
355.ui-admin {
356    ul li {
357        list-style-type: none;
358    }
359}
360
361.tabs {
362    li {
363        list-style-type: disclosure-closed;
364    }
365}
366
367// Config Panel
368
369#config__manager td input.edit {
370    @extend .form-control;
371    width: 30em;
372    padding: 0.0rem 0.75rem;
373    background-color: white !important;
374}
375#config__manager tr.default .input, #config__manager tr.default input, #config__manager tr.default textarea, #config__manager tr.default select, #config__manager .selectiondefault {
376    background-color: inherit;
377}
378
379// ------ Media Uploads ------
380
381.qq-upload-button{
382    @extend .btn;
383    @extend .btn-neutral;
384}
385
386// ------ Registration and User Forms ------
387
388// Modify user, delete user
389#dw__register, #dw__profiledelete {
390    text-align: left !important;
391    legend {
392        @extend .h3;
393        font-style: normal;
394    }
395    label {
396        font-size: 1rem;
397        width: 95%;
398        input {
399            float: right;
400            background-color: white !important;
401            border-radius: 0.25rem;
402            border-color: #99979c;
403            border-width: thin;
404        }
405
406
407    }
408}
409
410// Login
411#dw__login {
412    width: 100%;
413    float: left;
414        left: 0%;
415    margin:0%;
416    @extend .card;
417    @extend .bg-secondary, .shadow, .border-0;
418    label {
419        width: 90%;
420    }
421
422    legend {
423        @extend .card-header, .bg-white, .pb-5;
424        font-size: 2rem;
425        label {
426            @extend .h2;
427        }
428        margin-bottom: 5%;
429        font-style: normal;
430    }
431    span {
432        float: left;
433        font-size: 1.15rem;
434    }
435    input{
436        display: block;
437        float: right ;
438        @extend .form-control;
439        width: 90%;
440        height: 1.15rem;
441        top: 50%;
442
443    }
444    .simple {
445        width: 50%;
446        margin-left: unset !important;
447
448    }
449    #remember__me {
450        width: unset;
451        float: unset;
452        height: unset;
453        margin-top: 1rem;
454    }
455    label[for="remember__me"] {
456        margin-left: unset !important;
457    }
458    button {
459        // margin-top: 5rem;
460        @extend .btn;
461        @extend .btn-primary;
462    }
463}
464
465// ------ Left Sidebar ------
466
467.leftsidebar {
468    .leftsidebar ul {
469        @extend .nav, .ct-sidenav;
470    }
471    li {
472        list-style-type: none;
473        display: block;
474        font-size: 84%;
475        padding: 0.25rem;
476        color:#4c555a;
477        font-weight: 400;
478    }
479
480    a:link, a:visited {
481        text-decoration: none;
482        color:#4c555a;
483    }
484    a:hover {
485        color: #212529;
486    }
487
488}
489
490
491.argon-doku-page-menu {
492    display: flex;
493    align-items: flex-end;
494    justify-content: flex-end;
495    margin: 1.75rem 0 0.5rem;
496
497    li {
498        display: inline;
499        fill: #6c757d;
500        :hover {
501            fill:#525f7f;
502        }
503    }
504
505    li:nth-of-type(1) {
506        margin-left: 0em;
507    }
508}
509
510// ------ Footer ------
511
512.footer-card {
513    background-color: #f4f5f7;
514    text-align: center;
515
516    .footer-search {
517        // center-align the bottom search bar
518        margin-left: auto;
519        margin-right: auto;
520    }
521
522}
523
524@import 'modifications';
525