style-rtl.less 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. .ltr-left(@offset) {
  2. right: @offset;
  3. }
  4. .ltr-right(@offset) {
  5. left: @offset;
  6. }
  7. .ltr-margin-right(@offset) {
  8. margin-left: @offset;
  9. }
  10. .ltr-margin-left(@offset) {
  11. margin-right: @offset;
  12. }
  13. .ltr-border-right(@offset) {
  14. border-left: @offset;
  15. }
  16. .ltr-border-left(@offset) {
  17. border-right: @offset;
  18. }
  19. .ltr-padding-right(@offset) {
  20. padding-left: @offset;
  21. }
  22. .ltr-padding-left(@offset) {
  23. padding-right: @offset;
  24. }
  25. .ltr-float-left() {
  26. float: right;
  27. }
  28. .ltr-float-right() {
  29. float: left;
  30. }
  31. .ltr-text-align-right() {
  32. text-align: left;
  33. }
  34. .ltr-rounded-left-corners(@radius) {
  35. border-radius: 0 @radius @radius 0;
  36. }
  37. .ltr-rounded-top-left-corners(@radius) {
  38. border-radius: 0 @radius 0 0;
  39. }
  40. .ltr-rounded-bottom-left-corners(@radius) {
  41. border-radius: 0 0 @radius 0;
  42. }
  43. .ltr-rounded-right-corners(@radius) {
  44. border-radius: @radius 0 0 @radius;
  45. }
  46. .ltr-rounded-top-right-corners(@radius) {
  47. border-radius: @radius 0 0 0;
  48. }
  49. .ltr-rounded-bottom-right-corners(@radius) {
  50. border-radius: 0 0 0 @radius;
  51. }
  52. .ltr-text-align-left() {
  53. text-align: right;
  54. }
  55. .ltr-border-left-width(@offset) {
  56. border-right-width: @offset;
  57. }
  58. .ltr-border-right-width(@offset) {
  59. border-left-width: @offset;
  60. }
  61. .ltr-transform() {
  62. transform: scale(-1, 1);
  63. }
  64. @import "style.less";
  65. #q,
  66. #sidebar .infobox dt bdi {
  67. direction: rtl;
  68. }
  69. // URL are displayed LTR but align on the right
  70. #urls {
  71. direction: initial;
  72. text-align: right;
  73. .result .url_header {
  74. direction: rtl;
  75. }
  76. .result .url_wrapper {
  77. justify-content: end;
  78. }
  79. }
  80. // Image flexbox
  81. #main_results div#results.only_template_images #urls {
  82. direction: rtl;
  83. }
  84. // Image detail
  85. #results.image-detail-open
  86. article.result-images[data-vim-selected]
  87. .detail
  88. .result-images-labels
  89. p {
  90. direction: rtl;
  91. &.result-url {
  92. // Display URL using the LTR direction
  93. direction: ltr;
  94. span {
  95. // And put the label on the right
  96. direction: rtl;
  97. float: right;
  98. }
  99. }
  100. }
  101. // select HTML element
  102. @supports (
  103. (background-position-x: 100%) and
  104. (
  105. (appearance: none) or (-webkit-appearance: none) or
  106. (-moz-appearance: none)
  107. )
  108. ) {
  109. select {
  110. border-width: 0 0 0 2rem;
  111. background-position-x: -2rem;
  112. }
  113. }
  114. // vim hotkey helps is not translated
  115. #vim-hotkeys-help table {
  116. direction: ltr;
  117. text-align: left;
  118. }
  119. // Logo on the right
  120. #main_preferences h1,
  121. #main_stats h1 {
  122. background-position-x: 100%;
  123. }
  124. // patch of stats.less
  125. .bar-chart-serie1,
  126. .bar-chart-serie2 {
  127. float: right;
  128. }
  129. .engine-stats .engine-name,
  130. .engine-stats .engine-score,
  131. .engine-stats .result-count,
  132. .engine-stats .response-time,
  133. .engine-stats .engine-reliability {
  134. text-align: right;
  135. }