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