xref: /template/writr/css/plugins/include.less (revision 2da7767b3235622103751a5a85e12c749984e2bd) 
1/* =Include Plugin
2----------------------------------------------- */
3
4.plugin_include_content {
5    padding-top: 0px;
6    padding-bottom: 0px;
7
8    .inclmeta {
9        font-size: 0;
10    }
11    .published{
12        font-size: 16px;
13        font-weight:normal;
14        border: none;
15        border-image-width: 0;
16        opacity: 60%;
17        float: right;
18        transition: all 0.25s ease-in-out;
19    }
20    .published:hover{
21        opacity: 100%;
22    }
23    .published::before{
24        font-family: 'bootstrap-icons';
25        content: "\f214";
26        font-weight: normal;
27        font-size: 20px;
28        line-height: 20px;
29        padding-right: 6px;
30        vertical-align: text-top;
31    }
32    .author{
33        font-size: 16px;
34        float: right;
35        margin-right: 8px;
36    }
37    .author::before{
38        font-family: 'bootstrap-icons';
39        content: "\f4e1";
40        font-size: 20px;
41        margin-right: 4px;
42        line-height: 20px;
43        vertical-align: text-top;
44    }
45    .comment{
46        font-size: 16px;
47        margin-right: 8px;
48    }
49    .comment::before{
50        font-family: 'bootstrap-icons';
51        content: "\f268";
52        font-size: 20px;
53        padding-right: 6px;
54        line-height: 20px;
55        vertical-align: text-top;
56    }
57    .linkback{
58        font-size: 16px;
59        margin-right: 8px;
60    }
61    .linkback::before{
62        font-family: 'bootstrap-icons';
63        content: "\f470";
64        font-size: 20px;
65        padding-right: 4px;
66        line-height: 20px;
67        vertical-align: text-top;
68    }
69    .tags {
70        a::before {
71            font-family: 'bootstrap-icons';
72            content: "\F5B0";
73            font-size: 16px;
74            padding-right: 4px;
75            line-height: 16px;
76            vertical-align: middle;
77        }
78        a {
79            border-radius: 5px;
80        }
81    }
82
83    h1:first-of-type,
84    > h2:first-of-type,
85    > #dw__toc + h2,
86    > .section_highlight_wrapper:first-child > h2:first-of-type,
87    > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
88    > div > h2:first-of-type,
89    > div > #dw__toc + h2,
90    > div > .section_highlight_wrapper:first-child > h2:first-of-type,
91    > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
92        text-transform: uppercase;
93        width: @ini_content_width;
94        background: @ini_border;
95        padding: 20px 40px;
96        margin-left: -40px;
97        margin-right: -40px;
98        font-weight: bold;
99
100        a {
101            text-decoration: none;
102            transition: all 0.5s ease;
103        }
104    }
105}
106
107.makeFullWidth {
108    .plugin_include_content {
109        h1:first-of-type,
110        > h2:first-of-type,
111        > #dw__toc + h2,
112        > .section_highlight_wrapper:first-child > h2:first-of-type,
113        > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
114        > div > h2:first-of-type,
115        > div > #dw__toc + h2,
116        > div > .section_highlight_wrapper:first-child > h2:first-of-type,
117        > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
118            width: ~"calc(100vw - 400px - @{ini_content_border})";
119        }
120    }
121}
122
123/* 960px > x */
124@media only screen and (max-width: 959px) {
125    .plugin_include_content {
126        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 > h2:first-of-type,
132        > div > #dw__toc + h2,
133        > div > .section_highlight_wrapper:first-child > h2:first-of-type,
134        > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
135            width: @ini_content_width;
136        }
137    }
138    .makeFullWidth {
139        .plugin_include_content {
140            h1:first-of-type,
141            > h2:first-of-type,
142            > #dw__toc + h2,
143            > .section_highlight_wrapper:first-child > h2:first-of-type,
144            > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
145            > div > h2:first-of-type,
146            > div > #dw__toc + h2,
147            > div > .section_highlight_wrapper:first-child > h2:first-of-type,
148            > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
149                width: ~"calc(100vw - 40px - 100px)";
150            }
151        }
152    }
153}
154
155/* 767px > x */
156@media only screen and (max-width: 767px) {
157    .makeFullWidth {
158        .plugin_include_content {
159            h1:first-of-type,
160            > h2:first-of-type,
161            > #dw__toc + h2,
162            > .section_highlight_wrapper:first-child > h2:first-of-type,
163            > #dw__toc + .section_highlight_wrapper > h2:first-of-type,
164            > div > h2:first-of-type,
165            > div > #dw__toc + h2,
166            > div > .section_highlight_wrapper:first-child > h2:first-of-type,
167            > div > #dw__toc + .section_highlight_wrapper > h2:first-of-type {
168                width: 100vw;
169            }
170        }
171    }
172}
173
174p.include_readmore {
175    margin-bottom: 8px;
176}
177.plugin_include_content a.wikilink1 {
178    text-decoration: none;
179}
180.include_readmore a {
181	-webkit-text-size-adjust: 100%;
182	word-wrap: break-word;
183	font-family: Montserrat,sans-serif;
184	margin: 0;
185	padding: 10px 20px !important;
186	border: none!important;
187	background-color: @ini_theme_color;
188	color: @ini_background !important;
189	font-size: 14px;
190	line-height: 1.5;
191	font-weight: bold;
192	text-transform: uppercase;
193	cursor: pointer;
194	-webkit-appearance: button;
195	box-sizing: border-box;
196	border-radius: 20px !important;
197	vertical-align: middle;
198	text-decoration: none;
199    transition: all 0.25s ease-in-out;
200}
201.include_readmore a:visited {
202	background-color: @ini_theme_color !important;
203}
204.include_readmore a:hover {
205	background-color: @ini_theme_color_alt !important;
206}
207.include_readmore a::after {
208    content: "\f285";
209    font-family: 'bootstrap-icons';
210    font-size: 16px;
211    line-height: 16px;
212    padding-left: 6px;
213    vertical-align: text-top;
214    transition: all 0.25s ease-in-out;
215}
216.include_readmore a:hover::after {
217    padding-left: 12px;
218}
219