wp-admin/css/customize-widgets-rtl.css

   1 .wp-full-overlay-sidebar {
   2         overflow: visible;
   3 }
   4
   5 /**
   6  * Hide all sidebar sections by default, only show them (via JS) once the
   7  * preview loads and we know whether the sidebars are used in the template.
   8  */
   9
  10 .control-section.control-section-sidebar,
  11 .customize-control-sidebar_widgets label,
  12 .customize-control-sidebar_widgets .hide-if-js {
  13         /* The link in .customize-control-sidebar_widgets .hide-if-js will fail if it ever gets used. */
  14         display: none;
  15 }
  16
  17 .control-section.control-section-sidebar .accordion-section-content.ui-sortable {
  18         overflow: visible;
  19 }
  20
  21 .customize-control-widget_form .widget-top {
  22         background: #fff;
  23         -webkit-transition: opacity 0.5s;
  24         transition: opacity 0.5s;
  25 }
  26
  27 .customize-control .widget-action {
  28         color: #72777c;
  29 }
  30
  31 .customize-control .widget-top:hover .widget-action,
  32 .customize-control .widget-action:focus {
  33         color: #23282d;
  34 }
  35
  36 .customize-control-widget_form:not(.widget-rendered) .widget-top {
  37         opacity: 0.5;
  38 }
  39
  40 .customize-control-widget_form .widget-control-save {
  41         display: none;
  42 }
  43
  44 .customize-control-widget_form .spinner {
  45         visibility: hidden;
  46         margin-top: 0;
  47 }
  48
  49 .customize-control-widget_form.previewer-loading .spinner {
  50         visibility: visible;
  51 }
  52
  53 .customize-control-widget_form.widget-form-disabled .widget-content {
  54         opacity: 0.7;
  55         pointer-events: none;
  56         -moz-user-select: none;
  57         -webkit-user-select: none;
  58         -ms-user-select: none;
  59         user-select: none;
  60 }
  61
  62 .customize-control-widget_form .widget {
  63         margin-bottom: 0;
  64 }
  65
  66 .customize-control-widget_form.wide-widget-control .widget-inside {
  67         position: fixed;
  68         right: 299px;
  69         top: 25%;
  70         border: 1px solid rgb(229, 229, 229);
  71         overflow: auto;
  72 }
  73 .customize-control-widget_form.wide-widget-control .widget-inside > .form {
  74         padding: 20px;
  75 }
  76
  77 .customize-control-widget_form.wide-widget-control .widget-top {
  78         -webkit-transition: background-color 0.4s;
  79         transition: background-color 0.4s;
  80 }
  81 .customize-control-widget_form.wide-widget-control.expanding .widget-top,
  82 .customize-control-widget_form.wide-widget-control.expanded:not(.collapsing) .widget-top {
  83         background-color: rgb(227, 227, 227);
  84 }
  85
  86 .widget-inside {
  87         padding: 1px 10px 10px 10px;
  88         border-top: none;
  89         line-height: 16px;
  90 }
  91
  92 .customize-control-widget_form.expanded a.widget-action:after {
  93         content: "\f142";
  94 }
  95
  96 .customize-control-widget_form.wide-widget-control a.widget-action:after {
  97         content: "\f141";
  98 }
  99
 100 .customize-control-widget_form.wide-widget-control.expanded a.widget-action:after {
 101         content: "\f139";
 102 }
 103
 104 .widget-title-action {
 105         cursor: pointer;
 106 }
 107
 108 .widget-top,
 109 .customize-control-widget_form .widget .customize-control-title {
 110         cursor: move;
 111 }
 112
 113 .control-section.accordion-section.highlighted > .accordion-section-title,
 114 .customize-control-widget_form.highlighted {
 115         outline: none;
 116         -webkit-box-shadow: 0 0 2px rgba(30,140,190,0.8);
 117         box-shadow: 0 0 2px rgba(30,140,190,0.8);
 118         position: relative;
 119         z-index: 1;
 120 }
 121
 122 #widget-customizer-control-templates {
 123         display: none;
 124 }
 125
 126 /**
 127  * Widget reordering styles
 128  */
 129
 130 #customize-theme-controls .widget-reorder-nav {
 131         display: none;
 132         float: left;
 133         background-color: #fafafa;
 134 }
 135
 136 .move-widget:before {
 137         content: "\f504";
 138 }
 139
 140 #customize-theme-controls .move-widget-area {
 141         display: none;
 142         background: #fff;
 143         border: 1px solid #ddd;
 144         border-top: none;
 145         cursor: auto;
 146 }
 147
 148 #customize-theme-controls .reordering .move-widget-area.active {
 149         display: block;
 150 }
 151
 152 #customize-theme-controls .move-widget-area .description {
 153         margin: 0;
 154         padding: 15px 20px;
 155         font-weight: 400;
 156 }
 157
 158 #customize-theme-controls .widget-area-select {
 159         margin: 0;
 160         padding: 0;
 161         list-style: none;
 162 }
 163
 164 #customize-theme-controls .widget-area-select li {
 165         position: relative;
 166         margin: 0;
 167         padding: 13px 42px 15px 15px;
 168         color: #555;
 169         border-top: 1px solid #eee;
 170         cursor: pointer;
 171         -webkit-user-select: none;
 172         -moz-user-select: none;
 173         -ms-user-select: none;
 174         user-select: none;
 175 }
 176
 177 #customize-theme-controls .widget-area-select li:before {
 178         display: none;
 179         content: "\f147";
 180         position: absolute;
 181         top: 12px;
 182         right: 10px;
 183         font: normal 20px/1 dashicons;
 184         -webkit-font-smoothing: antialiased;
 185         -moz-osx-font-smoothing: grayscale;
 186 }
 187
 188 #customize-theme-controls .widget-area-select li:last-child {
 189         border-bottom: 1px solid #eee;
 190 }
 191
 192 #customize-theme-controls .widget-area-select .selected {
 193         color: #fff;
 194         text-shadow: 0 -1px 0 rgba(0,0,0,.4);
 195         background: #00a0d2;
 196 }
 197
 198 #customize-theme-controls .widget-area-select .selected:before {
 199         display: block;
 200 }
 201
 202 #customize-theme-controls .move-widget-actions {
 203         text-align: left;
 204         padding: 12px;
 205 }
 206
 207 #customize-theme-controls .reordering .widget-title-action {
 208         display: none;
 209 }
 210
 211 #customize-theme-controls .reordering .widget-reorder-nav {
 212         display: block;
 213 }
 214
 215 /**
 216  * Styles for new widget addition panel
 217  */
 218
 219 /* override widgets admin page rules in wp-admin/css/widgets.css */
 220 #widgets-left #available-widgets .widget {
 221         float: none !important;
 222         width: auto !important;
 223 }
 224
 225 .ios #available-widgets {
 226         -webkit-transition: right 0s;
 227         transition: right 0s;
 228 }
 229
 230 #available-widgets .widget-tpl:hover,
 231 #available-widgets .widget-tpl.selected {
 232         background: #eee;
 233         border-bottom-color: #ccc;
 234 }
 235
 236 #customize-controls .widget-title h3 {
 237         font-size: 1em;
 238 }
 239
 240 #available-widgets .widget-title h3 {
 241         padding: 0 0 5px;
 242         font-size: 14px;
 243 }
 244
 245 #available-widgets .widget .widget-description {
 246         padding: 0;
 247         color: #72777c;
 248 }
 249
 250 #customize-preview {
 251         -webkit-transition: all 0.2s;
 252         transition: all 0.2s;
 253 }
 254
 255 body.adding-widget #available-widgets {
 256         right: 0;
 257         visibility: visible;
 258 }
 259
 260 body.adding-widget .wp-full-overlay-main {
 261         right: 300px;
 262 }
 263
 264 body.adding-widget #customize-preview {
 265         opacity: 0.4;
 266 }
 267
 268
 269 /**
 270  * Widget Icon styling
 271  * No plurals in naming.
 272  * Ordered from lowest to highest specificity.
 273  */
 274
 275 #available-widgets .widget-title {
 276         position: relative;
 277 }
 278
 279 #available-widgets .widget-title:before {
 280         content: "\f132";
 281         position: absolute;
 282         top: -3px;
 283         left: 100%;
 284         margin-left: 20px;
 285         width: 20px;
 286         height: 20px;
 287         color: #32373c;
 288         font: normal 20px/1 dashicons;
 289         text-align: center;
 290         -webkit-box-sizing: border-box;
 291         -moz-box-sizing: border-box;
 292         box-sizing: border-box;
 293         -webkit-font-smoothing: antialiased;
 294         -moz-osx-font-smoothing: grayscale;
 295 }
 296
 297 /* smiley */
 298 #available-widgets [class*="easy"] .widget-title:before { content: "\f328"; top: -4px; }
 299
 300 /* star-filled */
 301 #available-widgets [class*="super"] .widget-title:before,
 302 #available-widgets [class*="like"] .widget-title:before { content: "\f155"; top: -4px; }
 303
 304 /* wordpress */
 305 #available-widgets [class*="meta"] .widget-title:before { content: "\f120"; }
 306
 307 /* archive-box */
 308 #available-widgets [class*="archives"] .widget-title:before { content: "\f480"; top: -4px; }
 309
 310 /* category */
 311 #available-widgets [class*="categor"] .widget-title:before { content: "\f318"; top: -4px; }
 312
 313 /* comments */
 314 #available-widgets [class*="comment"] .widget-title:before,
 315 #available-widgets [class*="testimonial"] .widget-title:before,
 316 #available-widgets [class*="chat"] .widget-title:before { content: "\f101"; }
 317
 318 /* post */
 319 #available-widgets [class*="post"] .widget-title:before { content: "\f109"; }
 320
 321 /* admin-page */
 322 #available-widgets [class*="page"] .widget-title:before { content: "\f105"; }
 323
 324 /* text */
 325 #available-widgets [class*="text"] .widget-title:before { content: "\f478"; }
 326
 327 /* links */
 328 #available-widgets [class*="link"] .widget-title:before { content: "\f103"; }
 329
 330 /* search */
 331 #available-widgets [class*="search"] .widget-title:before { content: "\f179"; }
 332
 333 /* menu */
 334 #available-widgets [class*="menu"] .widget-title:before,
 335 #available-widgets [class*="nav"] .widget-title:before { content: "\f333"; }
 336
 337 /* tag-cloud */
 338 #available-widgets [class*="tag"] .widget-title:before { content: "\f479"; }
 339
 340 /* rss */
 341 #available-widgets [class*="rss"] .widget-title:before { content: "\f303"; top: -6px; }
 342
 343 /* calendar */
 344 #available-widgets [class*="event"] .widget-title:before,
 345 #available-widgets [class*="calendar"] .widget-title:before { content: "\f145"; top: -4px;}
 346
 347 /* format-image */
 348 #available-widgets [class*="image"] .widget-title:before,
 349 #available-widgets [class*="photo"] .widget-title:before,
 350 #available-widgets [class*="slide"] .widget-title:before,
 351 #available-widgets [class*="instagram"] .widget-title:before { content: "\f128"; }
 352
 353 /* format-gallery */
 354 #available-widgets [class*="album"] .widget-title:before,
 355 #available-widgets [class*="galler"] .widget-title:before { content: "\f161"; }
 356
 357 /* format-video */
 358 #available-widgets [class*="video"] .widget-title:before,
 359 #available-widgets [class*="tube"] .widget-title:before { content: "\f126"; }
 360
 361 /* format-audio */
 362 #available-widgets [class*="music"] .widget-title:before,
 363 #available-widgets [class*="radio"] .widget-title:before,
 364 #available-widgets [class*="audio"] .widget-title:before { content: "\f127"; }
 365
 366 /* admin-users */
 367 #available-widgets [class*="login"] .widget-title:before,
 368 #available-widgets [class*="user"] .widget-title:before,
 369 #available-widgets [class*="member"] .widget-title:before,
 370 #available-widgets [class*="avatar"] .widget-title:before,
 371 #available-widgets [class*="subscriber"] .widget-title:before,
 372 #available-widgets [class*="profile"] .widget-title:before,
 373 #available-widgets [class*="grofile"] .widget-title:before { content: "\f110"; }
 374
 375 /* cart */
 376 #available-widgets [class*="commerce"] .widget-title:before,
 377 #available-widgets [class*="shop"] .widget-title:before,
 378 #available-widgets [class*="cart"] .widget-title:before { content: "\f174"; top: -4px; }
 379
 380 /* shield */
 381 #available-widgets [class*="secur"] .widget-title:before,
 382 #available-widgets [class*="firewall"] .widget-title:before { content: "\f332"; }
 383
 384 /* chart-bar */
 385 #available-widgets [class*="analytic"] .widget-title:before,
 386 #available-widgets [class*="stat"] .widget-title:before,
 387 #available-widgets [class*="poll"] .widget-title:before { content: "\f185"; }
 388
 389 /* feedback */
 390 #available-widgets [class*="form"] .widget-title:before { content: "\f175"; }
 391
 392 /* email-alt */
 393 #available-widgets [class*="subscribe"] .widget-title:before,
 394 #available-widgets [class*="news"] .widget-title:before,
 395 #available-widgets [class*="contact"] .widget-title:before,
 396 #available-widgets [class*="mail"] .widget-title:before { content: "\f466"; }
 397
 398 /* share */
 399 #available-widgets [class*="share"] .widget-title:before,
 400 #available-widgets [class*="socia"] .widget-title:before { content: "\f237"; }
 401
 402 /* translation */
 403 #available-widgets [class*="lang"] .widget-title:before,
 404 #available-widgets [class*="translat"] .widget-title:before { content: "\f326"; }
 405
 406 /* location-alt */
 407 #available-widgets [class*="locat"] .widget-title:before,
 408 #available-widgets [class*="map"] .widget-title:before { content: "\f231"; }
 409
 410 /* download */
 411 #available-widgets [class*="download"] .widget-title:before { content: "\f316"; }
 412
 413 /* cloud */
 414 #available-widgets [class*="weather"] .widget-title:before { content: "\f176"; top: -4px;}
 415
 416 /* facebook */
 417 #available-widgets [class*="facebook"] .widget-title:before { content: "\f304"; }
 418
 419 /* twitter */
 420 #available-widgets [class*="tweet"] .widget-title:before,
 421 #available-widgets [class*="twitter"] .widget-title:before { content: "\f301"; }
 422
 423 @media screen and (max-height: 700px) and (min-width: 981px) {
 424         .customize-control-widget {
 425                 margin-bottom: 0;
 426         }
 427         .widget-top {
 428                 -webkit-box-shadow: none;
 429                 box-shadow: none;
 430                 margin-top: -1px;
 431         }
 432         .widget-top:hover {
 433                 position: relative;
 434                 z-index: 1;
 435         }
 436         .last-widget {
 437                 margin-bottom: 15px;
 438         }
 439         .widget-title h3 {
 440                 padding: 13px 15px;
 441         }
 442         .widget-reorder-nav span {
 443                 height: 39px;
 444         }
 445         .widget-reorder-nav span:before {
 446                 line-height: 39px;
 447         }
 448         #customize-theme-controls .widget-area-select li {
 449                 padding: 9px 42px 11px 15px;
 450         }
 451         #customize-theme-controls .widget-area-select li:before {
 452                 top: 8px;
 453         }
 454 }