xref: /template/sprintdoc/css/area_togglelink.less (revision fda6466f1a0bef2b5b9e9c65d98b6d435838ad4a)
1/**
2 * This file provides the design styles for the sidebar (navmain).
3 *
4 * @author Jana Deutschlaender <deutschlaender@cosmocode.de>
5 */
6
7
8.togglelink {
9    &.page_main-content {
10        position: absolute;
11        top: -1px;
12        bottom: -1px;
13        left: -(@margin-default);
14        z-index: 1;
15
16        a {
17            .display-flex();
18            .flex-direction();
19            .justify-content();
20
21            width: (@margin-default);
22            height: 100%;
23            background-color: @button_background;
24            border: solid 1px @button_background;
25            border-radius: 2px 0 0 2px;
26            color: @button_color;
27            text-decoration: none;
28            text-align: center;
29            transition: @transition color, @transition background-color, @transition border-color;
30
31            &:hover,
32            &:focus,
33            &:active {
34                background-color: @button_color;
35                border-color: @button_background;
36                color: @button_background;
37                text-decoration: none;
38
39                * {
40                    color: inherit;
41                    text-decoration: none;
42                }
43            }
44        }
45
46
47/* + + +  toggle out  + + + */
48        .wide-content & {
49            left: -1px;
50
51            a {
52                background-color: @button_background;
53                border-color: @button_background;
54
55                &:hover,
56                &:focus,
57                &:active {
58                    background-color: @button_color;
59                }
60            }
61        }
62    }
63}
64
65
66/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
67/* min-width: 1440px */
68
69@media @screen_min-xlg {
70    .togglelink {
71
72    }
73}
74
75
76/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
77/* max-width: 1199px */
78
79@media @screen_max-xlg {
80    .togglelink {
81
82    }
83}
84