style-rtl.css

Same filename in this branch
  1. 8.x drupal/core/themes/seven/style-rtl.css
  2. 8.x drupal/core/themes/bartik/css/style-rtl.css
/* ------------------- Reset Styles ---------------------- */

th,
td {
  text-align: right;
}
blockquote {
  border-left: none;
  border-right: 4px solid #afafaf;
}
blockquote:before {
  content: "\201D";
}
blockquote:after {
  content: "\201C";
}
tr td,
tr th {
  text-align: right;
}
/* ------------------- List Styles ----------------------- */

.region-content ul,
.region-content ol {
  padding: 2.5em 0 0.25em 0;
}
.item-list ul li {
  padding: 0.2em 0 0 0.5em;
}
ul.tips {
  padding: 0 1.25em 0 0;
}
.block ol,
.block ul {
  padding: 0 1em 0.25em 0;
}

/* ------------------- Header ---------------------------- */

#logo {
  padding: 15px 10px 15px 15px;
}
#logo,
#name-and-slogan,
.region-header .block,
.region-header #block-user-login .form-item,
.region-header #block-user-login .item-list li {
  float: right;
}
#name-and-slogan {
  margin: 0 15px 30px 0;
}
.region-header .form-text {
  margin-left: 2px;
  margin-right: 0;
}
.region-header #block-user-login .item-list li.last {
  padding-left: 0;
  padding-right: 0.5em;
}

/* ------------------- Main Menu ------------------------- */

#main-menu-links {
  text-align: right;
}
#main-menu-links a {
  padding: 0.9em 10px 0.9em 0;
}

/* ------------------- Secondary Menu -------------------- */

#secondary-menu-links {
  float: left;
}

/* ------------------- Content --------------------------- */

.submitted .field-name-field-user-picture img {
  float: right;
  margin-left: 20px;
  margin-right: 0;
}
.field-type-taxonomy-term-reference .field-label {
  padding-left: 5px;
  padding-right: 0;
}
.field-type-taxonomy-term-reference ul.links li {
  padding: 0 0 0 1em;
  float: right;
}
.link-wrapper {
  text-align: left;
  margin-right: 236px;
  margin-left: 0;
}

/* ------------------- Comments -------------------------- */

.comment .field-name-field-user-picture img {
  margin-right: 0;
}
.comment .attribution {
  float: right;
  padding: 0 0 0 30px;
}
.comment .comment-arrow {
  background-image: url(../images/comment-arrow-rtl.gif);
  margin-left: 0;
  margin-right: -47px;
}
.comment .indented {
  margin-right: 40px;
  margin-left: 0;
}
.comment ul.links li {
  padding: 0 0 0.5em;
}
.comment.unpublished {
  margin-left: 5px;
  margin-right: 0;
  padding: 5px 5px 5px 2px;
}

/* ------------------- Password Meter  ------------------- */

#password-strength {
  left: auto;
  margin-top: 2em;
  right: 16em;
}
#password-strength-text {
  margin-top: 0;
  float: left;
}
.form-item-pass-pass2 label {
  clear: right;
}

/* ------------------- Search Form ----------------------- */

#search-form input#edit-keys,
#block-search-form .form-item-search-block-form input {
  float: right;
  margin-left: 5px;
  margin-right: 0;
}

/* ------------------- Footer ---------------------------- */

#footer-columns ul {
  padding-right: 0;
}
#footer-columns li a {
  padding: 0.8em 20px 0.8em 2px;
}
#footer li a {
  float: right;
  border-left: 1px solid #555;
  border-color: rgba(255, 255, 255, 0.15);
  border-right: none;
}
#footer li.first a {
  padding-right: 0;
  padding-left: 12px;
}
#footer li.last a {
  padding-left: 0;
  padding-right: 12px;
  border-left: none;
}

/* ------------------ System Tabs  ----------------------- */

.tabs ul.primary li {
  margin: 0 0 0 5px;
  float: right;
  zoom: 1;
}
.tabs ul.secondary li {
  border-left: 1px solid #ccc;
  border-right: none;
  float: right;
}
.tabs ul.secondary li:first-child {
  padding-right: 0;
}
.tabs ul.secondary li:last-child {
  border-left: none;
}

/* ------------------- Form Elements   ------------------- */

#user-profile-form input#edit-submit {
  margin-left: 0;
}
.password-suggestions ul li {
  margin-right: 1.2em;
  margin-left: 0;
}

/* Animated throbber */
.js input.form-autocomplete {
  background-position: 1% 4px;
}
.js input.throbbing {
  background-position: 1% -16px;
}

/* Comment form */
.comment-form label {
  float: right;
}
.comment-form .form-type-checkbox,
.comment-form .form-radios,
.comment-form .form-item .description {
  margin-left: 0;
  margin-right: 120px;
}
#edit-actions input {
  margin-left: 0.6em;
  margin-right: 0;
}

/* ------------------- Shortcut Links -------------------- */

.shortcut-wrapper h1#page-title {
  float: right;
}

/* ------------------- Color Form ------------------------ */

