xref: /template/writr/css/rtl.less (revision 6fb33d549a43f5a3cf7eb50b723c2cd26d9a2eb7) 
1/*
2Theme Name: Writr
3*/
4
5@media screen{
6[dir=rtl] {
7
8body {
9	direction: rtl;
10	unicode-bidi: embed;
11}
12
13
14/* =Reset
15----------------------------------------------- */
16
17caption, th, td {
18	text-align: right;
19}
20
21
22/* =Global
23----------------------------------------------- */
24
25/* Text elements */
26li > ul,
27li > ol {
28	margin-left: 0;
29	margin-right: 20px;
30}
31blockquote {
32	padding-left: 0;
33	padding-right: 20px;
34	border-left: none;
35	border-right: 15px double #f5f5f5;
36}
37
38
39/* =Theme
40----------------------------------------------- */
41
42/* Body */
43body:after {
44	left: auto;
45	right: 0;
46}
47body:before {
48	left: auto;
49	right: 300px;
50}
51
52/* Page */
53#page:before {
54	left: auto;
55	right: 400px;
56}
57
58/* Sidebar */
59.sidebar-area {
60	float: right;
61}
62#sidebar-toggle {
63	left: auto;
64	right: 0;
65}
66#sidebar-toggle:before,
67#sidebar-toggle:after {
68	border-right: none;
69	border-left: 40px solid transparent;
70}
71#sidebar-toggle:after {
72	left: auto;
73	right: 40px;
74}
75
76/* Primary */
77.content-area {
78	float: left;
79}
80
81
82/* =Menu
83----------------------------------------------- */
84
85.main-navigation ul {
86	padding-right: 0;
87}
88.main-navigation ul ul {
89	left: auto;
90	right: 100%;
91}
92.main-navigation .dropdown > a {
93	padding-right: 40px;
94	padding-left: 65px;
95}
96.main-navigation .dropdown > a:after {
97	right: auto;
98	left: 40px;
99	border-left: none;
100	border-right: 5px solid #fff;
101}
102
103
104/* =Content
105----------------------------------------------- */
106
107/* Entry title */
108.entry-title {
109	margin-left: 0;
110	margin-right: -40px;
111}
112.entry-title:after {
113	left: auto;
114	right: -5px;
115	border-right: none;
116	border-left: 5px solid #f5f5f5;
117}
118
119/* Page title */
120.page-title {
121	margin-left: 0;
122	margin-right: -40px;
123}
124
125/* Entry thumbnail */
126.entry-thumbnail {
127	margin-left: 0;
128	margin-right: -40px;
129}
130
131/* Entry meta */
132.entry-meta li {
133	padding-left: 0;
134	padding-right: 22px;
135}
136.entry-meta .genericon {
137	left: auto;
138	right: 0;
139}
140
141/* Entry format */
142.entry-format-badge {
143	left: auto;
144	right: -120px;
145}
146
147
148/* =Navigation
149----------------------------------------------- */
150
151#content [class*="navigation"] {
152	margin-left: 0;
153	margin-right: -40px;
154}
155[class*="navigation"] .nav-previous {
156	float: right;
157	text-align: right;
158}
159[class*="navigation"] .nav-next {
160	float: left;
161	text-align: left;
162}
163
164/* Genericon */
165[class*="navigation"] .nav-previous a {
166	padding-left: 0;
167	padding-right: 22px;
168}
169[class*="navigation"] .nav-previous .genericon {
170	left: auto;
171	right: 0;
172}
173[class*="navigation"] .nav-next a {
174	padding-right: 0;
175	padding-left: 22px;
176}
177[class*="navigation"] .nav-next .genericon {
178	right: auto;
179	left: 0;
180}
181
182
183/* =Comments
184----------------------------------------------- */
185
186/* Comment list */
187.comment-list .children {
188	padding-left: 0;
189	padding-right: 40px;
190}
191.comment-list .children .comment:before {
192	left: auto;
193	right: 0;
194}
195.reply .genericon-reply,
196.comment-list .children .comment:before {
197	-webkit-transform: scaleX(-1);
198	-moz-transform:    scaleX(-1);
199	-o-transform:      scaleX(-1);
200	transform:         scaleX(-1);
201	-ms-filter: "FlipH";
202	filter: FlipH;
203}
204.comment-list .comment {
205	margin-left: 0;
206	margin-right: -40px;
207}
208.comment-author .avatar {
209	left: auto;
210	right: -80px;
211}
212.comment-author:after {
213	left: auto;
214	right: -5px;
215	border-right: none;
216	border-left: 5px solid #fff;
217}
218
219/* Comment metadata */
220.comment-metadata li {
221	padding-left: 0;
222	padding-right: 22px;
223}
224.comment-metadata .genericon {
225	left: auto;
226	right: 0;
227}
228
229/* By post author */
230.bypostauthor > .comment-body {
231	margin-left: 0;
232	margin-right: -40px;
233}
234.comment-list .children > .bypostauthor {
235	padding-left: 0;
236	padding-right: 40px;
237}
238.bypostauthor > .comment-body .comment-author:after {
239	border-right: none;
240	border-left-color: #f5f5f5;
241}
242
243
244/* =Search form
245----------------------------------------------- */
246
247.search-form {
248	position: relative;
249	padding-bottom: 20px;
250}
251.search-form input[type="submit"] {
252	right: auto;
253	left: 5px;
254}
255
256
257} /* /rtl */
258} /* /@media */
259
260
261/* =Responsive
262----------------------------------------------- */
263
264/* 960px > x */
265@media only screen and (max-width: 959px) {
266
267[dir=rtl] {
268
269	/* Grid */
270	body.sidebar-closed:before {
271		left: auto;
272		right: 40px;
273	}
274	.sidebar-closed #page:before {
275		left: auto;
276		right: 140px;
277	}
278	body:not(.sidebar-closed) .sidebar-area:after {
279		left: auto;
280		right: 300px;
281
282	}
283	.site-header {
284		float: left;
285	}
286
287	/* Menu */
288	.main-navigation ul ul {
289		right: auto;
290	}
291	.main-navigation ul ul a {
292		padding-left: 40px;
293		padding-right: 60px;
294	}
295	.main-navigation ul ul ul a {
296		padding-left: 40px;
297		padding-right: 80px;
298	}
299	.main-navigation .dropdown > a {
300		padding-right: 40px;
301		padding-left: 84px;
302	}
303	.main-navigation ul ul .dropdown > a {
304		padding-right: 60px;
305	}
306	.dropdown-icon {
307		right: auto;
308		left: 5px;
309	}
310} /* /rtl */
311
312}
313
314/* 768px > x */
315@media only screen and (max-width: 767px) {
316
317	/* Theme */
318	[dir=rtl] .content-area {
319		padding-right: 0;
320	}
321
322}
323