color-picker-rtl.css 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. /*! This file is auto-generated */
  2. /* rtl:ignore */
  3. .wp-color-picker {
  4. width: 80px;
  5. direction: ltr;
  6. }
  7. .wp-picker-container .hidden {
  8. display: none;
  9. }
  10. /* Needs higher specificiity. */
  11. .wp-picker-container .wp-color-result.button {
  12. min-height: 30px;
  13. margin: 0 0 6px 6px;
  14. padding: 0 30px 0 0;
  15. font-size: 11px;
  16. }
  17. .wp-color-result-text {
  18. background: #f6f7f7;
  19. border-radius: 2px 0 0 2px;
  20. border-right: 1px solid #c3c4c7;
  21. color: #50575e;
  22. display: block;
  23. line-height: 2.54545455; /* 28px */
  24. padding: 0 6px;
  25. text-align: center;
  26. }
  27. .wp-color-result:hover,
  28. .wp-color-result:focus {
  29. background: #f6f7f7;
  30. border-color: #8c8f94;
  31. color: #1d2327;
  32. }
  33. .wp-color-result:hover:after,
  34. .wp-color-result:focus:after {
  35. color: #1d2327;
  36. border-color: #a7aaad;
  37. border-right: 1px solid #8c8f94;
  38. }
  39. .wp-picker-container {
  40. display: inline-block;
  41. }
  42. .wp-color-result:focus {
  43. border-color: #4f94d4;
  44. box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
  45. }
  46. .wp-color-result:active {
  47. /* See Trac ticket #39662 */
  48. transform: none !important;
  49. }
  50. .wp-picker-open + .wp-picker-input-wrap {
  51. display: inline-block;
  52. vertical-align: top;
  53. }
  54. .wp-picker-input-wrap label {
  55. display: inline-block;
  56. vertical-align: top;
  57. }
  58. /* For the old `custom-background` page, to override the inline-block and margins from `.form-table td fieldset label`. */
  59. .form-table .wp-picker-input-wrap label {
  60. margin: 0 !important;
  61. }
  62. .wp-picker-input-wrap .button.wp-picker-default,
  63. .wp-picker-input-wrap .button.wp-picker-clear,
  64. .wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
  65. .wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
  66. margin-right: 6px;
  67. padding: 0 8px;
  68. line-height: 2.54545455; /* 28px */
  69. min-height: 30px;
  70. }
  71. .wp-picker-container .iris-square-slider .ui-slider-handle:focus {
  72. background-color: #50575e
  73. }
  74. .wp-picker-container .iris-picker {
  75. border-radius: 0;
  76. border-color: #dcdcde;
  77. margin-top: 6px;
  78. }
  79. .wp-picker-container input[type="text"].wp-color-picker {
  80. width: 4rem;
  81. font-size: 12px;
  82. font-family: monospace;
  83. line-height: 2.33333333; /* 28px */
  84. margin: 0;
  85. padding: 0 5px;
  86. vertical-align: top;
  87. min-height: 30px;
  88. }
  89. .wp-color-picker::-webkit-input-placeholder {
  90. color: #646970;
  91. }
  92. .wp-color-picker::-moz-placeholder {
  93. color: #646970;
  94. opacity: 1;
  95. }
  96. .wp-color-picker:-ms-input-placeholder {
  97. color: #646970;
  98. }
  99. .wp-picker-container input[type="text"].iris-error {
  100. background-color: #fcf0f1;
  101. border-color: #d63638;
  102. color: #000;
  103. }
  104. .iris-picker .ui-square-handle:focus,
  105. .iris-picker .iris-strip .ui-slider-handle:focus {
  106. border-color: #3582c4;
  107. border-style: solid;
  108. box-shadow: 0 0 0 1px #3582c4;
  109. outline: 2px solid transparent;
  110. }
  111. .iris-picker .iris-palette:focus {
  112. box-shadow: 0 0 0 2px #3582c4;
  113. }
  114. @media screen and (max-width: 782px) {
  115. .wp-picker-container input[type="text"].wp-color-picker {
  116. width: 5rem;
  117. font-size: 16px;
  118. line-height: 1.875; /* 30px */
  119. min-height: 32px;
  120. }
  121. .wp-customizer .wp-picker-container input[type="text"].wp-color-picker {
  122. padding: 0 5px;
  123. }
  124. .wp-picker-input-wrap .button.wp-picker-default,
  125. .wp-picker-input-wrap .button.wp-picker-clear {
  126. padding: 0 8px;
  127. line-height: 2.14285714; /* 30px */
  128. min-height: 32px;
  129. }
  130. .wp-customizer .wp-picker-input-wrap .button.wp-picker-default,
  131. .wp-customizer .wp-picker-input-wrap .button.wp-picker-clear {
  132. padding: 0 8px;
  133. font-size: 14px;
  134. line-height: 2.14285714; /* 30px */
  135. min-height: 32px;
  136. }
  137. .wp-picker-container .wp-color-result.button {
  138. padding: 0 40px 0 0;
  139. font-size: 14px;
  140. line-height: 2.14285714; /* 30px */
  141. }
  142. .wp-customizer .wp-picker-container .wp-color-result.button {
  143. font-size: 14px;
  144. line-height: 2.14285714; /* 30px */
  145. }
  146. .wp-picker-container .wp-color-result-text {
  147. padding: 0 14px;
  148. font-size: inherit;
  149. line-height: inherit;
  150. }
  151. .wp-customizer .wp-picker-container .wp-color-result-text {
  152. padding: 0 10px;
  153. }
  154. }