.color-form #palette {
  margin-left: 0;
  margin-right: 20px;
}
.color-form .form-item label {
  float: right;
}
.color-form #palette .lock {
  right: -20px;
  left: 0;
}

/* ------------------- Media Queries --------------------- */

@media all and (min-width: 461px) and (max-width: 900px) {
 /* ------------------ Header and Menus ------------------ */

  #logo {
    padding: 5px 5px 0 0;
  }
  #main-menu-links li {
    float: right;
    margin-left: 5px;
    margin-right: 0;
  }
  #main-menu-links li:nth-child(3n) {
    margin-left: -5px;
    margin-right: 0;
  }
}

@media all and (min-width: 901px) {

  #logo {
    padding: 15px 10px 15px 15px;
  }

  #name-and-slogan {
    margin: 0 15px 30px 0;
  }

  #main-menu-links li {
    float: right;
  }

  #main-menu-links a {
    float: right;
    padding: 0.7em 0.8em;
  }
}

/* ------------------- Views styling --------------------- */

 /* ------------------ @group Lists ---------------------- */

.views-display-top .secondary .action-list {
  padding-left: inherit;
  padding-right: 0;
}

/* ------------------- @end ------------------------------ */

/* ------------------- @group Collapsible ---------------- */

.views-display-columns details summary {
  padding: 0 2px 4px 0;
}

/* ------------------- @end ------------------------------ */

File

