xref: /template/sprintdoc/css/template_admin.less (revision 5be78f585aa0a7501555bdf5c2a488effb1cec67)
1/**
2 * This file provides the design styles for the admin tools
3 *
4 * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
5 */
6
7
8.do-admin {
9    #admin__version {
10        font-size: @font-size-default;
11    }
12
13    .main-content ul {
14        > li {
15            font-size: @font-size-default;
16
17            div.li {
18                font-size: @font-size-default;
19
20                a {
21                    font-size: @font-size-default;
22                    line-height: 125%;
23                    cursor: pointer;
24                }
25            }
26        }
27    }
28
29    div.ui-admin {
30        ul.admin_tasks,
31        ul.admin_plugins {
32            padding: 0;
33
34            li {
35                background-size: auto 1rem;
36                margin: 0 0 .6em 0;
37
38                a {
39                    color: @ini_existing;
40                    font-weight: 400;
41
42                    * {
43                        color: inherit;
44                    }
45
46                    span.icon {
47                        width: 1.6em;
48                        min-height: 1.6em;
49                        margin-top: -.3rem;
50                        margin-bottom: .3rem;
51
52                        svg {
53                            width: 26px;
54                            height: 26px;
55                            border: solid 1px @ini_background_content;
56                            border-radius: @ini_default_border_radius;
57                            fill: @ini_existing;
58                            transition: @transition background-color, @transition border-color, @transition fill;
59
60                            path {
61                                fill: @ini_existing;
62                                transition: @transition fill;
63                            }
64                        }
65                    }
66
67                    &:hover,
68                    &:focus,
69                    &:active {
70                        span.icon {
71                            svg {
72                                background-color: @ini_existing;
73                                border-color: @ini_existing;
74                                fill: @ini_background_content;
75
76                                path {
77                                    fill: @ini_background_content;
78                                }
79                            }
80                        }
81                    }
82                }
83            }
84        }
85    }
86}
87
88
89/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
90/* 1024px */
91
92@media @screen_max-md {
93    .do-admin {
94        div.ui-admin {
95            ul.admin_tasks {
96                width: 50%;
97                padding-top: 1rem;
98
99                li {
100                    white-space: normal;
101
102                    a {
103                        .display-flex(); // for better position with line breaks (white-space)
104
105                        span.icon {
106                            margin-top: -.3rem;
107                            margin-bottom: .3rem;
108                        }
109                    }
110                }
111            }
112        }
113    }
114}
115
116
117/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
118/* 768px */
119
120@media @screen_max-xs {
121    .do-admin {
122        div.ui-admin {
123            ul.admin_tasks {
124                width: auto;
125                padding-top: 1rem;
126            }
127        }
128    }
129}
130