[Summary view] [Print] [Text view]

   1  
   2  @import 'variables';
   3  @import 'mixins';
   4  
   5  
   6  html {
   7      background: $body-background;
   8  }
   9  
  10  
  11  /* Links */
  12  
  13  a {
  14      color: $link;
  15  
  16      &:hover,
  17      &:active,
  18      &:focus {
  19          color: $link-focus;
  20      }
  21  }
  22  
  23  #rightnow a:hover,
  24  #media-upload a.del-link:hover,
  25  div.dashboard-widget-submit input:hover,
  26  .subsubsub a:hover,
  27  .subsubsub a.current:hover,
  28  .ui-tabs-nav a:hover {
  29      color: $link-focus;
  30  }
  31  
  32  
  33  /* Forms */
  34  
  35  input[type=checkbox]:checked:before {
  36      color: $form-checked;
  37  }
  38  
  39  input[type=radio]:checked:before {
  40      background: $form-checked;
  41  }
  42  
  43  .wp-core-ui input[type="reset"]:hover,
  44  .wp-core-ui input[type="reset"]:active {
  45      color: $link-focus;
  46  }
  47  
  48  
  49  /* Core UI */
  50  
  51  .wp-core-ui {
  52      .button-primary {
  53          @include button( $button-color );
  54      }
  55  
  56      .wp-ui-primary {
  57          color: $text-color;
  58          background-color: $base-color;
  59      }
  60      .wp-ui-text-primary {
  61          color: $base-color;
  62      }
  63  
  64      .wp-ui-highlight {
  65          color: $menu-highlight-text;
  66          background-color: $menu-highlight-background;
  67      }
  68      .wp-ui-text-highlight {
  69          color: $menu-highlight-background;
  70      }
  71  
  72      .wp-ui-notification {
  73          color: $menu-bubble-text;
  74          background-color: $menu-bubble-background;
  75      }
  76      .wp-ui-text-notification {
  77          color: $menu-bubble-background;
  78      }
  79  
  80      .wp-ui-text-icon {
  81          color: $menu-icon;
  82      }
  83  }
  84  
  85  
  86  /* List tables */
  87  
  88  .wrap .add-new-h2:hover,
  89  #add-new-comment a:hover,
  90  .tablenav .tablenav-pages a:hover,
  91  .tablenav .tablenav-pages a:focus {
  92      color: $menu-text;
  93      background-color: $menu-background;
  94  }
  95  
  96  .view-switch a.current:before {
  97      color: $menu-background;
  98  }
  99  
 100  .view-switch a:hover:before {
 101      color: $menu-bubble-background;
 102  }
 103  
 104  .post-com-count:hover:after {
 105      border-top-color: $menu-background;
 106  }
 107  .post-com-count:hover span {
 108      color: $menu-text;
 109      background-color: $menu-background;
 110  }
 111  
 112  strong .post-com-count:after {
 113      border-top-color: $menu-bubble-background;
 114  }
 115  strong .post-com-count span {
 116      background-color: $menu-bubble-background;
 117  }
 118  
 119  
 120  /* Admin Menu */
 121  
 122  #adminmenuback,
 123  #adminmenuwrap,
 124  #adminmenu {
 125      background: $menu-background;
 126  }
 127  
 128  #adminmenu a {
 129      color: $menu-text;
 130  }
 131  
 132  #adminmenu div.wp-menu-image:before {
 133      color: $menu-icon;
 134  }
 135  
 136  #adminmenu a:hover,
 137  #adminmenu li.menu-top:hover,
 138  #adminmenu li.opensub > a.menu-top,
 139  #adminmenu li > a.menu-top:focus {
 140      color: $menu-highlight-text;
 141      background-color: $menu-highlight-background;
 142  }
 143  
 144  #adminmenu li.menu-top:hover div.wp-menu-image:before,
 145  #adminmenu li.opensub > a.menu-top div.wp-menu-image:before {
 146      color: $menu-highlight-icon;
 147  }
 148  
 149  
 150  /* Active tabs use a bottom border color that matches the page background color. */
 151  
 152  .about-wrap h2 .nav-tab-active,
 153  .nav-tab-active,
 154  .nav-tab-active:hover {
 155      border-bottom-color: $body-background;
 156  }
 157  
 158  
 159  /* Admin Menu: submenu */
 160  
 161  #adminmenu .wp-submenu,
 162  #adminmenu .wp-has-current-submenu .wp-submenu,
 163  #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
 164  .folded #adminmenu .wp-has-current-submenu .wp-submenu,
 165  #adminmenu a.wp-has-current-submenu:focus + .wp-submenu {
 166      background: $menu-submenu-background;
 167  }
 168  
 169  #adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after {
 170      border-right-color: $menu-submenu-background;
 171  }
 172  
 173  #adminmenu .wp-submenu .wp-submenu-head {
 174      color: $menu-submenu-text;
 175  }
 176  
 177  #adminmenu .wp-submenu a,
 178  #adminmenu .wp-has-current-submenu .wp-submenu a,
 179  .folded #adminmenu .wp-has-current-submenu .wp-submenu a,
 180  #adminmenu a.wp-has-current-submenu:focus + .wp-submenu a,
 181  #adminmenu .wp-has-current-submenu.opensub .wp-submenu a {
 182      color: $menu-submenu-text;
 183  
 184      &:focus, &:hover {
 185          color: $menu-submenu-focus-text;
 186      }
 187  }
 188  
 189  
 190  /* Admin Menu: current */
 191  
 192  #adminmenu .wp-submenu li.current a,
 193  #adminmenu a.wp-has-current-submenu:focus + .wp-submenu li.current a,
 194  #adminmenu .wp-has-current-submenu.opensub .wp-submenu li.current a {
 195      color: $menu-submenu-current-text;
 196  
 197      &:hover, &:focus {
 198          color: $menu-submenu-focus-text;
 199      }
 200  }
 201  
 202  ul#adminmenu a.wp-has-current-submenu:after,
 203  ul#adminmenu > li.current > a.current:after {
 204      border-right-color: $body-background;
 205  }
 206  
 207  #adminmenu li.current a.menu-top,
 208  #adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
 209  #adminmenu li.wp-has-current-submenu .wp-submenu .wp-submenu-head,
 210  .folded #adminmenu li.current.menu-top {
 211      color: $menu-current-text;
 212      background: $menu-current-background;
 213  }
 214  
 215  #adminmenu li.wp-has-current-submenu div.wp-menu-image:before {
 216      color: $menu-current-icon;
 217  }
 218  
 219  
 220  /* Admin Menu: bubble */
 221  
 222  #adminmenu .awaiting-mod,
 223  #adminmenu .update-plugins {
 224      color: $menu-bubble-text;
 225      background: $menu-bubble-background;
 226  }
 227  
 228  #adminmenu li.current a .awaiting-mod,
 229  #adminmenu li a.wp-has-current-submenu .update-plugins,
 230  #adminmenu li:hover a .awaiting-mod,
 231  #adminmenu li.menu-top:hover > a .update-plugins {
 232      color: $menu-bubble-current-text;
 233      background: $menu-bubble-current-background;
 234  }
 235  
 236  
 237  /* Admin Menu: collapse button */
 238  
 239  #collapse-menu {
 240      color: $menu-collapse-text;
 241  }
 242  
 243  #collapse-menu:hover {
 244      color: $menu-collapse-focus-text;
 245  }
 246  
 247  #collapse-button div:after {
 248      color: $menu-collapse-icon;
 249  }
 250  
 251  #collapse-menu:hover #collapse-button div:after {
 252      color: $menu-collapse-focus-icon;
 253  }
 254  
 255  
 256  /* Admin Bar */
 257  
 258  #wpadminbar {
 259      color: $menu-text;
 260      background: $menu-background;
 261  }
 262  
 263  #wpadminbar .ab-item,
 264  #wpadminbar a.ab-item,
 265  #wpadminbar > #wp-toolbar span.ab-label,
 266  #wpadminbar > #wp-toolbar span.noticon {
 267      color: $menu-text;
 268  }
 269  
 270  #wpadminbar .ab-icon,
 271  #wpadminbar .ab-icon:before,
 272  #wpadminbar .ab-item:before,
 273  #wpadminbar .ab-item:after {
 274      color: $menu-icon;
 275  }
 276  
 277  #wpadminbar .ab-top-menu > li:hover > .ab-item,
 278  #wpadminbar .ab-top-menu > li.hover > .ab-item,
 279  #wpadminbar .ab-top-menu > li > .ab-item:focus,
 280  #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
 281  #wpadminbar-nojs .ab-top-menu > li.menupop:hover > .ab-item,
 282  #wpadminbar .ab-top-menu > li.menupop.hover > .ab-item {
 283      color: $menu-submenu-focus-text;
 284      background: $menu-submenu-background;
 285  }
 286  
 287  #wpadminbar > #wp-toolbar li:hover span.ab-label,
 288  #wpadminbar > #wp-toolbar li.hover span.ab-label,
 289  #wpadminbar > #wp-toolbar a:focus span.ab-label {
 290      color: $menu-submenu-focus-text;
 291  }
 292  
 293  #wpadminbar li:hover .ab-icon:before,
 294  #wpadminbar li:hover .ab-item:before,
 295  #wpadminbar li:hover .ab-item:after,
 296  #wpadminbar li:hover #adminbarsearch:before {
 297      color: $menu-highlight-icon;
 298  }
 299  
 300  
 301  /* Admin Bar: submenu */
 302  
 303  #wpadminbar .menupop .ab-sub-wrapper {
 304      background: $menu-submenu-background;
 305  }
 306  
 307  #wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
 308  #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
 309      background: $menu-submenu-background-alt;
 310  }
 311  
 312  #wpadminbar .ab-submenu .ab-item,
 313  #wpadminbar .quicklinks .menupop ul li a,
 314  #wpadminbar .quicklinks .menupop.hover ul li a,
 315  #wpadminbar-nojs .quicklinks .menupop:hover ul li a {
 316      color: $menu-submenu-text;
 317  }
 318  
 319  #wpadminbar .quicklinks li .blavatar,
 320  #wpadminbar .menupop .menupop > .ab-item:before {
 321      color: $menu-icon;
 322  }
 323  
 324  #wpadminbar .quicklinks .menupop ul li a:hover,
 325  #wpadminbar .quicklinks .menupop ul li a:focus,
 326  #wpadminbar .quicklinks .menupop ul li a:hover strong,
 327  #wpadminbar .quicklinks .menupop ul li a:focus strong,
 328  #wpadminbar .quicklinks .menupop.hover ul li a:hover,
 329  #wpadminbar .quicklinks .menupop.hover ul li a:focus,
 330  #wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
 331  #wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
 332  #wpadminbar li:hover .ab-icon:before,
 333  #wpadminbar li:hover .ab-item:before,
 334  #wpadminbar li a:focus .ab-icon:before,
 335  #wpadminbar li .ab-item:focus:before,
 336  #wpadminbar li.hover .ab-icon:before,
 337  #wpadminbar li.hover .ab-item:before,
 338  #wpadminbar li:hover .ab-item:after,
 339  #wpadminbar li.hover .ab-item:after,
 340  #wpadminbar li:hover #adminbarsearch:before {
 341      color: $menu-submenu-focus-text;
 342  }
 343  
 344  #wpadminbar .quicklinks li a:hover .blavatar,
 345  #wpadminbar .menupop .menupop > .ab-item:hover:before {
 346      color: $menu-submenu-focus-text;
 347  }
 348  
 349  
 350  /* Admin Bar: search */
 351  
 352  #wpadminbar #adminbarsearch:before {
 353      color: $menu-icon;
 354  }
 355  
 356  #wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
 357      color: $menu-text;
 358      background: $adminbar-input-background;
 359  }
 360  
 361  #wpadminbar #adminbarsearch .adminbar-input::-webkit-input-placeholder { color: $menu-text; opacity: .7; }
 362  #wpadminbar #adminbarsearch .adminbar-input:-moz-placeholder { color: $menu-text; opacity: .7; }
 363  #wpadminbar #adminbarsearch .adminbar-input::-moz-placeholder { color: $menu-text; opacity: .7; }
 364  #wpadminbar #adminbarsearch .adminbar-input:-ms-input-placeholder { color: $menu-text; opacity: .7; }
 365  
 366  
 367  /* Admin Bar: my account */
 368  
 369  #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
 370      border-color: $adminbar-avatar-frame;
 371      background-color: $adminbar-avatar-frame;
 372  }
 373  
 374  #wpadminbar #wp-admin-bar-user-info .display-name {
 375      color: $menu-text;
 376  }
 377  
 378  #wpadminbar #wp-admin-bar-user-info a:hover .display-name {
 379      color: $menu-submenu-focus-text;
 380  }
 381  
 382  #wpadminbar #wp-admin-bar-user-info .username {
 383      color: $menu-submenu-text;
 384  }
 385  
 386  
 387  /* Pointers */
 388  
 389  .wp-pointer .wp-pointer-content h3 {
 390      background-color: $highlight-color;
 391  }
 392  
 393  .wp-pointer .wp-pointer-content h3:before {
 394      color: $highlight-color;
 395  }
 396  
 397  .wp-pointer.wp-pointer-top .wp-pointer-arrow,
 398  .wp-pointer.wp-pointer-undefined .wp-pointer-arrow {
 399      border-bottom-color: $highlight-color;
 400  }
 401  
 402  
 403  /* Media Uploader */
 404  
 405  .media-item .bar,
 406  .media-progress-bar div {
 407      background-color: $highlight-color;
 408  }
 409  
 410  .details.attachment {
 411      box-shadow: 0 0 0 1px #fff, 0 0 0 5px $highlight-color;
 412  }
 413  
 414  .attachment.details .check {
 415      background-color: $highlight-color;
 416      box-shadow: 0 0 0 1px #fff, 0 0 0 2px $highlight-color;
 417  }
 418  
 419  
 420  /* Themes */
 421  
 422  .theme-browser .theme.active .theme-name,
 423  .theme-browser .theme.add-new-theme:hover:after {
 424      background: $highlight-color;
 425  }
 426  
 427  .theme-browser .theme.add-new-theme:hover span:after {
 428      color: $highlight-color;
 429  }
 430  
 431  .theme-overlay .theme-header .close:hover,
 432  .theme-overlay .theme-header .right:hover,
 433  .theme-overlay .theme-header .left:hover {
 434      background: $highlight-color;
 435  }
 436  
 437  /* jQuery UI Slider */
 438  
 439  .wp-slider .ui-slider-handle,
 440  .wp-slider .ui-slider-handle.ui-state-hover,
 441  .wp-slider .ui-slider-handle.focus {
 442      background: $button-color;
 443      border-color: darken( $button-color, 10% );
 444      -webkit-box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
 445      box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
 446  }
 447  
 448  /* Thickbox: Plugin information */
 449  
 450  #sidemenu a.current {
 451      background: $body-background;
 452      border-bottom-color: $body-background;
 453  }
 454  
 455  #plugin-information .action-button {
 456      background: $button-color;
 457  }
 458  
 459  /* Responsive Component */
 460  
 461  div#wp-responsive-toggle a:before {
 462      color: $menu-icon;
 463  }
 464  
 465  .wp-responsive-open div#wp-responsive-toggle a {
 466      // ToDo: make inset border
 467      border-color: transparent;
 468      background: $menu-highlight-background;
 469  }
 470  
 471  .star-rating .star {
 472      color: $highlight-color;
 473  }
 474  
 475  .wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle a {
 476      background: $menu-submenu-background;
 477  }