drupal/core/themes/bartik/css/style-rtl.css
View source
  1. /* ------------------- Reset Styles ---------------------- */

  2. 

  3. th,

  4. td {

  5.   text-align: right;

  6. }

  7. blockquote {

  8.   border-left: none;

  9.   border-right: 4px solid #afafaf;

  10. }

  11. blockquote:before {

  12.   content: "\201D";

  13. }

  14. blockquote:after {

  15.   content: "\201C";

  16. }

  17. tr td,

  18. tr th {

  19.   text-align: right;

  20. }

  21. /* ------------------- List Styles ----------------------- */

  22. 

  23. .region-content ul,

  24. .region-content ol {

  25.   padding: 2.5em 0 0.25em 0;

  26. }

  27. .item-list ul li {

  28.   padding: 0.2em 0 0 0.5em;

  29. }

  30. ul.tips {

  31.   padding: 0 1.25em 0 0;

  32. }

  33. .block ol,

  34. .block ul {

  35.   padding: 0 1em 0.25em 0;

  36. }

  37. 

  38. /* ------------------- Header ---------------------------- */

  39. 

  40. #logo {

  41.   padding: 15px 10px 15px 15px;

  42. }

  43. #logo,

  44. #name-and-slogan,

  45. .region-header .block,

  46. .region-header #block-user-login .form-item,

  47. .region-header #block-user-login .item-list li {

  48.   float: right;

  49. }

  50. #name-and-slogan {

  51.   margin: 0 15px 30px 0;

  52. }

  53. .region-header .form-text {

  54.   margin-left: 2px;

  55.   margin-right: 0;

  56. }

  57. .region-header #block-user-login .item-list li.last {

  58.   padding-left: 0;

  59.   padding-right: 0.5em;

  60. }

  61. 

  62. /* ------------------- Main Menu ------------------------- */

  63. 

  64. #main-menu-links {

  65.   text-align: right;

  66. }

  67. #main-menu-links a {

  68.   padding: 0.9em 10px 0.9em 0;

  69. }

  70. 

  71. /* ------------------- Secondary Menu -------------------- */

  72. 

  73. #secondary-menu-links {

  74.   float: left;

  75. }

  76. 

  77. /* ------------------- Content --------------------------- */

  78. 

  79. .submitted .field-name-field-user-picture img {

  80.   float: right;

  81.   margin-left: 20px;

  82.   margin-right: 0;

  83. }

  84. .field-type-taxonomy-term-reference .field-label {

  85.   padding-left: 5px;

  86.   padding-right: 0;

  87. }

  88. .field-type-taxonomy-term-reference ul.links li {

  89.   padding: 0 0 0 1em;

  90.   float: right;

  91. }

  92. .link-wrapper {

  93.   text-align: left;

  94.   margin-right: 236px;

  95.   margin-left: 0;

  96. }

  97. 

  98. /* ------------------- Comments -------------------------- */

  99. 

  100. .comment .field-name-field-user-picture img {

  101.   margin-right: 0;

  102. }

  103. .comment .attribution {

  104.   float: right;

  105.   padding: 0 0 0 30px;

  106. }

  107. .comment .comment-arrow {

  108.   background-image: url(../images/comment-arrow-rtl.gif);

  109.   margin-left: 0;

  110.   margin-right: -47px;

  111. }

  112. .comment .indented {

  113.   margin-right: 40px;

  114.   margin-left: 0;

  115. }

  116. .comment ul.links li {

  117.   padding: 0 0 0.5em;

  118. }

  119. .comment.unpublished {

  120.   margin-left: 5px;

  121.   margin-right: 0;

  122.   padding: 5px 5px 5px 2px;

  123. }

  124. 

  125. /* ------------------- Password Meter  ------------------- */

  126. 

  127. #password-strength {

  128.   left: auto;

  129.   margin-top: 2em;

  130.   right: 16em;

  131. }

  132. #password-strength-text {

  133.   margin-top: 0;

  134.   float: left;

  135. }

  136. .form-item-pass-pass2 label {

  137.   clear: right;

  138. }

  139. 

  140. /* ------------------- Search Form ----------------------- */

  141. 

  142. #search-form input#edit-keys,

  143. #block-search-form .form-item-search-block-form input {

  144.   float: right;

  145.   margin-left: 5px;

  146.   margin-right: 0;

  147. }

  148. 

  149. /* ------------------- Footer ---------------------------- */

  150. 

  151. #footer-columns ul {

  152.   padding-right: 0;

  153. }

  154. #footer-columns li a {

  155.   padding: 0.8em 20px 0.8em 2px;

  156. }

  157. #footer li a {

  158.   float: right;

  159.   border-left: 1px solid #555;

  160.   border-color: rgba(255, 255, 255, 0.15);

  161.   border-right: none;

  162. }

  163. #footer li.first a {

  164.   padding-right: 0;

  165.   padding-left: 12px;

  166. }

  167. #footer li.last a {

  168.   padding-left: 0;

  169.   padding-right: 12px;

  170.   border-left: none;

  171. }

  172. 

  173. /* ------------------ System Tabs  ----------------------- */

  174. 

  175. .tabs ul.primary li {

  176.   margin: 0 0 0 5px;

  177.   float: right;

  178.   zoom: 1;

  179. }

  180. .tabs ul.secondary li {

  181.   border-left: 1px solid #ccc;

  182.   border-right: none;

  183.   float: right;

  184. }

  185. .tabs ul.secondary li:first-child {

  186.   padding-right: 0;

  187. }

  188. .tabs ul.secondary li:last-child {

  189.   border-left: none;

  190. }

  191. 

  192. /* ------------------- Form Elements   ------------------- */

  193. 

  194. #user-profile-form input#edit-submit {

  195.   margin-left: 0;

  196. }

  197. .password-suggestions ul li {

  198.   margin-right: 1.2em;

  199.   margin-left: 0;

  200. }

  201. 

  202. /* Animated throbber */

  203. .js input.form-autocomplete {

  204.   background-position: 1% 4px;

  205. }

  206. .js input.throbbing {

  207.   background-position: 1% -16px;

  208. }

  209. 

  210. /* Comment form */

  211. .comment-form label {

  212.   float: right;

  213. }

  214. .comment-form .form-type-checkbox,

  215. .comment-form .form-radios,

  216. .comment-form .form-item .description {

  217.   margin-left: 0;

  218.   margin-right: 120px;

  219. }

  220. #edit-actions input {

  221.   margin-left: 0.6em;

  222.   margin-right: 0;

  223. }

  224. 

  225. /* ------------------- Shortcut Links -------------------- */

  226. 

  227. .shortcut-wrapper h1#page-title {

  228.   float: right;

  229. }

  230. 

  231. /* ------------------- Color Form ------------------------ */

  232. 

  233. .color-form #palette {

  234.   margin-left: 0;

  235.   margin-right: 20px;

  236. }

  237. .color-form .form-item label {

  238.   float: right;

  239. }

  240. .color-form #palette .lock {

  241.   right: -20px;

  242.   left: 0;

  243. }

  244. 

  245. /* ------------------- Media Queries --------------------- */

  246. 

  247. @media all and (min-width: 461px) and (max-width: 900px) {

  248.  /* ------------------ Header and Menus ------------------ */

  249. 

  250.   #logo {

  251.     padding: 5px 5px 0 0;

  252.   }

  253.   #main-menu-links li {

  254.     float: right;

  255.     margin-left: 5px;

  256.     margin-right: 0;

  257.   }

  258.   #main-menu-links li:nth-child(3n) {

  259.     margin-left: -5px;

  260.     margin-right: 0;

  261.   }

  262. }

  263. 

  264. @media all and (min-width: 901px) {

  265. 

  266.   #logo {

  267.     padding: 15px 10px 15px 15px;

  268.   }

  269. 

  270.   #name-and-slogan {

  271.     margin: 0 15px 30px 0;

  272.   }

  273. 

  274.   #main-menu-links li {

  275.     float: right;

  276.   }

  277. 

  278.   #main-menu-links a {

  279.     float: right;

  280.     padding: 0.7em 0.8em;

  281.   }

  282. }

  283. 

  284. /* ------------------- Views styling --------------------- */

  285. 

  286.  /* ------------------ @group Lists ---------------------- */

  287. 

  288. .views-display-top .secondary .action-list {

  289.   padding-left: inherit;

  290.   padding-right: 0;

  291. }

  292. 

  293. /* ------------------- @end ------------------------------ */

  294. 

  295. /* ------------------- @group Collapsible ---------------- */

  296. 

  297. .views-display-columns details summary {

  298.   padding: 0 2px 4px 0;

  299. }

  300. 

  301. /* ------------------- @end ------------------------------ */