rtl.css 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824
  1. /*
  2. Theme Name: Twenty Fifteen
  3. Description: Adds support for languages written in a Right To Left (RTL) direction.
  4. It's easy, just a matter of overwriting all the horizontal positioning attributes
  5. of your CSS stylesheet in a separate stylesheet file named rtl.css.
  6. See http://codex.wordpress.org/Right_to_Left_Language_Support
  7. */
  8. /**
  9. * Table of Contents:
  10. *
  11. * 1.0 - Reset
  12. * 2.0 - Typography
  13. * 3.0 - Elements
  14. * 4.0 - Forms
  15. * 5.0 - Navigations
  16. * 6.0 - Accessibility
  17. * 7.0 - Alignments
  18. * 8.0 - Header
  19. * 9.0 - Widgets
  20. * 10.0 - Content
  21. * 10.1 - Posts and pages
  22. * 10.2 - Comments
  23. * 11.0 - Media Queries
  24. * 11.1 - Mobile Large
  25. * 11.2 - Tablet Small
  26. * 11.3 - Tablet Large
  27. * 11.4 - Desktop Small
  28. * 11.5 - Desktop Medium
  29. * 11.6 - Desktop Large
  30. * 11.7 - Desktop X-Large
  31. */
  32. /**
  33. * 1.0 Reset
  34. */
  35. body {
  36. direction: rtl;
  37. unicode-bidi: embed;
  38. }
  39. a {
  40. display: inline-block;
  41. }
  42. caption,
  43. th,
  44. td {
  45. text-align: right;
  46. }
  47. /**
  48. * 2.0 Typography
  49. */
  50. blockquote {
  51. border-right: 4px solid rgba(51, 51, 51, 0.7);
  52. border-left: 0;
  53. padding-right: 0.7778em;
  54. padding-left: 0;
  55. }
  56. /**
  57. * 3.0 Elements
  58. */
  59. ul,
  60. ol {
  61. margin: 0 1.3333em 1.6em 0;
  62. }
  63. li > ul,
  64. li > ol {
  65. margin-right: 1.3333em;
  66. margin-left: auto;
  67. }
  68. caption,
  69. th,
  70. td {
  71. text-align: right;
  72. }
  73. /**
  74. * 4.0 Forms
  75. */
  76. .post-password-form input[type="submit"] {
  77. right: auto;
  78. left: 0;
  79. }
  80. /**
  81. * 5.0 Navigations
  82. */
  83. .main-navigation ul ul {
  84. margin-right: 0.8em;
  85. margin-left: auto;
  86. }
  87. .main-navigation .page_item_has_children > a,
  88. .main-navigation .menu-item-has-children > a {
  89. padding-right: 0;
  90. padding-left: 48px;
  91. }
  92. .dropdown-toggle {
  93. right: auto;
  94. left: 0;
  95. }
  96. .dropdown-toggle:after {
  97. right: -1px;
  98. left: auto;
  99. }
  100. .social-navigation li {
  101. float: right;
  102. }
  103. .social-navigation a:before {
  104. right: 0;
  105. left: auto;
  106. }
  107. .secondary-toggle {
  108. right: auto;
  109. left: 0;
  110. }
  111. .secondary-toggle:before {
  112. right: 0;
  113. left: auto;
  114. }
  115. .secondary-toggle.toggled-on:before {
  116. right: 0;
  117. left: auto;
  118. }
  119. .post-navigation .has-post-thumbnail a:before {
  120. right: 0;
  121. left: auto;
  122. }
  123. .pagination .meta-nav {
  124. margin-right: auto;
  125. margin-left: 0.3333em;
  126. }
  127. .pagination .prev {
  128. right: 0;
  129. left: auto;
  130. }
  131. .pagination .prev:before {
  132. content: "\f429";
  133. right: -1px;
  134. left: auto;
  135. }
  136. .pagination .next {
  137. right: auto;
  138. left: 0;
  139. }
  140. .pagination .next:before {
  141. content: "\f430";
  142. right: auto;
  143. left: -1px;
  144. }
  145. .image-navigation .nav-previous a:before,
  146. .comment-navigation .nav-previous a:before {
  147. content: "\f429";
  148. margin-right: auto;
  149. margin-left: 0.2em;
  150. }
  151. .image-navigation .nav-next a:after,
  152. .comment-navigation .nav-next a:after {
  153. content: "\f430";
  154. margin-right: 0.2em;
  155. margin-left: auto;
  156. }
  157. /**
  158. * 6.0 Accessibility
  159. */
  160. .screen-reader-text:hover,
  161. .screen-reader-text:focus {
  162. right: 5px;
  163. left: auto;
  164. }
  165. /**
  166. * 7.0 Alignments
  167. */
  168. .alignright {
  169. float: right;
  170. }
  171. .alignleft {
  172. float: left;
  173. }
  174. .aligncenter {
  175. margin-right: auto;
  176. margin-left: auto;
  177. }
  178. blockquote.alignright,
  179. .wp-caption.alignright,
  180. img.alignright {
  181. margin: 0.4em 0 1.6em 1.6em;
  182. }
  183. blockquote.alignleft,
  184. .wp-caption.alignleft,
  185. img.alignleft {
  186. margin: 0.4em 1.6em 1.6em 0;
  187. }
  188. /**
  189. * 8.0 Header
  190. */
  191. .site-branding {
  192. padding-right: 0;
  193. padding-left: 60px;
  194. }
  195. /**
  196. * 9.0 Widgets
  197. */
  198. .widget_categories .children,
  199. .widget_nav_menu .sub-menu,
  200. .widget_pages .children {
  201. margin: 0.7667em 0.8em 0 0;
  202. }
  203. /**
  204. * 10.0 Content
  205. */
  206. /**
  207. * 10.1 Posts and pages
  208. */
  209. .entry-content .more-link:after {
  210. content: "\f430";
  211. }
  212. .author-link:after {
  213. content: "\f430";
  214. }
  215. .author-info .avatar {
  216. float: right;
  217. margin: 0 0 1.6em 1.6em;
  218. }
  219. .posted-on a:before,
  220. .byline a:before,
  221. .cat-links span + a:before,
  222. .tags-links span + a:before,
  223. .comments-link a:before,
  224. .entry-format a:before,
  225. .edit-link a:before,
  226. .full-size-link a:before {
  227. margin-right: auto;
  228. margin-left: 2px;
  229. }
  230. .posted-on,
  231. .byline,
  232. .cat-links,
  233. .tags-links,
  234. .comments-link,
  235. .entry-format,
  236. .full-size-link {
  237. margin-right: auto;
  238. margin-left: 1em;
  239. }
  240. .page-links a,
  241. .page-links > span {
  242. margin: 0 0 2px 1px;
  243. }
  244. .page-links > .page-links-title {
  245. padding-right: 0;
  246. padding-left: 0.5em;
  247. }
  248. .type-attachment .entry-header {
  249. clear: left;
  250. }
  251. .format-link .entry-title a:after {
  252. -webkit-transform: scaleX(-1);
  253. -moz-transform: scaleX(-1);
  254. -ms-transform: scaleX(-1);
  255. -o-transform: scaleX(-1);
  256. transform: scaleX(-1);
  257. }
  258. /**
  259. * 10.2 Comments
  260. */
  261. .comment-list .children > li {
  262. padding-right: 0.8em;
  263. padding-left: 0;
  264. }
  265. .comment-author .avatar {
  266. margin-right: auto;
  267. margin-left: 0.4em;
  268. }
  269. .bypostauthor > article .fn:after {
  270. right: 3px;
  271. left: auto;
  272. }
  273. .comment-metadata .edit-link {
  274. margin-right: 1em;
  275. margin-left: auto;
  276. }
  277. .pingback .edit-link {
  278. margin-right: 1em;
  279. margin-left: auto;
  280. }
  281. .comment-content ul,
  282. .comment-content ol {
  283. margin: 0 1.3333em 1.6em 0;
  284. }
  285. .comment-reply-title small a {
  286. float: left;
  287. }
  288. /**
  289. * 11.0 Media Queries
  290. */
  291. /**
  292. * 11.1 Mobile Large 620px
  293. */
  294. @media screen and (min-width: 38.75em) {
  295. ul,
  296. ol {
  297. margin-right: 0;
  298. margin-left: auto;
  299. }
  300. blockquote {
  301. margin-right: -1em;
  302. margin-left: auto;
  303. }
  304. blockquote > blockquote {
  305. margin-right: 0;
  306. margin-left: auto;
  307. }
  308. .page-header {
  309. border-color: inherit;
  310. border-left: none;
  311. border-style: solid;
  312. border-width: 0 7px 0 0;
  313. }
  314. .page-title,
  315. .taxonomy-description {
  316. margin-right: -7px;
  317. margin-left: auto;
  318. }
  319. .comment-content ul,
  320. .comment-content ol {
  321. margin-right: 0;
  322. margin-left: auto;
  323. }
  324. }
  325. /**
  326. * 11.2 Tablet Small 740px
  327. */
  328. @media screen and (min-width: 46.25em) {
  329. blockquote {
  330. margin-right: -1.05em;
  331. margin-left: auto;
  332. padding-right: 0.85em;
  333. padding-left: 0;
  334. }
  335. .main-navigation ul ul {
  336. margin-right: 1em;
  337. margin-left: auto;
  338. }
  339. .main-navigation .page_item_has_children > a,
  340. .main-navigation .main-navigation .menu-item-has-children > a {
  341. padding-right: 0;
  342. padding-left: 54px;
  343. }
  344. blockquote.alignright,
  345. .wp-caption.alignright
  346. img.alignright {
  347. margin: 0.4118em 0 1.6471em 1.6471em;
  348. }
  349. blockquote.alignleft,
  350. .wp-caption.alignleft,
  351. img.alignleft {
  352. margin: 0.4118em 1.6471em 1.6471em 0;
  353. }
  354. .site-branding {
  355. padding-right: 0;
  356. padding-left: 66px;
  357. }
  358. .widget blockquote {
  359. margin-right: -1.2353em;
  360. margin-left: auto;
  361. padding-right: 1em;
  362. padding-left: 0;
  363. }
  364. .widget blockquote > blockquote {
  365. margin-right: 0;
  366. margin-left: auto;
  367. }
  368. .widget blockquote.alignright,
  369. .widget .wp-caption.alignright,
  370. .widget img.alignright {
  371. margin: 0.5em 0 1.5em 1.5em;
  372. }
  373. .widget blockquote.alignleft,
  374. .widget .wp-caption.alignleft,
  375. .widget img.alignleft {
  376. margin: 0.5em 1.5em 1.5em 0;
  377. }
  378. .widget_categories .children,
  379. .widget_nav_menu .sub-menu,
  380. .widget_pages .children {
  381. margin: 0.9643em 1em 0 0;
  382. }
  383. .author-info .avatar {
  384. margin: 0 0 1.6471em 1.6471em;
  385. }
  386. .comment-list .children > li {
  387. padding-right: 1.2353em;
  388. padding-left: 0;
  389. }
  390. .comment-author {
  391. padding-right: 4.1176em;
  392. padding-left: 0;
  393. }
  394. .comment-author .avatar {
  395. right: 0;
  396. left: auto;
  397. }
  398. .comment-metadata {
  399. padding-right: 5em;
  400. padding-left: 0;
  401. }
  402. .bypostauthor > article .fn:after {
  403. right: 6px;
  404. left: auto;
  405. }
  406. }
  407. /**
  408. * 11.3 Tablet Large 880px
  409. */
  410. @media screen and (min-width: 55em) {
  411. blockquote {
  412. margin-right: -1.0909em;
  413. margin-left: auto;
  414. padding-right: 0.9091em;
  415. padding-left: 0;
  416. }
  417. .main-navigation .page_item_has_children > a,
  418. .main-navigation .main-navigation .menu-item-has-children > a {
  419. padding-right: 0;
  420. padding-left: 53px;
  421. }
  422. blockquote.alignright,
  423. .wp-caption.alignright
  424. img.alignright {
  425. margin: 0.4211em 0 1.6842em 1.6842em;
  426. }
  427. blockquote.alignleft,
  428. .wp-caption.alignleft,
  429. img.alignleft {
  430. margin: 0.4211em 1.6842em 1.6842em 0;
  431. }
  432. .site-branding {
  433. padding-right: 0;
  434. padding-left: 74px;
  435. }
  436. .widget blockquote {
  437. margin-right: -1.2632em;
  438. margin-left: auto;
  439. padding-right: 1.0526em;
  440. padding-left: 0;
  441. }
  442. .widget_categories .children,
  443. .widget_nav_menu .sub-menu,
  444. .widget_pages .children {
  445. margin: 0.7188em 1em 0 0;
  446. }
  447. .author-info .avatar {
  448. margin: 0 0 1.6842em 1.6842em;
  449. }
  450. .comment-list .children > li {
  451. padding-right: 1.4737em;
  452. padding-left: 0;
  453. }
  454. .comment-author {
  455. padding-right: 4.6315em;
  456. padding-left: 0;
  457. }
  458. .comment-metadata {
  459. padding-right: 5.5em;
  460. padding-left: 0;
  461. }
  462. }
  463. /**
  464. * 11.4 Desktop Small 967px
  465. */
  466. @media screen and (min-width: 59.6875em) {
  467. body:before {
  468. right: 0;
  469. left: auto;
  470. }
  471. .sidebar {
  472. float: right;
  473. margin-right: auto;
  474. margin-left: -100%;
  475. }
  476. .site-content {
  477. float: right;
  478. margin-right: 29.4118%;
  479. margin-left: auto;
  480. }
  481. blockquote {
  482. margin-right: -1.3333em;
  483. margin-left: auto;
  484. padding-right: 1.1111em;
  485. padding-left: 0;
  486. }
  487. .main-navigation .page_item_has_children > a,
  488. .main-navigation .menu-item-has-children > a {
  489. padding-right: 0;
  490. padding-left: 35px;
  491. }
  492. blockquote.alignright,
  493. .wp-caption.alignright,
  494. img.alignright {
  495. margin: 0.4em 0 1.6em 1.6em;
  496. }
  497. blockquote.alignleft,
  498. .wp-caption.alignleft,
  499. img.alignleft {
  500. margin: 0.4em 1.6em 1.6em 0;
  501. }
  502. .widget blockquote {
  503. margin-right: -1.5em;
  504. margin-left: auto;
  505. padding-right: 1.1667em;
  506. padding-left: 0;
  507. }
  508. .widget_categories .children,
  509. .widget_nav_menu .sub-menu,
  510. .widget_pages .children {
  511. margin: 0.4583em 1em 0 0;
  512. }
  513. .author-info .avatar {
  514. margin: 0 0 1.5em 1.5em;
  515. }
  516. .comment-list .children > li {
  517. padding-right: 0.8em;
  518. padding-left: 0;
  519. }
  520. .comment-author {
  521. padding-right: 0;
  522. padding-left: 0;
  523. }
  524. .comment-author .avatar {
  525. margin-right: auto;
  526. margin-left: 0.4em;
  527. }
  528. .comment-metadata {
  529. padding-right: 0;
  530. padding-left: 0;
  531. }
  532. .bypostauthor > article .fn:after {
  533. right: 3px;
  534. left: auto;
  535. }
  536. .site-branding {
  537. padding: 0;
  538. }
  539. .site-footer {
  540. margin-right: 35.2941%;
  541. margin-left: auto;
  542. }
  543. }
  544. /**
  545. * 11.5 Desktop Medium 1100px
  546. */
  547. @media screen and (min-width: 68.75em) {
  548. blockquote {
  549. margin-right: -1.05em;
  550. margin-left: auto;
  551. padding-right: 0.85em;
  552. padding-left: 0;
  553. }
  554. .main-navigation .page_item_has_children > a,
  555. .main-navigation .menu-item-has-children > a {
  556. padding-right: 0;
  557. padding-left: 33px;
  558. }
  559. blockquote.alignright,
  560. .wp-caption.alignright
  561. img.alignright {
  562. margin: 0.4118em 0 1.6471em 1.6471em;
  563. }
  564. blockquote.alignleft,
  565. .wp-caption.alignleft,
  566. img.alignleft {
  567. margin: 0.4118em 1.6471em 1.6471em 0;
  568. }
  569. .widget blockquote {
  570. padding-right: 1.2143em;
  571. padding-left: 0;
  572. }
  573. .widget_categories .children,
  574. .widget_nav_menu .sub-menu,
  575. .widget_pages .children {
  576. margin: 0.4643em 1em 0 0;
  577. }
  578. .author-info .avatar {
  579. margin: 0 0 1.6471em 1.6471em;
  580. }
  581. .comment-list .children > li {
  582. padding-right: 1.1667em;
  583. padding-left: 0;
  584. }
  585. .comment-author {
  586. padding-right: 4.1176em;
  587. padding-left: 0;
  588. }
  589. .comment-author .avatar {
  590. right: 0;
  591. left: auto;
  592. }
  593. .bypostauthor > article .fn:after {
  594. right: 6px;
  595. left: auto;
  596. }
  597. .comment-metadata {
  598. padding-right: 5em;
  599. padding-left: 0;
  600. }
  601. }
  602. /**
  603. * 11.6 Desktop Large 1240px
  604. */
  605. @media screen and (min-width: 77.5em) {
  606. blockquote {
  607. margin-right: -1.0909em;
  608. margin-left: auto;
  609. padding-right: 0.9091em;
  610. padding-left: 0;
  611. }
  612. .main-navigation .page_item_has_children > a,
  613. .main-navigation .menu-item-has-children > a {
  614. padding-right: 0;
  615. padding-left: 32px;
  616. }
  617. blockquote.alignright,
  618. .wp-caption.alignright
  619. img.alignright {
  620. margin: 0.4211em 0 1.6842em 1.6842em;
  621. }
  622. blockquote.alignleft,
  623. .wp-caption.alignleft,
  624. img.alignleft {
  625. margin: 0.4211em 1.6842em 1.6842em 0;
  626. }
  627. .widget blockquote {
  628. padding-right: 1.25em;
  629. padding-left: 0;
  630. }
  631. .widget_categories .children,
  632. .widget_nav_menu .sub-menu,
  633. .widget_pages .children {
  634. margin: 0.4688em 1em 0 0;
  635. }
  636. .author-info .avatar {
  637. margin: 0 0 1.6842em 1.6842em;
  638. }
  639. .comment-list .children > li {
  640. padding-right: 1.4737em;
  641. padding-left: 0;
  642. }
  643. .comment-author {
  644. padding-right: 4.6315em;
  645. padding-left: 0;
  646. }
  647. .comment-metadata {
  648. padding-right: 5.5em;
  649. padding-left: 0;
  650. }
  651. }
  652. /**
  653. * 11.7 Desktop X-Large 1403px
  654. */
  655. @media screen and (min-width: 87.6875em) {
  656. body:before {
  657. width: -webkit-calc(50% - 289px);
  658. width: calc(50% - 289px);
  659. }
  660. }