source: tanzpartie-hugo/themes/bilberry-hugo-theme/assets/sass/_responsive.scss @ 16971

Last change on this file since 16971 was 16971, checked in by Henrik Bettermann, 3 years ago
File size: 2.1 KB
Line 
1@media (max-width: $site-width) {
2    nav {
3        &.permanentTopNav {
4            display: none;
5        }
6
7        .container {
8            flex-direction: column-reverse;
9            padding: 1em 2em;
10
11            .topnav {
12                flex-direction: column;
13                justify-content: center;
14                align-items: center;
15                margin-bottom: 0.5em;
16                width: 100%;
17
18                li {
19                    width: 100%;
20                }
21
22                a {
23                    padding: 0.75em 0;
24                    display: block;
25                    width: 100%;
26                }
27            }
28
29            .search {
30                margin: 0.5em 1.5em;
31                width: 100%;
32
33                input {
34                    width: 100%;
35                }
36            }
37        }
38    }
39
40    header {
41        width: 100%;
42
43        .container {
44            padding: 0 30px;
45            .titles {
46                font-size: 1.5rem;
47                line-height: 140%;
48                .title {
49                    font-size: 3rem;
50                    line-height: 160%;
51                }
52            }
53        }
54
55        .toggler {
56            right: 14px;
57
58            &.permanentTopNav {
59                display: block;
60            }
61        }
62
63        .languages {
64            right: 14px;
65        }
66    }
67
68    .bubble {
69        display: none !important;
70    }
71
72    .container {
73        width: 100%;
74        padding: 0;
75    }
76
77    .container:before,
78    .container:after {
79        display: none !important;
80    }
81
82    .main {
83        margin-bottom: 0;
84    }
85
86    .main article {
87        margin: 14px;
88        width: 100%;
89
90        &:before,
91        &:after {
92            display: none !important;
93        }
94    }
95
96    .main #comments-container {
97        margin: 0 1.5em;
98    }
99
100    .main .paginator {
101        margin: 1.5em;
102        margin-top: 50px;
103    }
104
105    footer .container {
106        padding: 3em 2em 2em 2em;
107        flex-direction: column;
108        text-align: center;
109
110        div {
111            width: 100%;
112            margin: 0 !important;
113        }
114    }
115
116    .credits .container {
117        padding: 4rem 1.5em;
118    }
119}
Note: See TracBrowser for help on using the repository browser.