4
0

_components.rtl.css 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. /* stylelint-disable property-no-vendor-prefix */
  2. /* FUNCTIONS */
  3. /*=== COMPONENTS */
  4. /*===============*/
  5. /*=== Forms */
  6. /*=== Horizontal-list */
  7. .horizontal-list {
  8. padding: 0.1rem 0;
  9. }
  10. .horizontal-list > .item:first-child {
  11. padding-right: 0.5rem;
  12. }
  13. /*=== Dropdown */
  14. .dropdown .dropdown-target:target + .btn {
  15. background-color: #e4d8cc;
  16. }
  17. .dropdown-menu {
  18. margin: 9px 0 0 0;
  19. padding: 0.5rem 0 1rem 0;
  20. background: #fcfaf8;
  21. font-size: 1rem;
  22. border: none;
  23. border-radius: 3px;
  24. box-shadow: 0px 6px 8px 0px rgba(0, 0, 0, 0.35);
  25. text-align: right;
  26. }
  27. .dropdown-menu::after {
  28. border: none;
  29. left: 17px;
  30. }
  31. .dropdown-menu .dropdown-header,
  32. .dropdown-menu .dropdown-section .dropdown-section-title {
  33. padding: 1rem 1.5rem;
  34. font-weight: bold;
  35. text-align: right;
  36. color: #766556;
  37. text-transform: uppercase;
  38. letter-spacing: 1px;
  39. }
  40. .dropdown-menu .item {
  41. transition: all 0.075s ease-in-out;
  42. }
  43. .dropdown-menu .item > a,
  44. .dropdown-menu .item > span,
  45. .dropdown-menu .item > .as-link {
  46. padding: 0 2rem;
  47. color: #363330;
  48. font-size: inherit;
  49. line-height: 2.5em;
  50. }
  51. .dropdown-menu .item > a span.icon,
  52. .dropdown-menu .item > span span.icon,
  53. .dropdown-menu .item > .as-link span.icon {
  54. padding: 0 0.25rem !important;
  55. }
  56. .dropdown-menu .item > a:not(.addItem):hover,
  57. .dropdown-menu .item > .as-link:not(.addItem):hover {
  58. background: #ca7227;
  59. color: #fff;
  60. }
  61. .dropdown-menu .item > a:not(.addItem):hover .icon,
  62. .dropdown-menu .item > .as-link:not(.addItem):hover .icon {
  63. filter: grayscale(100%) brightness(2.5);
  64. }
  65. .dropdown-menu .item.dropdown-section {
  66. margin-top: 0.75rem;
  67. }
  68. .dropdown-menu .item.dropdown-section ~ .dropdown-section {
  69. border-top-color: #f5f0ec;
  70. }
  71. .dropdown-menu .item.dropdown-section .item a, .dropdown-menu .item.dropdown-section .item .as-link {
  72. padding-right: 2rem;
  73. }
  74. .dropdown-menu .item:not(.addItem) > a:hover,
  75. .dropdown-menu .item:not(.addItem) button:hover {
  76. background: #ca7227;
  77. color: #fff;
  78. }
  79. .dropdown-menu .item:not(.addItem) > a:hover .icon,
  80. .dropdown-menu .item:not(.addItem) button:hover .icon {
  81. filter: brightness(3);
  82. }
  83. .dropdown-menu .item[aria-checked=true] a::before {
  84. margin: 0 -14px 0 0;
  85. font-weight: bold;
  86. }
  87. .dropdown-menu .item ~ .dropdown-header {
  88. margin-top: 0.75rem;
  89. padding-top: 1.75rem;
  90. border-top-color: #f5f0ec;
  91. }
  92. .dropdown-menu .item.separator {
  93. margin-top: 0.75rem;
  94. border-top-color: #f5f0ec;
  95. }
  96. .dropdown-menu .input select, .dropdown-menu .input input {
  97. margin: 0 auto 5px;
  98. padding: 2px 5px;
  99. border-radius: 3px;
  100. }
  101. .tree .tree-folder .tree-folder-items .dropdown-menu .item {
  102. padding: 0;
  103. }
  104. .tree .tree-folder .tree-folder-items .dropdown-menu .item a,
  105. .tree .tree-folder .tree-folder-items .dropdown-menu .item button {
  106. color: #363330;
  107. }
  108. .tree .tree-folder .tree-folder-items .dropdown-menu .item a:hover,
  109. .tree .tree-folder .tree-folder-items .dropdown-menu .item button:hover {
  110. color: #fff;
  111. }
  112. .tree .tree-folder .tree-folder-items .dropdown-menu .item:hover {
  113. background: #ca7227;
  114. }
  115. /*=== Alerts */
  116. .alert {
  117. background: #fcfaf8;
  118. color: #766556;
  119. font-size: 1rem;
  120. border: 1px solid #d9ccbf;
  121. border-radius: 3px;
  122. text-shadow: 0 0 1px #f5f0ec;
  123. }
  124. .alert-head {
  125. font-size: 1.15em;
  126. }
  127. .alert > a {
  128. text-decoration: underline;
  129. color: inherit;
  130. }
  131. .alert-warn {
  132. background: #fdfde0;
  133. color: #73762f;
  134. border: 1px solid #73762f33;
  135. }
  136. .alert-success {
  137. background: #cffdef;
  138. color: #0c7556;
  139. border: 1px solid #0c755633;
  140. }
  141. .alert-error {
  142. background: #fde0d8;
  143. color: #73341f;
  144. border: 1px solid #73341f33;
  145. }
  146. /*=== Pagination */
  147. .pagination {
  148. background: #f5f0ec;
  149. color: #363330;
  150. }
  151. .pagination .item a {
  152. color: #363330;
  153. }
  154. #load_more.loading,
  155. #load_more.loading:hover {
  156. background: url("loader.gif") center center no-repeat #34495e;
  157. }
  158. /*=== Boxes */
  159. .box {
  160. background: #fff;
  161. border: none;
  162. border-radius: 3px;
  163. box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.25);
  164. }
  165. .box .box-title {
  166. background: #f5f0ec;
  167. color: #363330;
  168. border-radius: 2px 2px 0 0;
  169. }
  170. .box .box-content {
  171. padding-right: 30px;
  172. }
  173. .box .box-content .item {
  174. padding: 0.5rem 0;
  175. color: #363330;
  176. font-size: 1rem;
  177. border-bottom: 1px solid #f5f0ec;
  178. line-height: 1.7em;
  179. }
  180. .box .box-content .item:last-child {
  181. border-bottom: none;
  182. }
  183. .box .configure {
  184. margin-left: 0.5rem;
  185. padding: 0.25rem;
  186. border-radius: 3px;
  187. }
  188. .box .configure .icon {
  189. vertical-align: middle;
  190. }
  191. .box .configure:hover {
  192. border-radius: 2px;
  193. background-color: #ca7227;
  194. }
  195. .box .configure:hover .icon {
  196. filter: brightness(3);
  197. }
  198. /*=== "Load more" part */
  199. #bigMarkAsRead.big {
  200. text-align: center;
  201. text-decoration: none;
  202. background: #fdf6ef;
  203. color: #ca7227;
  204. transition: all 0.15s ease-in-out;
  205. }
  206. #bigMarkAsRead.big:hover {
  207. background: #ca7227;
  208. color: #fff;
  209. }
  210. #bigMarkAsRead.big:hover .bigTick {
  211. filter: brightness(7);
  212. }
  213. #bigMarkAsRead.big .bigTick {
  214. margin: 0.5rem 0;
  215. background: url(icons/tick-color.svg) center no-repeat;
  216. display: inline-block;
  217. width: 64px;
  218. height: 64px;
  219. text-indent: -9999px;
  220. white-space: nowrap;
  221. }