xref: /template/sprintdoc/css/area_togglelink.less (revision d0530116c5d28d532ea5ae3ba6701f1d1a1b8697) 
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
11        @media @screen_max-md{
12            display: none;
13        }
14        position: absolute;
15        top: -1px;
16        bottom: -1px;
17        left: -(@margin-default);
18        z-index: 1;
19
20        a {
21            .display-flex();
22            .flex-direction();
23            .justify-content();
24
25            width: (@margin-default);
26            height: 100%;
27            background-color: @button_background;
28            border: solid 1px @button_background;
29            border-radius: @fix_border-radius 0 0 @fix_border-radius;
30            color: @button_color;
31            text-decoration: none;
32            text-align: center;
33            transition: @transition color, @transition background-color, @transition border-color;
34
35            &:hover,
36            &:focus,
37            &:active {
38                background-color: @button_color;
39                border-color: @button_background;
40                color: @button_background;
41                text-decoration: none;
42
43                * {
44                    color: inherit;
45                    text-decoration: none;
46                }
47            }
48            @media @screen_max-md{
49                display: none;
50            }
51        }
52
53
54/* + + +  toggle out  + + + */
55        .wide-content & {
56            left: -1px;
57
58            a {
59                background-color: @button_background;
60                border-color: @button_background;
61                border-radius: 0 @fix_border-radius @fix_border-radius 0;
62
63                &:hover,
64                &:focus,
65                &:active {
66                    background-color: @button_color;
67                }
68            }
69        }
70    }
71}
72
73
74/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
75/* min-width: 1440px */
76
77@media @screen_min-xlg {
78    .togglelink {
79
80    }
81}
82
83
84/* + + + + + + + + + + + + + + + + + + + + + + + + + + */
85/* max-width: 1199px */
86
87@media @screen_max-xlg {
88    .togglelink {
89
90    }
91}
92