[Summary view] [Print] [Text view]

   1  /*! This file is auto-generated */
   2  .wp-full-overlay-sidebar {
   3      overflow: visible;
   4  }
   5  
   6  /**
   7   * Hide all sidebar sections by default, only show them (via JS) once the
   8   * preview loads and we know whether the sidebars are used in the template.
   9   */
  10  
  11  .control-section.control-section-sidebar,
  12  .customize-control-sidebar_widgets label,
  13  .customize-control-sidebar_widgets .hide-if-js {
  14      /* The link in .customize-control-sidebar_widgets .hide-if-js will fail if it ever gets used. */
  15      display: none;
  16  }
  17  
  18  .control-section.control-section-sidebar .accordion-section-content.ui-sortable {
  19      overflow: visible;
  20  }
  21  
  22  /* Note: widget-tops are more compact when (max-height: 700px) and (min-width: 981px). */
  23  .customize-control-widget_form .widget-top {
  24      background: #fff;
  25      transition: opacity 0.5s;
  26  }
  27  
  28  .customize-control .widget-action {
  29      color: #787c82;
  30  }
  31  
  32  .customize-control .widget-top:hover .widget-action,
  33  .customize-control .widget-action:focus {
  34      color: #1d2327;
  35  }
  36  
  37  .customize-control-widget_form:not(.widget-rendered) .widget-top {
  38      opacity: 0.5;
  39  }
  40  
  41  .customize-control-widget_form .widget-control-save {
  42      display: none;
  43  }
  44  
  45  .customize-control-widget_form .spinner {
  46      visibility: hidden;
  47      margin-top: 0;
  48  }
  49  
  50  .customize-control-widget_form.previewer-loading .spinner {
  51      visibility: visible;
  52  }
  53  
  54  .customize-control-widget_form.widget-form-disabled .widget-content {
  55      opacity: 0.7;
  56      pointer-events: none;
  57      -webkit-user-select: none;
  58      user-select: none;
  59  }
  60  
  61  .customize-control-widget_form .widget {
  62      margin-bottom: 0;
  63  }
  64  
  65  .customize-control-widget_form.wide-widget-control .widget-inside {
  66      position: fixed;
  67      right: 299px;
  68      top: 25%;
  69      border: 1px solid #dcdcde;
  70      overflow: auto;
  71  }
  72  .customize-control-widget_form.wide-widget-control .widget-inside > .form {
  73      padding: 20px;
  74  }
  75  
  76  .customize-control-widget_form.wide-widget-control .widget-top {
  77      transition: background-color 0.4s;
  78  }
  79  .customize-control-widget_form.wide-widget-control.expanding .widget-top,
  80  .customize-control-widget_form.wide-widget-control.expanded:not(.collapsing) .widget-top {
  81      background-color: #dcdcde;
  82  }
  83  
  84  .widget-inside {
  85      padding: 1px 10px 10px;
  86      border-top: none;
  87      line-height: 1.23076923;
  88  }
  89  
  90  .customize-control-widget_form.expanded .widget-action .toggle-indicator:before {
  91      content: "\f142";
  92  }
  93  
  94  .customize-control-widget_form.wide-widget-control .widget-action .toggle-indicator:before {
  95      content: "\f141";
  96  }
  97  
  98  .customize-control-widget_form.wide-widget-control.expanded .widget-action .toggle-indicator:before {
  99      content: "\f139";
 100  }
 101  
 102  .widget-title-action {
 103      cursor: pointer;
 104  }
 105  
 106  .widget-top,
 107  .customize-control-widget_form .widget .customize-control-title {
 108      cursor: move;
 109  }
 110  
 111  .control-section.accordion-section.highlighted > .accordion-section-title,
 112  .customize-control-widget_form.highlighted {
 113      outline: none;
 114      box-shadow: 0 0 2px rgba(79, 148, 212, 0.8);
 115      position: relative;
 116      z-index: 1;
 117  }
 118  
 119  #widget-customizer-control-templates {
 120      display: none;
 121  }
 122  
 123  /**
 124   * Widget reordering styles
 125   */
 126  
 127  #customize-theme-controls .widget-reorder-nav {
 128      display: none;
 129      float: left;
 130      background-color: #f6f7f7;
 131  }
 132  
 133  .move-widget:before {
 134      content: "\f504";
 135      content: "\f504" / '';
 136  }
 137  
 138  #customize-theme-controls .move-widget-area {
 139      display: none;
 140      background: #fff;
 141      border: 1px solid #c3c4c7;
 142      border-top: none;
 143      cursor: auto;
 144  }
 145  
 146  #customize-theme-controls .reordering .move-widget-area.active {
 147      display: block;
 148  }
 149  
 150  #customize-theme-controls .move-widget-area .description {
 151      margin: 0;
 152      padding: 15px 20px;
 153      font-weight: 400;
 154  }
 155  
 156  #customize-theme-controls .widget-area-select {
 157      margin: 0;
 158      padding: 0;
 159      list-style: none;
 160  }
 161  
 162  #customize-theme-controls .widget-area-select li {
 163      position: relative;
 164      margin: 0;
 165      padding: 13px 42px 15px 15px;
 166      color: #50575e;
 167      border-top: 1px solid #c3c4c7;
 168      cursor: pointer;
 169      -webkit-user-select: none;
 170      user-select: none;
 171  }
 172  
 173  #customize-theme-controls .widget-area-select li:before {
 174      display: none;
 175      content: "\f147";
 176      content: "\f147" / '';
 177      position: absolute;
 178      top: 12px;
 179      right: 10px;
 180      font: normal 20px/1 dashicons;
 181      -webkit-font-smoothing: antialiased;
 182      -moz-osx-font-smoothing: grayscale;
 183  }
 184  
 185  #customize-theme-controls .widget-area-select li:last-child {
 186      border-bottom: 1px solid #c3c4c7;
 187  }
 188  
 189  #customize-theme-controls .widget-area-select .selected {
 190      color: #fff;
 191      background: var(--wp-admin-theme-color);
 192  }
 193  
 194  #customize-theme-controls .widget-area-select .selected:before {
 195      display: block;
 196  }
 197  
 198  #customize-theme-controls .move-widget-actions {
 199      text-align: left;
 200      padding: 12px;
 201  }
 202  
 203  #customize-theme-controls .reordering .widget-title-action {
 204      display: none;
 205  }
 206  
 207  #customize-theme-controls .reordering .widget-reorder-nav {
 208      display: block;
 209  }
 210  
 211  /* Text Widget */
 212  .wp-customizer div.mce-inline-toolbar-grp,
 213  .wp-customizer div.mce-tooltip {
 214      z-index: 500100 !important;
 215  }
 216  .wp-customizer .ui-autocomplete.wplink-autocomplete {
 217      z-index: 500110; /* originally 100110, but z-index of .wp-full-overlay is 500000 */
 218  }
 219  .wp-customizer #wp-link-backdrop {
 220      z-index: 500100; /* originally 100100, but z-index of .wp-full-overlay is 500000 */
 221  }
 222  .wp-customizer #wp-link-wrap {
 223      z-index: 500105; /* originally 100105, but z-index of .wp-full-overlay is 500000 */
 224  }
 225  
 226  /**
 227   * Styles for new widget addition panel
 228   */
 229  
 230  /* override widgets admin page rules in wp-admin/css/widgets.css */
 231  #widgets-left #available-widgets .widget {
 232      float: none !important;
 233      width: auto !important;
 234  }
 235  
 236  /* Keep rule that is no longer necessary on widgets.php. */
 237  #available-widgets .widget-action {
 238      display: none;
 239  }
 240  
 241  .ios #available-widgets {
 242      transition: right 0s;
 243  }
 244  
 245  #available-widgets .widget-tpl:hover,
 246  #available-widgets .widget-tpl.selected {
 247      background: #f6f7f7;
 248      border-bottom-color: #c3c4c7;
 249      color: var(--wp-admin-theme-color);;
 250      border-right: 4px solid var(--wp-admin-theme-color);
 251  }
 252  
 253  #customize-controls .widget-title h3 {
 254      font-size: 1em;
 255  }
 256  
 257  #available-widgets .widget-title h3 {
 258      padding: 0 0 5px;
 259      font-size: 14px;
 260  }
 261  
 262  #available-widgets .widget .widget-description {
 263      padding: 0;
 264      color: #646970;
 265  }
 266  
 267  @media (prefers-reduced-motion: no-preference) {
 268      #customize-preview {
 269          transition: all 0.2s;
 270      }
 271  }
 272  
 273  body.adding-widget #available-widgets {
 274      right: 0;
 275      visibility: visible;
 276  }
 277  
 278  body.adding-widget .wp-full-overlay-main {
 279      right: 300px;
 280  }
 281  
 282  body.adding-widget #customize-preview {
 283      opacity: 0.4;
 284  }
 285  
 286  
 287  /**
 288   * Widget Icon styling
 289   * No plurals in naming.
 290   * Ordered from lowest to highest specificity.
 291   */
 292  
 293  #available-widgets .widget-title {
 294      position: relative;
 295  }
 296  
 297  #available-widgets .widget-title:before {
 298      content: "\f132";
 299      content: "\f132" / '';
 300      position: absolute;
 301      top: -3px;
 302      left: 100%;
 303      margin-left: 20px;
 304      width: 20px;
 305      height: 20px;
 306      color: #2c3338;
 307      font: normal 20px/1 dashicons;
 308      text-align: center;
 309      box-sizing: border-box;
 310      -webkit-font-smoothing: antialiased;
 311      -moz-osx-font-smoothing: grayscale;
 312  }
 313  
 314  /* dashicons-smiley */
 315  #available-widgets [class*="easy"] .widget-title:before {
 316      content: "\f328";
 317      content: "\f328" / '';
 318      top: -4px;
 319  }
 320  
 321  /* dashicons-star-filled */
 322  #available-widgets [class*="super"] .widget-title:before,
 323  #available-widgets [class*="like"] .widget-title:before {
 324      content: "\f155";
 325      content: "\f155" / '';
 326      top: -4px;
 327  }
 328  
 329  /* dashicons-wordpress */
 330  #available-widgets [class*="meta"] .widget-title:before {
 331      content: "\f120";
 332      content: "\f120" / '';
 333  }
 334  
 335  /* dashicons-archive */
 336  #available-widgets [class*="archives"] .widget-title:before {
 337      content: "\f480";
 338      content: "\f480" / '';
 339      top: -4px;
 340  }
 341  
 342  /* dashicons-category */
 343  #available-widgets [class*="categor"] .widget-title:before {
 344      content: "\f318";
 345      content: "\f318" / '';
 346      top: -4px;
 347  }
 348  
 349  /* dashicons-admin-comments */
 350  #available-widgets [class*="comment"] .widget-title:before,
 351  #available-widgets [class*="testimonial"] .widget-title:before,
 352  #available-widgets [class*="chat"] .widget-title:before {
 353      content: "\f101";
 354      content: "\f101" / '';
 355  }
 356  
 357  /* dashicons-admin-post */
 358  #available-widgets [class*="post"] .widget-title:before {
 359      content: "\f109";
 360      content: "\f109" / '';
 361  }
 362  
 363  /* dashicons-admin-page */
 364  #available-widgets [class*="page"] .widget-title:before {
 365      content: "\f105";
 366      content: "\f105" / '';
 367  }
 368  
 369  /* dashicons-text */
 370  #available-widgets [class*="text"] .widget-title:before {
 371      content: "\f478";
 372      content: "\f478" / '';
 373  }
 374  
 375  /* dashicons-admin-links */
 376  #available-widgets [class*="link"] .widget-title:before {
 377      content: "\f103";
 378      content: "\f103" / '';
 379  }
 380  
 381  /* dashicons-search */
 382  #available-widgets [class*="search"] .widget-title:before {
 383      content: "\f179";
 384      content: "\f179" / '';
 385  }
 386  
 387  /* dashicons-menu */
 388  #available-widgets [class*="menu"] .widget-title:before,
 389  #available-widgets [class*="nav"] .widget-title:before {
 390      content: "\f333";
 391      content: "\f333" / '';
 392  }
 393  
 394  /* dashicons-tagcloud */
 395  #available-widgets [class*="tag"] .widget-title:before {
 396      content: "\f479";
 397      content: "\f479" / '';
 398  }
 399  
 400  /* dashicons-rss */
 401  #available-widgets [class*="rss"] .widget-title:before {
 402      content: "\f303";
 403      content: "\f303" / '';
 404      top: -6px;
 405  }
 406  
 407  /* dashicons-calendar */
 408  #available-widgets [class*="event"] .widget-title:before,
 409  #available-widgets [class*="calendar"] .widget-title:before {
 410      content: "\f145";
 411      content: "\f145" / '';
 412      top: -4px;
 413  }
 414  
 415  /* dashicons-format-image */
 416  #available-widgets [class*="image"] .widget-title:before,
 417  #available-widgets [class*="photo"] .widget-title:before,
 418  #available-widgets [class*="slide"] .widget-title:before,
 419  #available-widgets [class*="instagram"] .widget-title:before {
 420      content: "\f128";
 421      content: "\f128" / '';
 422  }
 423  
 424  /* dashicons-format-gallery */
 425  #available-widgets [class*="album"] .widget-title:before,
 426  #available-widgets [class*="galler"] .widget-title:before {
 427      content: "\f161";
 428      content: "\f161" / '';
 429  }
 430  
 431  /* dashicons-format-video */
 432  #available-widgets [class*="video"] .widget-title:before,
 433  #available-widgets [class*="tube"] .widget-title:before {
 434      content: "\f126";
 435      content: "\f126" / '';
 436  }
 437  
 438  /* dashicons-format-audio */
 439  #available-widgets [class*="music"] .widget-title:before,
 440  #available-widgets [class*="radio"] .widget-title:before,
 441  #available-widgets [class*="audio"] .widget-title:before {
 442      content: "\f127";
 443      content: "\f127" / '';
 444  }
 445  
 446  /* dashicons-admin-users */
 447  #available-widgets [class*="login"] .widget-title:before,
 448  #available-widgets [class*="user"] .widget-title:before,
 449  #available-widgets [class*="member"] .widget-title:before,
 450  #available-widgets [class*="avatar"] .widget-title:before,
 451  #available-widgets [class*="subscriber"] .widget-title:before,
 452  #available-widgets [class*="profile"] .widget-title:before,
 453  #available-widgets [class*="grofile"] .widget-title:before {
 454      content: "\f110";
 455      content: "\f110" / '';
 456  }
 457  
 458  /* dashicons-cart */
 459  #available-widgets [class*="commerce"] .widget-title:before,
 460  #available-widgets [class*="shop"] .widget-title:before,
 461  #available-widgets [class*="cart"] .widget-title:before {
 462      content: "\f174";
 463      content: "\f174" / '';
 464      top: -4px;
 465  }
 466  
 467  /* dashicons-shield */
 468  #available-widgets [class*="secur"] .widget-title:before,
 469  #available-widgets [class*="firewall"] .widget-title:before {
 470      content: "\f332";
 471      content: "\f332" / '';
 472  }
 473  
 474  /* dashicons-chart-bar */
 475  #available-widgets [class*="analytic"] .widget-title:before,
 476  #available-widgets [class*="stat"] .widget-title:before,
 477  #available-widgets [class*="poll"] .widget-title:before {
 478      content: "\f185";
 479      content: "\f185" / '';
 480  }
 481  
 482  /* dashicons-feedback */
 483  #available-widgets [class*="form"] .widget-title:before {
 484      content: "\f175";
 485      content: "\f175" / '';
 486  }
 487  
 488  /* dashicons-email-alt */
 489  #available-widgets [class*="subscribe"] .widget-title:before,
 490  #available-widgets [class*="news"] .widget-title:before,
 491  #available-widgets [class*="contact"] .widget-title:before,
 492  #available-widgets [class*="mail"] .widget-title:before {
 493      content: "\f466";
 494      content: "\f466" / '';
 495  }
 496  
 497  /* dashicons-share */
 498  #available-widgets [class*="share"] .widget-title:before,
 499  #available-widgets [class*="socia"] .widget-title:before {
 500      content: "\f237";
 501      content: "\f237" / '';
 502  }
 503  
 504  /* dashicons-translation */
 505  #available-widgets [class*="lang"] .widget-title:before,
 506  #available-widgets [class*="translat"] .widget-title:before {
 507      content: "\f326";
 508      content: "\f326" / '';
 509  }
 510  
 511  /* dashicons-location-alt */
 512  #available-widgets [class*="locat"] .widget-title:before,
 513  #available-widgets [class*="map"] .widget-title:before {
 514      content: "\f231";
 515      content: "\f231" / '';
 516  }
 517  
 518  /* dashicons-download */
 519  #available-widgets [class*="download"] .widget-title:before {
 520      content: "\f316";
 521      content: "\f316" / '';
 522  }
 523  
 524  /* dashicons-cloud */
 525  #available-widgets [class*="weather"] .widget-title:before {
 526      content: "\f176";
 527      content: "\f176" / '';
 528      top: -4px;
 529  }
 530  
 531  /* dashicons-facebook */
 532  #available-widgets [class*="facebook"] .widget-title:before {
 533      content: "\f304";
 534      content: "\f304" / '';
 535  }
 536  
 537  /* dashicons-twitter */
 538  #available-widgets [class*="tweet"] .widget-title:before,
 539  #available-widgets [class*="twitter"] .widget-title:before {
 540      content: "\f301";
 541      content: "\f301" / '';
 542  }
 543  
 544  @media screen and (max-height: 700px) and (min-width: 981px) {
 545      /* Compact widget-tops on smaller laptops, but not tablets. See ticket #27112#comment:4 */
 546      .customize-control-widget_form {
 547          margin-bottom: 0;
 548      }
 549  
 550      .widget-top {
 551          box-shadow: none;
 552          margin-top: -1px;
 553      }
 554  
 555      .widget-top:hover {
 556          position: relative;
 557          z-index: 1;
 558      }
 559  
 560      .last-widget {
 561          margin-bottom: 15px;
 562      }
 563  
 564      .widget-title h3 {
 565          padding: 13px 15px;
 566      }
 567  
 568      .widget-top .widget-action {
 569          padding: 8px 10px;
 570      }
 571  
 572      .widget-reorder-nav span {
 573          height: 39px;
 574      }
 575  
 576      .widget-reorder-nav span:before {
 577          line-height: 39px;
 578      }
 579  
 580      /* Compact the move widget areas. */
 581      #customize-theme-controls .widget-area-select li {
 582          padding: 9px 42px 11px 15px;
 583      }
 584  
 585      #customize-theme-controls .widget-area-select li:before {
 586          top: 8px;
 587      }
 588  }