xref: /template/sprintdoc/css/area_nav-breadcrumb.less (revision 646345133d72c121c484c6161208fb384f2f2bef) 
1/**
2 * This file provides the design styles for the direct / menu jump links.
3 *
4 * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
5 */
6
7.breadcrumbs {
8    padding: @margin-small 1.8rem;
9    border-bottom: 1px solid @color-border;
10
11    > p {
12        font-size: .83rem;
13        margin: 0;
14
15        * {
16            font-size: .83rem;
17        }
18
19        .bchead {
20            .sr-only();
21        }
22
23        a {
24            &:hover,
25            &:focus,
26            &:active {
27                color: @color-nav;
28            }
29        }
30
31        span.home {
32            a {
33                .fontello();
34                .hide-text-show-before();
35                .icon-home();
36
37                height: 1em;
38                width: auto;
39                text-decoration: none;
40                transition: @transition color;
41
42                &:before {
43                    font-size: 1rem;
44                    margin-top: .17rem;
45                }
46
47                &:hover,
48                &:focus,
49                &:active {
50                    color: @color-link-hover;
51                }
52            }
53        }
54    }
55
56
57/* + + + + +  icon list  + + + + + */
58    .page-attributes {
59        float: right;
60        display: inline-block;
61        list-style: none;
62        margin: 0;
63        padding: 0;
64        max-width: 30%;
65
66        > li {
67            .btn-usertools-wrapper(); // uniform li
68            .btn-usertools-num();
69
70            float: left;
71
72            > strong,
73            > a {
74                display: block;
75                width: auto;
76                min-height: 2em;
77                border: 1px solid @color-border;
78                border-radius: @border-radius;
79                color: @color-nav;
80                text-align: center;
81                margin: 0;
82            }
83
84            .prefix {
85                .btn-prefix ();
86                .icon-clipboard();
87            }
88
89/* check !!! */
90            &.do_none {
91                position: relative;
92
93                strong {
94                    background-color: @color-site-bg;
95                }
96
97                .num {
98                    background-color: @color-border;
99                    color: @color-nav;
100                }
101            }
102/* end check !!! */
103
104            &.plugin__qc {
105                display: inline-block;
106                overflow: visible;
107            }
108        } // li
109
110        a {
111            transition: @transition color, @transition border-color;
112
113            &[aria-expanded="false"] + #plugin__qc__wrapper {
114                display: none;
115            }
116
117            &:hover,
118            &:active,
119            &:focus {
120                border-color: @button_color;
121                color: @button_color;
122
123                .prefix {
124                    color: @button_color;
125                }
126            }
127        }
128
129        #plugin__qc__wrapper {
130            position: absolute;
131            right: 0;
132            width: auto;
133            border: 0 none;
134            background: @color-site-bg;
135
136            &[aria-hidden="false"] {
137                margin-top: .5rem;
138            }
139        }
140
141        #plugin__qc__icon {
142            display: none;
143        }
144
145        #plugin__qc__link {
146            position: relative;
147
148            .prefix {
149                .icon-emo-happy();
150
151                width: 100%;
152                font-size: .9rem;
153
154                &::before {
155                    width: 100%;
156                    margin: .1em 0 0;
157                }
158            }
159        }
160    }
161}
162
163.mode_admin{
164
165}
166