xref: /template/writr/css/plugins/blog.less (revision 4dbac70b98ee37f12e1203b85bf671cad9dee013) 
1/* =Blog Plugin
2----------------------------------------------- */
3
4#plugin_bloglinks__links {
5	display: flex;
6	margin-bottom: 24px;
7}
8
9.plugin_bloglinks__next{
10	margin-left: auto;
11}
12
13.hfeed ~ .plugin_include_content {
14    > h1:first-of-type,
15    > #dw__toc + h1,
16    > .section_highlight_wrapper:first-child > h1:first-of-type,
17    > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
18    > h2:first-of-type,
19    > #dw__toc + h2,
20    > .section_highlight_wrapper:first-child > h2:first-of-type,
21    > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
22    > div > h1:first-of-type,
23    > div > #dw__toc + h1,
24    > div > .section_highlight_wrapper:first-child > h1:first-of-type,
25    > div > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
26    > div > h2:first-of-type,
27    > div > #dw__toc + h2,
28    > div > .section_highlight_wrapper:first-child > h2:first-of-type,
29    > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
30        text-transform: uppercase;
31        width: @ini_content_width;
32        background: @ini_border;
33        padding: 20px 40px;
34        margin-left: -40px;
35        margin-right: -40px;
36        font-weight: bold;
37
38        a {
39            text-decoration: none;
40            transition: all 0.5s ease;
41        }
42    }
43    .inclmeta {
44        margin-top: 16px;
45        margin-bottom: 16px;
46    }
47}
48.makeFullWidth {
49    .hfeed ~ .plugin_include_content {
50        > h1:first-of-type,
51        > #dw__toc + h1,
52        > .section_highlight_wrapper:first-child > h1:first-of-type,
53        > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
54        > h2:first-of-type,
55        > #dw__toc + h2,
56        > .section_highlight_wrapper:first-child > h2:first-of-type,
57        > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
58        > div > h1:first-of-type,
59        > div > #dw__toc + h1,
60        > div > .section_highlight_wrapper:first-child > h1:first-of-type,
61        > div > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
62        > div > h2:first-of-type,
63        > div > #dw__toc + h2,
64        > div > .section_highlight_wrapper:first-child > h2:first-of-type,
65        > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
66            width: ~"calc(100vw - 400px - @{ini_content_border})";
67        }
68    }
69}
70
71/* 960px > x */
72@media only screen and (max-width: 959px) {
73    .makeFullWidth {
74        .hfeed ~ .plugin_include_content {
75            > h1:first-of-type,
76            > #dw__toc + h1,
77            > .section_highlight_wrapper:first-child > h1:first-of-type,
78            > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
79            > h2:first-of-type,
80            > #dw__toc + h2,
81            > .section_highlight_wrapper:first-child > h2:first-of-type,
82            > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
83            > div > h1:first-of-type,
84            > div > #dw__toc + h1,
85            > div > .section_highlight_wrapper:first-child > h1:first-of-type,
86            > div > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
87            > div > h2:first-of-type,
88            > div > #dw__toc + h2,
89            > div > .section_highlight_wrapper:first-child > h2:first-of-type,
90            > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
91                width: @ini_content_width;
92            }
93        }
94    }
95    .makeFullWidth {
96        .hfeed ~ .plugin_include_content {
97            > h1:first-of-type,
98            > #dw__toc + h1,
99            > .section_highlight_wrapper:first-child > h1:first-of-type,
100            > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
101            > h2:first-of-type,
102            > #dw__toc + h2,
103            > .section_highlight_wrapper:first-child > h2:first-of-type,
104            > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
105            > div > h1:first-of-type,
106            > div > #dw__toc + h1,
107            > div > .section_highlight_wrapper:first-child > h1:first-of-type,
108            > div > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
109            > div > h2:first-of-type,
110            > div > #dw__toc + h2,
111            > div > .section_highlight_wrapper:first-child > h2:first-of-type,
112            > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
113                width: ~"calc(100vw - 40px - 100px)";
114            }
115        }
116    }
117}
118
119/* 767px > x */
120@media only screen and (max-width: 767px) {
121    .makeFullWidth {
122        .hfeed ~ .plugin_include_content {
123            > h1:first-of-type,
124            > #dw__toc + h1,
125            > .section_highlight_wrapper:first-child > h1:first-of-type,
126            > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
127            > h2:first-of-type,
128            > #dw__toc + h2,
129            > .section_highlight_wrapper:first-child > h2:first-of-type,
130            > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
131            > div > h1:first-of-type,
132            > div > #dw__toc + h1,
133            > div > .section_highlight_wrapper:first-child > h1:first-of-type,
134            > div > #dw__toc + .section_highlight_wrapper > h1:first-of-type,
135            > div > h2:first-of-type,
136            > div > #dw__toc + h2,
137            > div > .section_highlight_wrapper:first-child > h2:first-of-type,
138            > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
139                width: 100vw;
140            }
141        }
142    }
143}
144