widgets-rtl.css 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878
  1. /*! This file is auto-generated */
  2. /* General Widgets Styles */
  3. .widget {
  4. margin: 0 auto 10px;
  5. position: relative;
  6. box-sizing: border-box;
  7. }
  8. .widget.open {
  9. z-index: 99;
  10. }
  11. .widget.open:focus-within {
  12. z-index: 100;
  13. }
  14. .widget-top {
  15. font-size: 13px;
  16. font-weight: 600;
  17. background: #f6f7f7;
  18. }
  19. .widget-top .widget-action {
  20. border: 0;
  21. margin: 0;
  22. padding: 10px;
  23. background: none;
  24. cursor: pointer;
  25. }
  26. .widget-title h3,
  27. .widget-title h4 {
  28. margin: 0;
  29. padding: 15px;
  30. font-size: 1em;
  31. line-height: 1;
  32. overflow: hidden;
  33. white-space: nowrap;
  34. text-overflow: ellipsis;
  35. -webkit-user-select: none;
  36. user-select: none;
  37. }
  38. .widgets-holder-wrap .widget-inside {
  39. border-top: none;
  40. padding: 1px 15px 15px;
  41. line-height: 1.23076923;
  42. }
  43. .widget.widget-dirty .widget-control-close-wrapper {
  44. display: none;
  45. }
  46. .in-widget-title,
  47. #widgets-right a.widget-control-edit,
  48. #available-widgets .widget-description {
  49. color: #646970;
  50. }
  51. .deleting .widget-title,
  52. .deleting .widget-top .widget-action .toggle-indicator:before {
  53. color: #a7aaad;
  54. }
  55. /* Media Widgets */
  56. .wp-core-ui .media-widget-control.selected .placeholder,
  57. .wp-core-ui .media-widget-control.selected .not-selected,
  58. .wp-core-ui .media-widget-control .selected {
  59. display: none;
  60. }
  61. .media-widget-control.selected .selected {
  62. display: inline-block;
  63. }
  64. .media-widget-buttons {
  65. text-align: right;
  66. margin-top: 0;
  67. }
  68. .media-widget-control .media-widget-buttons .button {
  69. width: auto;
  70. height: auto;
  71. margin-top: 12px;
  72. white-space: normal;
  73. }
  74. .media-widget-buttons .button:first-child {
  75. margin-left: 8px;
  76. }
  77. .media-widget-control .attachment-media-view .button-add-media,
  78. .media-widget-control .placeholder {
  79. border: 1px dashed #c3c4c7;
  80. box-sizing: border-box;
  81. cursor: pointer;
  82. line-height: 1.6;
  83. padding: 9px 0;
  84. position: relative;
  85. text-align: center;
  86. width: 100%;
  87. }
  88. .media-widget-control .attachment-media-view .button-add-media {
  89. cursor: pointer;
  90. background-color: #f0f0f1;
  91. color: #2c3338;
  92. }
  93. .media-widget-control .attachment-media-view .button-add-media:hover {
  94. background-color: #fff;
  95. }
  96. .media-widget-control .attachment-media-view .button-add-media:focus {
  97. background-color: #fff;
  98. border-style: solid;
  99. border-color: #4f94d4;
  100. box-shadow: 0 0 3px rgba(34, 113, 177, 0.8);
  101. /* Only visible in Windows High Contrast mode */
  102. outline: 2px solid transparent;
  103. outline-offset: -2px;
  104. }
  105. .media-widget-control .media-widget-preview {
  106. background: transparent;
  107. text-align: center;
  108. }
  109. .media-widget-control .media-widget-preview .notice {
  110. text-align: initial;
  111. }
  112. .media-frame .media-widget-embed-notice p code,
  113. .media-widget-control .notice p code {
  114. padding: 0 0 0 3px;
  115. }
  116. .media-frame .media-widget-embed-notice {
  117. margin-top: 16px;
  118. }
  119. .media-widget-control .media-widget-preview img {
  120. max-width: 100%;
  121. vertical-align: middle;
  122. background-image: linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7), linear-gradient(-45deg, #c3c4c7 25%, transparent 25%, transparent 75%, #c3c4c7 75%, #c3c4c7);
  123. background-position: 100% 0, 10px 10px;
  124. background-size: 20px 20px;
  125. }
  126. .media-widget-control .media-widget-preview .wp-video-shortcode {
  127. background: #000;
  128. }
  129. .media-frame.media-widget .media-toolbar-secondary {
  130. min-width: 300px;
  131. }
  132. .media-frame.media-widget .image-details .embed-media-settings .setting.align,
  133. .media-frame.media-widget .attachment-display-settings .setting.align,
  134. .media-frame.media-widget .embed-media-settings .setting.align,
  135. .media-frame.media-widget .embed-media-settings .legend-inline,
  136. .media-frame.media-widget .embed-link-settings .setting.link-text,
  137. .media-frame.media-widget .replace-attachment,
  138. .media-frame.media-widget .checkbox-setting.autoplay {
  139. display: none;
  140. }
  141. .media-widget-video-preview {
  142. width: 100%;
  143. }
  144. .media-widget-video-link {
  145. display: inline-block;
  146. min-height: 132px;
  147. width: 100%;
  148. background: #000;
  149. }
  150. .media-widget-video-link .dashicons {
  151. font: normal 60px/1 'dashicons';
  152. position: relative;
  153. width: 100%;
  154. top: -90px;
  155. color: #fff;
  156. text-decoration: none;
  157. }
  158. .media-widget-video-link.no-poster .dashicons {
  159. top: 30px;
  160. }
  161. .media-frame #embed-url-field.invalid,
  162. .media-widget-image-link > .link:invalid {
  163. border: 1px solid #d63638;
  164. }
  165. .media-widget-image-link {
  166. margin: 1em 0;
  167. }
  168. .media-widget-gallery-preview {
  169. display: flex;
  170. justify-content: flex-start;
  171. flex-wrap: wrap;
  172. margin: -1.79104477%;
  173. }
  174. .media-widget-preview.media_gallery,
  175. .media-widget-preview.media_image {
  176. cursor: pointer;
  177. }
  178. .media-widget-preview .placeholder {
  179. background: #f0f0f1;
  180. }
  181. .media-widget-gallery-preview .gallery-item {
  182. box-sizing: border-box;
  183. width: 50%;
  184. margin: 0;
  185. background: transparent;
  186. }
  187. .media-widget-gallery-preview .gallery-item .gallery-icon {
  188. margin: 4.5%;
  189. }
  190. /*
  191. * Use targeted nth-last-child selectors to control the size of each image
  192. * based on how many gallery items are present in the grid.
  193. * See: https://alistapart.com/article/quantity-queries-for-css
  194. */
  195. .media-widget-gallery-preview .gallery-item:nth-last-child(3):first-child,
  196. .media-widget-gallery-preview .gallery-item:nth-last-child(3):first-child ~ .gallery-item,
  197. .media-widget-gallery-preview .gallery-item:nth-last-child(n+5),
  198. .media-widget-gallery-preview .gallery-item:nth-last-child(n+5) ~ .gallery-item,
  199. .media-widget-gallery-preview .gallery-item:nth-last-child(n+6),
  200. .media-widget-gallery-preview .gallery-item:nth-last-child(n+6) ~ .gallery-item {
  201. max-width: 33.33%;
  202. }
  203. .media-widget-gallery-preview .gallery-item img {
  204. height: auto;
  205. vertical-align: bottom;
  206. }
  207. .media-widget-gallery-preview .gallery-icon {
  208. position: relative;
  209. }
  210. .media-widget-gallery-preview .gallery-icon-placeholder {
  211. position: absolute;
  212. top: 0;
  213. bottom: 0;
  214. width: 100%;
  215. box-sizing: border-box;
  216. display: flex;
  217. align-items: center;
  218. justify-content: center;
  219. background-color: rgba(0, 0, 0, 0.5);
  220. }
  221. .media-widget-gallery-preview .gallery-icon-placeholder-text {
  222. font-weight: 600;
  223. font-size: 2em;
  224. color: #fff;
  225. }
  226. /* Widget Dragging Helpers */
  227. .widget.ui-draggable-dragging {
  228. min-width: 100%;
  229. }
  230. .widget.ui-sortable-helper {
  231. opacity: 0.8;
  232. }
  233. .widget-placeholder {
  234. border: 1px dashed #c3c4c7;
  235. margin: 0 auto 10px;
  236. height: 45px;
  237. width: 100%;
  238. box-sizing: border-box;
  239. }
  240. #widgets-right .widget-placeholder {
  241. margin-top: 0;
  242. }
  243. #widgets-right .closed .widget-placeholder {
  244. height: 0;
  245. border: 0;
  246. margin-top: -10px;
  247. }
  248. /* Widget Sidebars */
  249. .sidebar-name {
  250. position: relative;
  251. box-sizing: border-box;
  252. }
  253. .js .sidebar-name {
  254. cursor: pointer;
  255. }
  256. .sidebar-name .handlediv {
  257. float: left;
  258. width: 38px;
  259. height: 38px;
  260. border: 0;
  261. margin: 0;
  262. padding: 8px;
  263. background: none;
  264. cursor: pointer;
  265. outline: none;
  266. }
  267. #widgets-right .sidebar-name .handlediv {
  268. margin: 5px 0 0 3px;
  269. }
  270. .sidebar-name .handlediv:focus {
  271. box-shadow: none;
  272. /* Only visible in Windows High Contrast mode */
  273. outline: 1px solid transparent;
  274. }
  275. #widgets-left .sidebar-name .toggle-indicator {
  276. display: none;
  277. }
  278. #widgets-left .widgets-holder-wrap.closed .sidebar-name .toggle-indicator,
  279. #widgets-left .sidebar-name:hover .toggle-indicator,
  280. #widgets-left .sidebar-name .handlediv:focus .toggle-indicator {
  281. display: block;
  282. }
  283. .sidebar-name .toggle-indicator:before {
  284. padding: 1px 0 1px 2px;
  285. border-radius: 50%;
  286. }
  287. .sidebar-name .handlediv:focus .toggle-indicator:before {
  288. box-shadow:
  289. 0 0 0 1px #4f94d4,
  290. 0 0 2px 1px rgba(79, 148, 212, 0.8);
  291. }
  292. .sidebar-name h2,
  293. .sidebar-name h3 {
  294. margin: 0;
  295. padding: 8px 10px;
  296. overflow: hidden;
  297. white-space: normal;
  298. line-height: 1.5;
  299. }
  300. .widgets-holder-wrap .description {
  301. padding: 0 0 15px;
  302. margin: 0;
  303. font-style: normal;
  304. color: #646970;
  305. }
  306. .widget-holder .description,
  307. .inactive-sidebar .description {
  308. color: #50575e;
  309. }
  310. #widgets-right .widgets-holder-wrap .description {
  311. padding-right: 7px;
  312. padding-left: 7px;
  313. }
  314. /* Widgets 2-col Layout */
  315. div.widget-liquid-left {
  316. margin: 0;
  317. width: 38%;
  318. float: right;
  319. }
  320. div.widget-liquid-right {
  321. float: left;
  322. width: 58%;
  323. }
  324. /* Widgets Left - Available Widgets */
  325. div#widgets-left {
  326. padding-top: 12px;
  327. }
  328. div#widgets-left .closed .sidebar-name,
  329. div#widgets-left .inactive-sidebar.closed .sidebar-name {
  330. margin-bottom: 10px;
  331. }
  332. div#widgets-left .sidebar-name h2,
  333. div#widgets-left .sidebar-name h3 {
  334. padding: 10px 0;
  335. margin: 0 0 0 10px;
  336. }
  337. #widgets-left .widgets-holder-wrap,
  338. div#widgets-left .widget-holder {
  339. background: transparent;
  340. border: none;
  341. }
  342. #widgets-left .widgets-holder-wrap {
  343. border: none;
  344. box-shadow: none;
  345. }
  346. #available-widgets .widget {
  347. margin: 0;
  348. }
  349. #available-widgets .widget:nth-child(odd) {
  350. clear: both;
  351. }
  352. #available-widgets .widget .widget-description {
  353. display: block;
  354. padding: 10px 15px;
  355. font-size: 12px;
  356. overflow-wrap: break-word;
  357. word-wrap: break-word;
  358. -ms-word-break: break-all;
  359. word-break: break-word;
  360. -webkit-hyphens: auto;
  361. hyphens: auto;
  362. }
  363. #available-widgets #widget-list {
  364. position: relative;
  365. }
  366. /* Inactive Sidebars */
  367. #widgets-left .inactive-sidebar {
  368. clear: both;
  369. width: 100%;
  370. background: transparent;
  371. padding: 0;
  372. margin: 0 0 20px;
  373. border: none;
  374. box-shadow: none;
  375. }
  376. #widgets-left .inactive-sidebar.first {
  377. margin-top: 40px;
  378. }
  379. /* Not sure what this is for... */
  380. div#widgets-left .inactive-sidebar .widget.expanded {
  381. right: auto;
  382. }
  383. .widget-title-action {
  384. float: left;
  385. position: relative;
  386. }
  387. div#widgets-left .inactive-sidebar .widgets-sortables {
  388. min-height: 42px;
  389. padding: 0;
  390. background: transparent;
  391. margin: 0;
  392. position: relative;
  393. }
  394. /* Widgets Right */
  395. div#widgets-right .sidebars-column-1,
  396. div#widgets-right .sidebars-column-2 {
  397. max-width: 450px;
  398. }
  399. div#widgets-right .widgets-holder-wrap {
  400. margin: 10px 0 0;
  401. }
  402. div#widgets-right .sidebar-description {
  403. min-height: 20px;
  404. margin-top: -5px;
  405. }
  406. div#widgets-right .sidebar-name h2,
  407. div#widgets-right .sidebar-name h3 {
  408. padding: 15px 7px 15px 15px;
  409. }
  410. div#widgets-right .widget-top {
  411. padding: 0;
  412. }
  413. div#widgets-right .widgets-sortables {
  414. padding: 0 8px;
  415. margin-bottom: 9px;
  416. position: relative;
  417. min-height: 123px;
  418. }
  419. div#widgets-right .closed .widgets-sortables {
  420. min-height: 0;
  421. margin-bottom: 0;
  422. }
  423. .sidebar-name .spinner,
  424. .remove-inactive-widgets .spinner {
  425. float: none;
  426. position: relative;
  427. top: -2px;
  428. margin: -5px 5px;
  429. }
  430. .sidebar-name .spinner {
  431. position: absolute;
  432. top: 18px;
  433. left: 30px;
  434. }
  435. /* Dragging a widget over a closed sidebar */
  436. #widgets-right .widgets-holder-wrap.widget-hover {
  437. border-color: #787c82;
  438. box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  439. }
  440. /* Accessibility Mode */
  441. .widget-access-link {
  442. float: left;
  443. margin: -5px 10px 10px 0;
  444. }
  445. .widgets_access #widgets-left .widget .widget-top {
  446. cursor: auto;
  447. }
  448. .widgets_access #wpwrap .widgets-holder-wrap.closed .sidebar-description,
  449. .widgets_access #wpwrap .widgets-holder-wrap.closed .widget,
  450. .widgets_access #wpwrap .widget-control-edit {
  451. display: block;
  452. }
  453. .widgets_access #widgets-left .widget .widget-top:hover,
  454. .widgets_access #widgets-right .widget .widget-top:hover {
  455. border-color: #dcdcde;
  456. }
  457. #available-widgets .widget-control-edit .edit,
  458. #available-widgets .widget-action .edit,
  459. #widgets-left .inactive-sidebar .widget-control-edit .add,
  460. #widgets-left .inactive-sidebar .widget-action .add,
  461. #widgets-right .widget-control-edit .add,
  462. #widgets-right .widget-action .add {
  463. display: none;
  464. }
  465. .widget-control-edit {
  466. display: block;
  467. color: #646970;
  468. background: #f0f0f1;
  469. padding: 0 15px;
  470. line-height: 3.30769230;
  471. border-right: 1px solid #dcdcde;
  472. }
  473. #widgets-left .widget-control-edit:hover,
  474. #widgets-right .widget-control-edit:hover {
  475. color: #fff;
  476. background: #3c434a;
  477. border-right: 0;
  478. outline: 1px solid #3c434a;
  479. }
  480. .widgets-holder-wrap .sidebar-name,
  481. .widgets-holder-wrap .sidebar-description {
  482. -webkit-user-select: none;
  483. user-select: none;
  484. }
  485. .editwidget {
  486. margin: 0 auto;
  487. }
  488. .editwidget .widget-inside {
  489. display: block;
  490. padding: 0 15px;
  491. }
  492. .editwidget .widget-control-actions {
  493. margin-top: 20px;
  494. }
  495. .js .widgets-holder-wrap.closed .widget,
  496. .js .widgets-holder-wrap.closed .sidebar-description,
  497. .js .widgets-holder-wrap.closed .remove-inactive-widgets,
  498. .js .widgets-holder-wrap.closed .description,
  499. .js .closed br.clear {
  500. display: none;
  501. }
  502. .js .widgets-holder-wrap.closed .widget.ui-sortable-helper {
  503. display: block;
  504. }
  505. /* Hide Widget Settings by Default */
  506. .widget-inside,
  507. .widget-description {
  508. display: none;
  509. }
  510. .widget-inside {
  511. background: #fff;
  512. }
  513. .widget-inside select {
  514. max-width: 100%;
  515. }
  516. /* Dragging widgets over the available widget area show's a "Deactivate" message */
  517. #removing-widget {
  518. display: none;
  519. font-weight: 400;
  520. padding-right: 15px;
  521. font-size: 12px;
  522. line-height: 1;
  523. color: #000;
  524. }
  525. .js #removing-widget {
  526. color: #72aee6;
  527. }
  528. .widget-control-noform,
  529. #access-off,
  530. .widgets_access .widget-action,
  531. .widgets_access .handlediv,
  532. .widgets_access #access-on,
  533. .widgets_access .widget-holder .description,
  534. .no-js .widget-holder .description {
  535. display: none;
  536. }
  537. .widgets_access .widget-holder,
  538. .widgets_access #widget-list {
  539. padding-top: 10px;
  540. }
  541. .widgets_access #access-off {
  542. display: inline;
  543. }
  544. .widgets_access .sidebar-name,
  545. .widgets_access .widget .widget-top {
  546. cursor: default;
  547. }
  548. /* Widgets Area Chooser */
  549. .widget-liquid-left #widgets-left.chooser #available-widgets .widget,
  550. .widget-liquid-left #widgets-left.chooser .inactive-sidebar {
  551. transition: opacity 0.1s linear;
  552. }
  553. .widget-liquid-left #widgets-left.chooser #available-widgets .widget,
  554. .widget-liquid-left #widgets-left.chooser .inactive-sidebar {
  555. /* -webkit-filter: blur(1px); */
  556. opacity: 0.2;
  557. pointer-events: none;
  558. }
  559. .widget-liquid-left #widgets-left.chooser #available-widgets .widget-in-question {
  560. /* -webkit-filter: none; */
  561. opacity: 1;
  562. pointer-events: auto;
  563. }
  564. .widgets-chooser ul,
  565. #widgets-left .widget-in-question .widget-top,
  566. #available-widgets .widget-top:hover,
  567. div#widgets-right .widget-top:hover,
  568. #widgets-left .widget-top:hover {
  569. border-color: #8c8f94;
  570. box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  571. }
  572. .widgets-chooser ul.widgets-chooser-sidebars {
  573. margin: 0;
  574. list-style-type: none;
  575. max-height: 300px;
  576. overflow: auto;
  577. }
  578. .widgets-chooser {
  579. display: none;
  580. }
  581. .widgets-chooser ul {
  582. border: 1px solid #c3c4c7;
  583. }
  584. .widgets-chooser li {
  585. border-bottom: 1px solid #c3c4c7;
  586. background: #fff;
  587. margin: 0;
  588. position: relative;
  589. }
  590. .widgets-chooser .widgets-chooser-button {
  591. width: 100%;
  592. padding: 10px 35px 10px 15px;
  593. background: transparent;
  594. border: 0;
  595. box-sizing: border-box;
  596. text-align: right;
  597. cursor: pointer;
  598. transition: background 0.2s ease-in-out;
  599. }
  600. /* @todo looks like these hover/focus states are overridden by .widgets-chooser-selected */
  601. .widgets-chooser .widgets-chooser-button:hover,
  602. .widgets-chooser .widgets-chooser-button:focus {
  603. outline: none;
  604. text-decoration: underline;
  605. }
  606. .widgets-chooser li:last-child {
  607. border: none;
  608. }
  609. .widgets-chooser .widgets-chooser-selected .widgets-chooser-button {
  610. background: #2271b1;
  611. color: #fff;
  612. }
  613. .widgets-chooser .widgets-chooser-selected:before {
  614. content: "\f147";
  615. display: block;
  616. -webkit-font-smoothing: antialiased;
  617. font: normal 26px/1 dashicons;
  618. color: #fff;
  619. position: absolute;
  620. top: 7px;
  621. right: 5px;
  622. }
  623. .widgets-chooser .widgets-chooser-actions {
  624. padding: 10px 0 12px;
  625. text-align: center;
  626. }
  627. #available-widgets .widget .widget-top {
  628. cursor: pointer;
  629. }
  630. #available-widgets .widget.ui-draggable-dragging .widget-top {
  631. cursor: move;
  632. }
  633. /* =Specific widget styling
  634. -------------------------------------------------------------- */
  635. .text-widget-fields {
  636. position: relative;
  637. }
  638. .text-widget-fields [hidden] {
  639. display: none;
  640. }
  641. .text-widget-fields .wp-pointer.wp-pointer-top {
  642. position: absolute;
  643. z-index: 3;
  644. top: 100px;
  645. left: 10px;
  646. right: 10px;
  647. }
  648. .text-widget-fields .wp-pointer .wp-pointer-arrow {
  649. right: auto;
  650. left: 15px;
  651. }
  652. .text-widget-fields .wp-pointer .wp-pointer-buttons {
  653. line-height: 1.4;
  654. }
  655. .custom-html-widget-fields > p > .CodeMirror {
  656. border: 1px solid #dcdcde;
  657. }
  658. .custom-html-widget-fields code {
  659. padding-top: 1px;
  660. padding-bottom: 1px;
  661. }
  662. ul.CodeMirror-hints {
  663. z-index: 101; /* Due to z-index 100 set on .widget.open */
  664. }
  665. .widget-control-actions .custom-html-widget-save-button.button.validation-blocked {
  666. cursor: not-allowed;
  667. }
  668. /* =Media Queries
  669. -------------------------------------------------------------- */
  670. @media screen and (max-width: 782px) {
  671. .widgets-holder-wrap .widget-inside input[type="checkbox"],
  672. .widgets-holder-wrap .widget-inside input[type="radio"],
  673. .editwidget .widget-inside input[type="checkbox"], /* Selectors for the "accessibility mode" page. */
  674. .editwidget .widget-inside input[type="radio"] {
  675. margin: 0.25rem 0 0.25rem 0.25rem;
  676. }
  677. }
  678. @media screen and (max-width: 480px) {
  679. div.widget-liquid-left {
  680. width: 100%;
  681. float: none;
  682. border-left: none;
  683. padding-left: 0;
  684. }
  685. #widgets-left .sidebar-name {
  686. margin-left: 0;
  687. }
  688. #widgets-left #available-widgets .widget-top {
  689. margin-left: 0;
  690. }
  691. #widgets-left .inactive-sidebar .widgets-sortables {
  692. margin-left: 0;
  693. }
  694. div.widget-liquid-right {
  695. width: 100%;
  696. float: none;
  697. }
  698. div.widget {
  699. max-width: 480px;
  700. }
  701. .widget-access-link {
  702. float: none;
  703. margin: 15px 0 0;
  704. }
  705. }
  706. @media screen and (max-width: 320px) {
  707. div.widget {
  708. max-width: 320px;
  709. }
  710. }
  711. @media only screen and (min-width: 1250px) {
  712. #widgets-left #available-widgets .widget {
  713. width: 49%;
  714. float: right;
  715. }
  716. .widget.ui-draggable-dragging {
  717. min-width: 49%;
  718. }
  719. #widgets-left #available-widgets .widget:nth-child(even) {
  720. float: left;
  721. }
  722. #widgets-right .sidebars-column-1,
  723. #widgets-right .sidebars-column-2 {
  724. float: right;
  725. width: 49%;
  726. }
  727. #widgets-right .sidebars-column-1 {
  728. margin-left: 2%;
  729. }
  730. #widgets-right.single-sidebar .sidebars-column-1,
  731. #widgets-right.single-sidebar .sidebars-column-2 {
  732. float: none;
  733. width: 100%;
  734. margin: 0;
  735. }
  736. }