Make WordPress Core

Ticket #25858: 25858.responsive.3.diff

File 25858.responsive.3.diff, 40.1 KB (added by iammattthomas, 11 years ago)

This adds to tollmanz's latest responsive patch, fixing the positioning of the adminbar Updates icon and removing the hover state on the hamburger button.

  • src/wp-admin/admin-header.php

     
    6767        decimalPoint = '<?php echo addslashes( $wp_locale->number_format['decimal_point'] ); ?>',
    6868        isRtl = <?php echo (int) is_rtl(); ?>;
    6969</script>
     70<meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0">
    7071<?php
    7172
    7273/**
  • src/wp-admin/css/wp-admin.css

     
    19211921
    19221922/* Sticky admin menu */
    19231923
    1924 .sticky-menu #wpwrap {
    1925         z-index: 1; /* prevent flyouts from going behind content in Webkit */
    1926 }
    1927 
    19281924.sticky-menu #adminmenuwrap {
    19291925        position: fixed;
    19301926        top: 32px;
     
    1024010236        margin: 16px 0 0;
    1024110237}
    1024210238
     10239li#wp-admin-bar-toggle-button {
     10240        display: none;
     10241}
     10242
    1024310243/* =Media Queries
    1024410244-------------------------------------------------------------- */
    1024510245
     
    1045710457#TB_closeAjaxWindow a {
    1045810458        text-decoration: none;
    1045910459}
     10460
     10461@-ms-viewport {
     10462        width: device-width;
     10463        zoom: 1;
     10464        user-zoom: fixed;
     10465}
     10466
     10467@media screen and ( max-width: 782px ) {
     10468        body {
     10469                min-width: 240px;
     10470                overflow-x: hidden;
     10471        }
     10472
     10473        body * {
     10474                -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
     10475        }
     10476
     10477        #wpwrap {
     10478                background: #f0f0f0;
     10479                overflow-x: hidden;
     10480        }
     10481
     10482        #wpcontent, .auto-fold #wpcontent {
     10483                position: relative;
     10484                margin-left: 0;
     10485                padding-left: 10px;
     10486        }
     10487
     10488        .wrap {
     10489                margin-right: 10px;
     10490                margin-left: 0;
     10491        }
     10492
     10493        .col-wrap {
     10494                padding: 0;
     10495        }
     10496
     10497        .sticky-menu #adminmenuwrap {
     10498                position: relative;
     10499                z-index: auto;
     10500                top: 0;
     10501        }
     10502
     10503        /* Hidden Elements */
     10504        #screen-meta,
     10505        #screen-meta-links,
     10506        #collapse-menu,
     10507        .post-format-select {
     10508                display: none !important;
     10509        }
     10510
     10511        /* Input Elements */
     10512        textarea {
     10513                -webkit-appearance: none;
     10514        }
     10515
     10516        input[type=text], input[type=search],
     10517        input[type=password], input[type=number] {
     10518                -webkit-appearance: none;
     10519                padding: 6px 10px;
     10520        }
     10521
     10522        input.code {
     10523                padding-bottom: 5px;
     10524                padding-top: 10px;
     10525        }
     10526
     10527        input[type=checkbox], .widefat th input[type=checkbox] {
     10528                -webkit-appearance: none;
     10529                padding: 10px;
     10530        }
     10531
     10532        .widefat th input[type=checkbox] {
     10533                margin-bottom: 8px;
     10534        }
     10535
     10536        input[type=checkbox]:checked:before, .widefat th input[type=checkbox]:before {
     10537                font: normal 30px/1 'Dashicons';
     10538                margin: -3px -5px;
     10539        }
     10540
     10541        input[type=radio],
     10542        input[type=checkbox] {
     10543                height: 25px;
     10544                width: 25px;
     10545        }
     10546
     10547        .wp-admin p input[type=checkbox],
     10548        .wp-admin p input[type=radio] {
     10549                margin-top: -3px;
     10550        }
     10551
     10552        input[type=radio]:checked:before {
     10553                vertical-align: middle;
     10554                width: 9px;
     10555                height: 9px;
     10556                margin: 7px;
     10557                line-height: 16px;
     10558        }
     10559
     10560        .wp-upload-form input[type=submit] {
     10561                margin-top: 10px;
     10562        }
     10563
     10564        #wpbody select {
     10565                height: 36px;
     10566                font-size: 16px;
     10567        }
     10568
     10569        .wp-core-ui .button,
     10570        input#publish,
     10571        input#save-post,
     10572        a.preview {
     10573                padding: 10px 14px;
     10574                line-height: 1;
     10575                font-size: 14px;
     10576                vertical-align: middle;
     10577                height: auto;
     10578                margin-bottom: 4px;
     10579        }
     10580
     10581        #media-upload.wp-core-ui .button {
     10582                padding: 0 10px 1px;
     10583                height: 24px;
     10584                line-height: 22px;
     10585                font-size: 13px;
     10586        }
     10587
     10588        .wrap .add-new-h2, .wrap .add-new-h2:active {
     10589                padding: 10px 15px;
     10590                font-size: 14px;
     10591        }
     10592
     10593        .wp-color-result {
     10594                height: auto;
     10595                padding-left: 45px;
     10596        }
     10597
     10598        .wp-color-result:after {
     10599                font-size: 14px;
     10600                height: auto;
     10601                padding: 6px 14px;
     10602        }
     10603
     10604        #createuser .form-field input {
     10605                width: 100%;
     10606        }
     10607
     10608        /* Feedback Messages */
     10609        .wrap div.updated, .wrap div.error, .media-upload-form div.error {
     10610                margin: 20px 0 10px 0;
     10611                padding: 5px 10px;
     10612                font-size: 14px;
     10613                line-height: 175%;
     10614        }
     10615
     10616        /* Sidebar Adjustments */
     10617        .auto-fold #adminmenu,
     10618        .auto-fold #adminmenuback,
     10619        .auto-fold #adminmenuwrap {
     10620                position: absolute;
     10621                top: 0;
     10622                left: 0;
     10623                z-index: 100;
     10624        }
     10625
     10626        .auto-fold #adminmenuback,
     10627        .auto-fold #adminmenuwrap {
     10628                left: -200px;
     10629        }
     10630
     10631        .auto-fold #adminmenuwrap,
     10632        .auto-fold #adminmenu,
     10633        .auto-fold #adminmenuback {
     10634                width: 190px;
     10635        }
     10636
     10637        .auto-fold #adminmenu li.menu-top {
     10638                width: 100%;
     10639        }
     10640
     10641        /* Let the menubar scroll independently of the main column */
     10642        .auto-fold #adminmenuwrap {
     10643                height: 100%;
     10644                position: fixed;
     10645                overflow: hidden;
     10646                overflow-y: scroll;
     10647                top: 46px;
     10648
     10649                height: -webkit-calc(100% - 46px);
     10650                height: calc(100% - 46px);
     10651
     10652                -webkit-box-shadow: inset 2px 0 0 rgba(0, 0, 0, .1);
     10653                box-shadow: inset 2px 0 0 rgba(0, 0, 0, .1);
     10654
     10655                -moz-box-sizing: border-box;
     10656                -webkit-box-sizing: border-box;
     10657                box-sizing: border-box;
     10658
     10659                -webkit-overflow-scrolling: touch;
     10660        }
     10661
     10662        /* Experimental animations for sidebar */
     10663        .auto-fold #adminmenu,
     10664        .auto-fold #adminmenuback,
     10665        .auto-fold #adminmenuwrap {
     10666                -moz-transition: left .2s ease-in-out;
     10667                -webkit-transition: left .2s ease-in-out;
     10668                transition: left .2s ease-in-out;
     10669        }
     10670
     10671        #wpbody {
     10672                -moz-transition: right .2s ease-in-out;
     10673                -webkit-transition: right .2s ease-in-out;
     10674                transition: right .2s ease-in-out;
     10675        }
     10676
     10677        .auto-fold #adminmenu {
     10678                -webkit-opacity: .10;
     10679                -moz-opacity: .10;
     10680                opacity: .10;
     10681                -moz-transition: left .2s ease-in-out, -moz-opacity .3s ease-in;
     10682                -webkit-transition: left .2s ease-in-out, -webkit-opacity .3s ease-in;
     10683                transition: left .2s ease-in-out, opacity .3s ease-in;
     10684        }
     10685
     10686        .auto-fold .moby6-open #adminmenu {
     10687                -moz-opacity: 1;
     10688                -webkit-opacity: 1;
     10689                opacity: 1;
     10690        }
     10691
     10692        /* Resize the admin menu items to a comfortable touch size */
     10693        .auto-fold #adminmenu li a {
     10694                font-size: 16px;
     10695                padding: 5px;
     10696        }
     10697
     10698        .auto-fold #adminmenu li.menu-top .wp-submenu > li > a {
     10699                padding: 10px 10px 10px 20px;
     10700        }
     10701
     10702        /* Restore the menu names */
     10703        .auto-fold #adminmenu .wp-menu-name {
     10704                display: block;
     10705                margin-left: 35px;
     10706        }
     10707
     10708        /* Switch the arrow side */
     10709        .auto-fold ul#adminmenu a.wp-has-current-submenu:after,
     10710        .auto-fold ul#adminmenu > li.current > a.current:after {
     10711                border-width: 8px;
     10712                margin-top: -8px;
     10713        }
     10714
     10715        .auto-fold ul#adminmenu li.wp-has-submenu.wp-not-current-submenu:hover:after {
     10716                display: none;
     10717        }
     10718
     10719        /* Make the submenus appear correctly when tapped. */
     10720        #adminmenu .wp-submenu {
     10721                position: relative;
     10722                display: none;
     10723        }
     10724
     10725        .auto-fold #adminmenu .selected .wp-submenu,
     10726        .auto-fold #adminmenu .wp-menu-open .wp-submenu {
     10727                position: relative;
     10728                display: block;
     10729                top: 0;
     10730                left: -1px;
     10731                -webkit-box-shadow: none;
     10732                box-shadow: none;
     10733        }
     10734
     10735        .auto-fold #adminmenu .selected .wp-submenu:after,
     10736        .auto-fold #adminmenu .wp-menu-open .wp-submenu:after {
     10737                display: none;
     10738        }
     10739
     10740        .auto-fold #adminmenu .opensub .wp-submenu {
     10741                display: none;
     10742        }
     10743
     10744        .auto-fold #adminmenu .selected .wp-submenu {
     10745                display: block;
     10746        }
     10747
     10748        .auto-fold ul#adminmenu li:hover a.wp-has-current-submenu:after {
     10749                display: block;
     10750        }
     10751
     10752        /* Remove submenu headers and adjust sub meu*/
     10753        #adminmenu .wp-submenu .wp-submenu-head {
     10754                display: none;
     10755        }
     10756
     10757        /*  Sidebar Toggle */
     10758        #moby6-toggle {
     10759                position: fixed;
     10760                top: 5px;
     10761                left: 4px;
     10762                padding-right: 10px;
     10763                z-index: 99999;
     10764                border: none;
     10765                box-sizing: border-box;
     10766                -moz-box-sizing: border-box;
     10767        }
     10768
     10769        .wrap .icon32 + h2 {
     10770                margin-top: -2px;
     10771        }
     10772
     10773        #wpadminbar #wp-admin-bar-toggle-button a {
     10774                display: block;
     10775                padding: 0;
     10776                overflow: hidden;
     10777                outline: none;
     10778                text-decoration: none;
     10779                border: 1px solid transparent;
     10780                background: none;
     10781                height: 44px;
     10782                margin-left: -1px;
     10783        }
     10784
     10785        li#wp-admin-bar-toggle-button {
     10786                display: block;
     10787        }
     10788
     10789        #wpadminbar #wp-admin-bar-toggle-button a:hover {
     10790                border: 1px solid transparent;
     10791        }
     10792
     10793        #wpadminbar #wp-admin-bar-toggle-button .ab-icon:before {
     10794                color: #888;
     10795                content: '\f228';
     10796                display: inline-block;
     10797                float: left;
     10798                font: normal 40px/45px 'Dashicons';
     10799                vertical-align: middle;
     10800                outline: none;
     10801                margin: 0;
     10802                -webkit-font-smoothing: antialiased;
     10803                -moz-osx-font-smoothing: grayscale;
     10804                height: 44px;
     10805                width: 50px;
     10806                padding: 0;
     10807                border: none;
     10808                text-align: center;
     10809                text-decoration: none;
     10810                box-sizing: border-box;
     10811                -moz-box-sizing: border-box;
     10812        }
     10813
     10814        .moby6-open #wpadminbar #wp-admin-bar-toggle-button a {
     10815                background: #000;
     10816        }
     10817
     10818        .moby6-open #wpbody {
     10819                right: -190px;
     10820        }
     10821
     10822        .auto-fold .moby6-open #adminmenuback,
     10823        .auto-fold .moby6-open #adminmenuwrap {
     10824                left: 0;
     10825        }
     10826
     10827        /* General New Post Form */
     10828        #post-body-content {
     10829                min-width: 0;
     10830        }
     10831
     10832        #titlediv #title {
     10833                padding: 8px;
     10834        }
     10835
     10836        #titlediv #title-prompt-text,
     10837        #wp-fullscreen-title-prompt-text {
     10838                padding: 10px 10px;
     10839        }
     10840
     10841        .post-format-options {
     10842                padding-right: 0;
     10843        }
     10844
     10845        .post-format-options a {
     10846                margin-right: 5px;
     10847                margin-bottom: 5px;
     10848                min-width: 52px;
     10849        }
     10850
     10851        .post-format-options .post-format-title {
     10852                font-size: 11px;
     10853        }
     10854
     10855        .post-format-options a div {
     10856                height: 28px;
     10857                width: 28px;
     10858        }
     10859
     10860        .post-format-options a div:before {
     10861                font-size: 26px !important;
     10862        }
     10863
     10864        /* General Metabox */
     10865        .postbox {
     10866                font-size: 14px;
     10867        }
     10868
     10869        #poststuff h3,
     10870        .metabox-holder h3 {
     10871                padding: 12px;
     10872        }
     10873
     10874        .postbox .handlediv {
     10875                margin-top: 3px;
     10876        }
     10877
     10878        /* Publish Metabox Options */
     10879        #post-visibility-select {
     10880                line-height: 280%;
     10881        }
     10882
     10883        .wp-core-ui .save-post-status.button {
     10884                top: 16px;
     10885                position: relative;
     10886                margin: 0 10px;
     10887        }
     10888
     10889        .wp-core-ui .save-post-visibility,
     10890        .wp-core-ui .save-timestamp {
     10891                vertical-align: middle;
     10892                margin-right: 15px;
     10893        }
     10894
     10895        .timestamp-wrap select#mm {
     10896                display: block;
     10897                width: 100%;
     10898                margin-bottom: 10px;
     10899        }
     10900
     10901        .timestamp-wrap #jj,
     10902        .timestamp-wrap #aa,
     10903        .timestamp-wrap #hh,
     10904        .timestamp-wrap #mn {
     10905                padding: 12px 3px;
     10906                font-size: 14px;
     10907                margin-bottom: 5px;
     10908                width: auto;
     10909                text-align: center;
     10910        }
     10911
     10912        /* Categories Metabox */
     10913        ul.category-tabs {
     10914                margin: 30px 0 15px;
     10915        }
     10916
     10917        ul.category-tabs li.tabs {
     10918                padding: 15px;
     10919        }
     10920
     10921        ul#categorychecklist li {
     10922                margin-bottom: 15px;
     10923        }
     10924
     10925        ul#categorychecklist ul {
     10926                margin-top: 15px;
     10927        }
     10928
     10929        .category-add input[type=text],
     10930        .category-add select {
     10931                max-width: none;
     10932                margin-bottom: 15px;
     10933        }
     10934
     10935        /* Tags Metabox */
     10936        .tagsdiv .newtag {
     10937                width: 100%;
     10938                padding: 25px 10px;
     10939                margin-bottom: 15px;
     10940        }
     10941
     10942        .tagchecklist {
     10943                margin: 25px 10px;
     10944        }
     10945
     10946        .tagchecklist span {
     10947                font-size: 16px;
     10948                line-height: 120%;
     10949        }
     10950
     10951        /* Revisions */
     10952        #diff-next-revision,
     10953        #diff-previous-revision {
     10954                margin-top: -1em;
     10955        }
     10956
     10957        table.diff {
     10958                -ms-word-break: break-all;
     10959                word-break: break-all;
     10960                word-wrap: break-word;
     10961        }
     10962
     10963        /* TinyMCE Adjustments */
     10964        .mceToolbar * {
     10965                white-space: normal !important;
     10966        }
     10967
     10968        .mceToolbar tr,
     10969        .mceToolbar td {
     10970                float: left !important;
     10971        }
     10972
     10973        .wp_themeSkin a.mceButton {
     10974                width: 30px;
     10975                height: 30px;
     10976        }
     10977
     10978        .wp_themeSkin .mceButton .mceIcon {
     10979                margin-top: 5px;
     10980                margin-left: 5px;
     10981        }
     10982
     10983        .wp_themeSkin .mceSplitButton {
     10984                margin-top: 1px;
     10985        }
     10986
     10987        .wp_themeSkin .mceSplitButton td a.mceAction {
     10988                padding-top: 6px;
     10989                padding-bottom: 6px;
     10990                padding-left: 6px;
     10991                padding-right: 3px;
     10992        }
     10993
     10994        .wp_themeSkin .mceSplitButton td a.mceOpen,
     10995        .wp_themeSkin .mceSplitButtonEnabled:hover td a.mceOpen {
     10996                padding-top: 6px;
     10997                padding-bottom: 6px;
     10998                background-position: 1px 6px;
     10999        }
     11000
     11001        .wp_themeSkin table.mceListBox {
     11002                margin: 5px;
     11003        }
     11004
     11005        div.quicktags-toolbar input {
     11006                padding: 10px 20px;
     11007        }
     11008
     11009        #wp-content-editor-tools {
     11010                padding-top: 20px;
     11011                padding-right: 15px;
     11012                overflow: hidden;
     11013        }
     11014
     11015        a.wp-switch-editor {
     11016                font-size: 16px;
     11017                line-height: 1em;
     11018                margin: 3px 0 0 7px;
     11019                padding: 12px 15px !important;
     11020        }
     11021
     11022        #wp-content-media-buttons a {
     11023                font-size: 16px;
     11024                line-height: 37px;
     11025                height: 39px;
     11026                padding: 0 20px 0 15px;
     11027        }
     11028
     11029        .wp-media-buttons span.wp-media-buttons-icon,
     11030        .wp-media-buttons span.jetpack-contact-form-icon {
     11031                width: 22px !important;
     11032                margin-top: -3px !important;
     11033                margin-left: -5px !important;
     11034        }
     11035
     11036        .wp-media-buttons .add_media span.wp-media-buttons-icon:before,
     11037        .wp-media-buttons #insert-jetpack-contact-form span.jetpack-contact-form-icon:before {
     11038                font-size: 20px !important;
     11039        }
     11040
     11041        #content_wp_fullscreen {
     11042                display: none;
     11043        }
     11044
     11045        .misc-pub-section {
     11046                padding: 20px 10px 20px;
     11047        }
     11048
     11049        .misc-pub-section > a {
     11050                float: right;
     11051                font-size: 16px;
     11052        }
     11053
     11054        #delete-action,
     11055        #publishing-action {
     11056                line-height: 47px;
     11057        }
     11058
     11059        /* Subsubsub Nav */
     11060        .subsubsub {
     11061                font-size: 16px;
     11062                text-align: center;
     11063                margin-bottom: 15px;
     11064        }
     11065
     11066        /* WP List Table Options & Filters */
     11067        .tablenav {
     11068                height: auto;
     11069        }
     11070
     11071        .tablenav.top {
     11072                margin: 0;
     11073        }
     11074
     11075        .tablenav.bottom {
     11076                position: relative;
     11077                margin-top: 15px;
     11078        }
     11079
     11080        .tablenav br {
     11081                display: none;
     11082        }
     11083
     11084        .tablenav br.clear {
     11085                display: block;
     11086        }
     11087
     11088        p.search-box {
     11089                float: none;
     11090                clear: both;
     11091                margin-top: 35px;
     11092        }
     11093
     11094        p.search-box input[name="s"] {
     11095                height: auto;
     11096                float: none;
     11097                width: 100%;
     11098                margin-bottom: 10px;
     11099                -webkit-appearance: none;
     11100        }
     11101
     11102        .tablenav.top .actions, .view-switch {
     11103                display: none;
     11104        }
     11105
     11106        /* Pagination */
     11107        .tablenav.top .displaying-num {
     11108                display: none;
     11109        }
     11110
     11111        .tablenav.bottom .displaying-num {
     11112                position: absolute;
     11113                right: 0;
     11114                top: 10px;
     11115                font-size: 14px;
     11116        }
     11117
     11118        .tablenav-pages {
     11119                width: 100%;
     11120                text-align: center;
     11121                margin: 0 0 25px;
     11122        }
     11123
     11124        .tablenav.bottom .tablenav-pages {
     11125                margin-top: 25px;
     11126        }
     11127
     11128        .tablenav.top .tablenav-pages.one-page {
     11129                display: none;
     11130        }
     11131
     11132        .tablenav.bottom .tablenav-pages.one-page {
     11133                margin: 15px 0 0 0;
     11134                height: 0;
     11135        }
     11136
     11137        .tablenav-pages .pagination-links .paging-input {
     11138                font-size: 18px;
     11139        }
     11140
     11141        .tablenav-pages .pagination-links a {
     11142                padding: 8px 20px 11px;
     11143                font-size: 18px;
     11144                background: rgba(0, 0, 0, 0.05);
     11145        }
     11146
     11147        .tablenav-pages .pagination-links .current-page {
     11148                padding: 10px;
     11149                font-size: 14px;
     11150        }
     11151
     11152        /* WP List Table Adjustments: General */
     11153        .form-wrap > p {
     11154                display: none;
     11155        }
     11156
     11157        .comment-count {
     11158                font-size: 14px;
     11159        }
     11160
     11161        /* Posts */
     11162        .column-title {
     11163                width: 85%;
     11164        }
     11165
     11166        .fixed .column-comments, .widefat .check-column {
     11167                width: 35px
     11168        }
     11169
     11170        .fixed .column-date, .fixed .column-author,
     11171        .column-categories, .column-tags {
     11172                display: none;
     11173        }
     11174
     11175        .widefat thead .check-column, .widefat tfoot .check-column {
     11176                padding: 10px 0 10px;
     11177        }
     11178
     11179        .widefat * {
     11180                word-wrap: normal;
     11181        }
     11182
     11183        /* Categories */
     11184        .fixed .column-description {
     11185                display: none;
     11186        }
     11187
     11188        .fixed .column-posts {
     11189                width: 50px;
     11190        }
     11191
     11192        .fixed .column-slug {
     11193                width: 30%;
     11194        }
     11195
     11196        /* Comments */
     11197        .fixed .column-response {
     11198                width: 35%;
     11199        }
     11200
     11201        /* Media */
     11202        .fixed .column-parent {
     11203                display: none;
     11204        }
     11205
     11206        /* Comments */
     11207        .fixed .column-email, .fixed .column-name {
     11208                display: none;
     11209        }
     11210
     11211        .fixed .column-role {
     11212                width: 35%;
     11213        }
     11214
     11215        /* Plugins */
     11216        .plugins .column-description {
     11217                width: 70%;
     11218        }
     11219
     11220        #wpbody-content .plugins .plugin-title {
     11221                white-space: normal;
     11222                width: 30%;
     11223        }
     11224
     11225        /* Updates */
     11226        #wpbody-content #update-themes-table .plugin-title {
     11227                width: auto;
     11228        }
     11229
     11230        /* Form Tables */
     11231        .form-table {
     11232                -moz-box-sizing: border-box;
     11233                box-sizing: border-box;
     11234        }
     11235
     11236        .form-table th,
     11237        .form-table td {
     11238                display: block;
     11239                width: auto;
     11240                vertical-align: middle;
     11241        }
     11242
     11243        .form-table .color-palette td {
     11244                display: table-cell;
     11245                width: 15px;
     11246        }
     11247
     11248        .form-table table.color-palette {
     11249                margin-right: 10px;
     11250        }
     11251
     11252        textarea,
     11253        input {
     11254                font-size: 16px;
     11255        }
     11256
     11257        .form-table td input[type="text"],
     11258        .form-table td input[type="password"],
     11259        .form-table td select,
     11260        .form-table td textarea,
     11261        .form-table span.description,
     11262        #profile-page .form-table textarea {
     11263                width: 100%;
     11264                font-size: 16px;
     11265                line-height: 1.5;
     11266                padding: 7px 10px;
     11267                display: block;
     11268                max-width: none;
     11269                box-sizing: border-box;
     11270                -mox-box-sizing: border-box;
     11271        }
     11272
     11273        input[type=text].small-text,
     11274        input[type=search].small-text,
     11275        input[type=password].small-text,
     11276        input[type=number].small-text,
     11277        input[type="number"].small-text,
     11278        .form-table input[type=text].small-text {
     11279                width: auto;
     11280                max-width: 55px;
     11281                display: inline;
     11282                padding: 3px 6px;
     11283                margin: 0 3px;
     11284        }
     11285
     11286        #pass-strength-result {
     11287                width: 100%;
     11288                box-sizing: border-box;
     11289                -mox-box-sizing: border-box;
     11290                padding: 8px;
     11291        }
     11292
     11293        .form-table span.description {
     11294                padding: 4px 0 0;
     11295                line-height: 1.4em;
     11296        }
     11297
     11298        .form-table th {
     11299                padding-top: 10px;
     11300                padding-bottom: 0;
     11301                border-bottom: 0;
     11302        }
     11303
     11304        .form-table td {
     11305                padding-top: 8px;
     11306                padding-left: 0;
     11307        }
     11308
     11309        .form-table input.regular-text {
     11310                width: 100%;
     11311        }
     11312
     11313        .form-table label {
     11314                font-size: 14px;
     11315        }
     11316
     11317        .form-table fieldset label {
     11318                display: block;
     11319        }
     11320
     11321        #utc-time {
     11322                margin-top: 10px;
     11323        }
     11324
     11325        #utc-time,
     11326        #local-time {
     11327                display: block;
     11328                float: none;
     11329                padding: 0;
     11330                line-height: 2;
     11331        }
     11332
     11333        /* Add/Edit Media */
     11334        .wp_attachment_details label[for="content"] {
     11335                font-size: 14px;
     11336                line-height: 1.5em;
     11337        }
     11338
     11339        #media-items {
     11340                width: 100%;
     11341        }
     11342
     11343        .media-modal {
     11344                width: auto;
     11345        }
     11346
     11347        .media-frame {
     11348                overflow: auto;
     11349        }
     11350
     11351        .media-frame-menu {
     11352                position: relative;
     11353                width: auto;
     11354        }
     11355
     11356        .media-menu {
     11357                border-right: none;
     11358                position: relative;
     11359                border-bottom: 1px solid #dddddd;
     11360                overflow: hidden;
     11361        }
     11362
     11363        .media-menu .separator {
     11364                display: none;
     11365        }
     11366
     11367        .media-menu a {
     11368                float: left;
     11369                width: 40%;
     11370        }
     11371
     11372        .media-frame-router, .media-frame-content, .media-frame-toolbar {
     11373                left: auto;
     11374                right: auto;
     11375                top: auto;
     11376                bottom: auto;
     11377                position: relative;
     11378        }
     11379
     11380        .media-frame-title {
     11381                top: auto;
     11382                left: auto;
     11383                right: 0;
     11384                height: auto;
     11385        }
     11386
     11387        .media-frame-router {
     11388                margin-top: 10px;
     11389        }
     11390
     11391        .media-frame-title h1 {
     11392                line-height: 3;
     11393                font-size: 18px;
     11394        }
     11395
     11396        .media-router {
     11397                bottom: -2px;
     11398        }
     11399
     11400        .media-frame-content {
     11401                min-height: 300px;
     11402                max-height: 500px;
     11403                overflow: auto;
     11404        }
     11405
     11406        .media-toolbar-primary, .media-toolbar-secondary {
     11407                height: auto;
     11408        }
     11409
     11410        .uploader-inline h3 {
     11411                margin: 0 0 .8em 0;
     11412        }
     11413
     11414        .uploader-inline-content {
     11415                top: auto;
     11416        }
     11417
     11418        .uploader-inline-content .upload-ui {
     11419                margin: 0;
     11420        }
     11421
     11422        .attachments-browser .attachments, .attachments-browser .uploader-inline {
     11423                position: relative;
     11424                margin-right: 180px;
     11425        }
     11426
     11427        /* Links */
     11428        .link-manager-php #posts-filter {
     11429                margin-top: 25px;
     11430        }
     11431
     11432        .link-manager-php .tablenav.bottom {
     11433                overflow: hidden;
     11434        }
     11435
     11436        .links-table #link_rel {
     11437                max-width: none;
     11438        }
     11439
     11440        .links-table th,
     11441        .links-table td {
     11442                padding: 10px 0;
     11443        }
     11444
     11445        /**
     11446         * Nav Menus
     11447         * ----------------------------------------------------------------------------
     11448         */
     11449        body.nav-menus-php {
     11450                min-width: 0 !important;
     11451        }
     11452
     11453        #nav-menus-frame {
     11454                margin-left: 0;
     11455                float: none;
     11456                width: 100%;
     11457        }
     11458
     11459        #wpbody-content #menu-settings-column {
     11460                display: block;
     11461                width: 100%;
     11462                float: none;
     11463                margin-left: 0;
     11464        }
     11465
     11466        #side-sortables .add-menu-item-tabs {
     11467                margin: 15px 0;
     11468        }
     11469
     11470        ul.add-menu-item-tabs li.tabs {
     11471                padding: 15px;
     11472        }
     11473
     11474        .nav-menus-php .item-controls .item-type {
     11475                margin-top: 2px;
     11476        }
     11477
     11478        .nav-menus-php .customlinkdiv .howto input {
     11479                width: 65%;
     11480        }
     11481
     11482        .nav-menus-php .quick-search {
     11483                width: 85%;
     11484        }
     11485
     11486        #menu-management-liquid {
     11487                margin-top: 25px;
     11488        }
     11489
     11490        .nav-menus-php .menu-name-label.howto span {
     11491                margin-top: 13px
     11492        }
     11493
     11494        .menu-name-label #menu-name {
     11495                margin-top: 4px;
     11496        }
     11497
     11498        .nav-menus-php .major-publishing-actions .publishing-action {
     11499                margin-top: 6px;
     11500        }
     11501
     11502        .nav-menus-php .delete-action {
     11503                font-size: 14px;
     11504                line-height: 50px;
     11505                margin-top: 12px;
     11506        }
     11507
     11508        .menu-item-bar .menu-item-handle,
     11509        .menu-item-settings,
     11510        .description-wide {
     11511                width: auto;
     11512        }
     11513
     11514        .menu-item-settings {
     11515                padding: 10px;
     11516        }
     11517
     11518        .menu-item-settings .description-thin,
     11519        .menu-item-settings .description-wide {
     11520                width: 100%;
     11521                height: auto;
     11522        }
     11523
     11524        .menu-item-settings input {
     11525                width: 100%;
     11526        }
     11527
     11528        /* Theme Management Page */
     11529        #current-theme.has-screenshot {
     11530                padding: 0;
     11531                clear: both;
     11532        }
     11533
     11534        #current-theme img {
     11535                float: none;
     11536                margin-left: 0;
     11537                margin-bottom: 15px;
     11538        }
     11539
     11540        #current-theme.has-screenshot img.hide-if-no-customize {
     11541                display: block;
     11542        }
     11543
     11544        .available-theme .action-links .delete-theme {
     11545                float: none;
     11546                margin: 0;
     11547                padding: 0;
     11548                clear: both;
     11549        }
     11550
     11551        .available-theme .action-links .delete-theme a {
     11552                padding: 0;
     11553        }
     11554
     11555        /* Widget Management Page (Needs UX work on mobile) */
     11556        #templateside {
     11557                float: none;
     11558                width: auto;
     11559        }
     11560
     11561        #templateside li {
     11562                margin: 0;
     11563        }
     11564
     11565        #templateside li a {
     11566                display: block;
     11567                padding: 5px;
     11568        }
     11569
     11570        #templateside .highlight {
     11571                padding: 5px;
     11572                margin-left: -5px;
     11573                margin-top: -5px;
     11574        }
     11575
     11576        #template div {
     11577                float: none;
     11578                margin: 0;
     11579                width: auto;
     11580        }
     11581
     11582        #template textarea {
     11583                width: 100%;
     11584        }
     11585
     11586        .fileedit-sub .alignright {
     11587                margin-top: 15px;
     11588        }
     11589
     11590        /* Plugin/Theme Management Page */
     11591        .wp-list-table.plugins {
     11592                position: relative;
     11593                margin-top: 35px;
     11594                margin-bottom: 50px;
     11595        }
     11596
     11597        .wp-list-table.plugins thead .column-description,
     11598        #wpbody-content .wp-list-table.plugins tfoot .column-description,
     11599        .wp-list-table.plugins th#description {
     11600                display: none;
     11601        }
     11602
     11603        #wpbody-content .wp-list-table.plugins,
     11604        #wpbody-content .wp-list-table.plugins thead,
     11605        #wpbody-content .wp-list-table.plugins tbody,
     11606        #wpbody-content .wp-list-table.plugins tr,
     11607        #wpbody-content .wp-list-table.plugins .column-description,
     11608        #wpbody-content .wp-list-table.plugins .plugin-title,
     11609        #wpbody-content .wp-list-table.plugins .theme-title,
     11610        #wpbody-content .wp-list-table.plugins .plugin-update,
     11611        #wpbody-content .wp-list-table.plugins .manage-column.column-name {
     11612                display: block;
     11613                width: auto;
     11614        }
     11615
     11616        .wp-list-table.plugins thead,
     11617        .wp-list-table.plugins tfoot {
     11618                position: absolute;
     11619                top: -35px;
     11620                left: 0;
     11621                right: 0;
     11622                width: auto;
     11623                height: 35px;
     11624        }
     11625
     11626        .wp-list-table.plugins tfoot {
     11627                bottom: -35px;
     11628                top: auto;
     11629        }
     11630
     11631        .active, .inactive {
     11632                padding-top: 0;
     11633        }
     11634
     11635        .wp-list-table.plugins .plugin-title,
     11636        .wp-list-table.plugins .theme-title {
     11637                padding-top: 13px;
     11638                padding-bottom: 4px;
     11639        }
     11640
     11641        .plugins tr.active + tr.inactive th.check-column,
     11642        .plugins tr.active + tr.inactive td,
     11643        .wp-list-table.plugins .plugin-title,
     11644        .wp-list-table.plugins .theme-title,
     11645        .wp-list-table.plugins tbody th {
     11646                box-shadow: none;
     11647                -webkit-box-shadow: none;
     11648        }
     11649
     11650        .plugins tbody {
     11651                padding: 1px 0 0;
     11652        }
     11653
     11654        /* Set drop shadow again per original mp6 plugin settings at line 1265 of colors-mp6.css in r687296, remove when original styles have been corrected */
     11655        .plugins tr.active + tr.inactive td.column-description {
     11656                -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
     11657                -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
     11658                -ms-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
     11659                -o-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
     11660                box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
     11661        }
     11662
     11663        .plugins tr.active + tr.inactive th.check-column,
     11664        .plugins tr.active + tr.inactive td {
     11665                border-top: none;
     11666        }
     11667
     11668        .wp-list-table.plugins .column-description {
     11669                padding-top: 0;
     11670        }
     11671
     11672        .wp-list-table.plugins .manage-column.column-name,
     11673        .wp-list-table.plugins .column-description,
     11674        .wp-list-table.plugins .plugin-title,
     11675        .wp-list-table.plugins .theme-title {
     11676                padding-right: 12px;
     11677                padding-left: 46px;
     11678        }
     11679
     11680        .wp-list-table.plugins tr {
     11681                position: relative;
     11682        }
     11683
     11684        .wp-list-table.plugins th.check-column,
     11685        .wp-list-table.plugins tr.update th.check-column {
     11686                position: absolute;
     11687                height: auto;
     11688                top: 0;
     11689                bottom: 0;
     11690                left: 0;
     11691                padding-left: 2px;
     11692                padding-top: 18px;
     11693        }
     11694
     11695        .wp-list-table.plugins thead th.check-column,
     11696        .wp-list-table.plugins tfoot th.check-column {
     11697                padding-left: 3px;
     11698                padding-top: 11px;
     11699                background: none;
     11700        }
     11701
     11702        .widefat tbody th.check-column input[type="checkbox"] {
     11703                margin-top: -3px;
     11704                margin-left: 9px;
     11705        }
     11706
     11707        .wp-list-table.plugins .active .check-column input,
     11708        .wp-list-table.plugins .update .check-column input {
     11709                margin-left: 6px;
     11710        }
     11711
     11712        .wp-list-table.plugins thead .check-column input,
     11713        .wp-list-table.plugins tfoot .check-column input {
     11714                margin-top: -6px;
     11715        }
     11716
     11717        .wp-list-table.plugins .active th.check-column {
     11718                background: none;
     11719        }
     11720
     11721        .wp-list-table.plugins .plugin-title strong,
     11722        .wp-list-table.plugins .theme-title strong {
     11723                font-size: 1.4em;
     11724                line-height: 1.6em;
     11725        }
     11726
     11727        /*  Dashboard */
     11728        #dashboard_recent_comments #the-comment-list .comment-item .avatar {
     11729                height: 30px;
     11730                width: 30px;
     11731                margin: 4px 10px 5px 0;
     11732        }
     11733
     11734        /*  About Page */
     11735        .about-wrap .feature-section.two-col div {
     11736                width: 100%;
     11737                margin: 0;
     11738                float: none;
     11739        }
     11740
     11741        .about-wrap .three-col.about-updates .col-1,
     11742                /*.about-wrap .three-col.about-updates .col-2,*/
     11743        .about-wrap .three-col.about-updates .col-3 {
     11744                padding: 0;
     11745        }
     11746
     11747        .about-wrap .three-col.about-updates .col-1 {
     11748                width: 100%;
     11749                padding-right: 210px;
     11750        }
     11751
     11752        .about-wrap .three-col.about-updates .col-2 {
     11753                position: relative;
     11754                float: right;
     11755                width: 180px;
     11756                margin-left: -100%;
     11757        }
     11758
     11759        .about-wrap .three-col.about-updates .col-3 {
     11760                width: 100%;
     11761        }
     11762
     11763        .about-wrap .about-password-meter input,
     11764        .about-wrap .about-password-meter #pass-strength-result {
     11765                width: 99%;
     11766        }
     11767
     11768        /* Moderate Comment */
     11769        .comment-ays {
     11770                border-bottom: none;
     11771        }
     11772
     11773        #wpfooter {
     11774                display: none;
     11775        }
     11776
     11777        #comments-form .checkforspam {
     11778                display: none;
     11779        }
     11780}
     11781
     11782/* Tiny screens [ = smaller than 400 wide, 600 tall] */
     11783@media screen and (max-width: 400px), screen and (max-height: 600px) {
     11784        /* Align Add Media + Visual + Text tabs */
     11785        #wp-content-media-buttons a {
     11786                font-size: 14px;
     11787                padding: 0 10px 0 10px;
     11788        }
     11789
     11790        .media-modal {
     11791                position: fixed;
     11792                top: 0;
     11793                left: 0;
     11794                right: 0;
     11795                bottom: 0;
     11796        }
     11797
     11798        .media-modal-backdrop {
     11799                position: fixed;
     11800        }
     11801
     11802        .attachments-browser .attachment,
     11803        .attachments-browser .attachment-preview {
     11804                max-width: 100%;
     11805        }
     11806
     11807        .attachments-browser .media-toolbar-primary input.search {
     11808                max-width: 150px;
     11809        }
     11810
     11811        .uploader-inline-content {
     11812                position: relative;
     11813        }
     11814
     11815        .media-sidebar .setting input[type="checkbox"],
     11816        .media-sidebar .field input[type="checkbox"] {
     11817                width: 25px;
     11818        }
     11819
     11820        /* Don't bother with title for phone-size */
     11821        .media-frame-title {
     11822                display: none;
     11823        }
     11824
     11825        .media-frame-toolbar {
     11826                position: absolute;
     11827                bottom: 0px;
     11828                left: 0;
     11829                right: 0;
     11830                background: #FFF;
     11831                border-top: 1px solid #DEDEDE;
     11832        }
     11833
     11834        .media-toolbar {
     11835                position: relative;
     11836        }
     11837
     11838        .media-frame {
     11839                overflow: hidden;
     11840        }
     11841
     11842        .media-frame .attachments-browser {
     11843                padding-bottom: 300px;
     11844        }
     11845
     11846        .attachments-browser .attachments {
     11847                top: 0;
     11848        }
     11849
     11850        .attachment-details h3 {
     11851                margin-top: 45px;
     11852        }
     11853
     11854        /* Image From Link */
     11855        .embed-link-settings,
     11856        .embed-image-settings {
     11857                padding-bottom: 52px;
     11858        }
     11859
     11860        /* Gallery */
     11861        .media-frame.hide-router .media-frame-content {
     11862                top: 0;
     11863                border-top: none;
     11864        }
     11865
     11866        .gallery-settings h3 {
     11867                margin-top: 45px;
     11868        }
     11869}
     11870
     11871@media only screen and (max-width: 500px) {
     11872        .about-wrap {
     11873                margin-right: 20px;
     11874                margin-left: 10px;
     11875        }
     11876
     11877        .about-wrap h1,
     11878        .about-text {
     11879                margin-right: 0;
     11880        }
     11881
     11882        .about-text {
     11883                margin-bottom: 0.25em;
     11884        }
     11885
     11886        .about-wrap .wp-badge {
     11887                position: relative;
     11888                margin-bottom: 1.5em;
     11889                width: 100%;
     11890        }
     11891
     11892        .about-wrap .feature-section.three-col div {
     11893                width: 100%;
     11894                float: none;
     11895        }
     11896
     11897        .about-wrap .three-col.about-updates .col-1 {
     11898                padding: 0;
     11899                float: none;
     11900        }
     11901
     11902        .about-wrap .three-col.about-updates .col-2 {
     11903                margin: 0 0 20px;
     11904                width: 100%;
     11905                float: none;
     11906        }
     11907
     11908        .about-wrap .about-passwords {
     11909                margin: 20px -20px;
     11910        }
     11911
     11912}
     11913
     11914@media screen and ( max-width: 782px ) {
     11915        /* Toolbar Touchification*/
     11916        html.wp-toolbar {
     11917                padding-top: 46px;
     11918        }
     11919
     11920        html #wpadminbar {
     11921                left: 0 !important;
     11922                z-index: 500 !important;
     11923                height: 46px;
     11924                min-width: 300px;
     11925
     11926                -webkit-transform: translate3d(0, 0, 0);
     11927                -webkit-backface-visibility: hidden;
     11928                -webkit-transition: 0;
     11929                transform: translate3d(0, 0, 0);
     11930                backface-visibility: hidden;
     11931                transition: 0;
     11932        }
     11933
     11934        #wpadminbar * {
     11935                font: normal 14px/32px "Open Sans", sans-serif;
     11936        }
     11937
     11938        #wpadminbar .quicklinks li > a {
     11939                padding: 0;
     11940                height: 46px;
     11941                line-height: 46px;
     11942                width: auto;
     11943        }
     11944
     11945        #wpadminbar .ab-icon {
     11946                font: 40px/1 dashicons !important;
     11947                margin: 0;
     11948                padding: 0;
     11949                width: 50px;
     11950                height: 46px;
     11951        }
     11952
     11953        #wpadminbar .ab-icon:before {
     11954                text-align: center;
     11955        }
     11956
     11957        #wpadminbar .ab-submenu {
     11958                padding: 0;
     11959        }
     11960
     11961        #wpadminbar .ab-label {
     11962                display: none;
     11963        }
     11964
     11965        #wpadminbar .menupop li:hover > .ab-sub-wrapper,
     11966        #wpadminbar .menupop li.hover > .ab-sub-wrapper {
     11967                margin-top: -46px;
     11968        }
     11969
     11970        #wpadminbar .ab-top-menu .menupop .ab-sub-wrapper .menupop > .ab-item {
     11971                padding-right: 30px;
     11972        }
     11973
     11974        #wpadminbar .menupop .menupop > .ab-item:before {
     11975                top: 10px;
     11976                right: 6px;
     11977        }
     11978
     11979        #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper .ab-item {
     11980                font-size: 16px;
     11981                padding: 6px 15px 12px;
     11982        }
     11983
     11984        #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper a:empty {
     11985                display: none;
     11986        }
     11987
     11988        /* WP logo */
     11989        #wpadminbar #wp-admin-bar-wp-logo > .ab-item {
     11990                padding: 0;
     11991        }
     11992
     11993        #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon {
     11994                padding: 0;
     11995                width: 50px;
     11996                height: 46px;
     11997                text-align: center;
     11998                vertical-align: top;
     11999        }
     12000
     12001        #wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
     12002                font: 28px/1 'dashicons' !important;
     12003                top: -3px;
     12004        }
     12005
     12006        #wpadminbar .ab-icon,
     12007        #wpadminbar .ab-item::before {
     12008                padding: 0;
     12009        }
     12010
     12011        /* My Sites and "Site Title" menu */
     12012        #wpadminbar #wp-admin-bar-my-sites > .ab-item,
     12013        #wpadminbar #wp-admin-bar-site-name > .ab-item {
     12014                text-indent: 100%;
     12015                text-overflow: clip !important;
     12016                width: 50px;
     12017                padding: 0;
     12018                color: #999;
     12019                position: relative;
     12020        }
     12021
     12022        #wpadminbar #wp-admin-bar-my-sites > .ab-item:before,
     12023        #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
     12024                display: block;
     12025                text-indent: 0;
     12026                font: normal 35px/1 'dashicons' !important;
     12027                speak: none;
     12028                top: 5px;
     12029                width: 50px;
     12030                text-align: center;
     12031                -webkit-font-smoothing: antialiased;
     12032                -moz-osx-font-smoothing: grayscale;
     12033        }
     12034
     12035        #wpadminbar #wp-admin-bar-site-name > .ab-item:before {
     12036                content: '\f102';
     12037                padding: 0;
     12038        }
     12039
     12040        #wpadminbar #wp-admin-bar-my-sites > .ab-item:before {
     12041                content: '\f112';
     12042                font-size: 28px !important;
     12043                padding-top: 8px;
     12044                padding-left: 12px;
     12045        }
     12046
     12047        #wpadminbar #wp-admin-bar-appearance {
     12048                margin-top: 0;
     12049        }
     12050
     12051        #wpadminbar .quicklinks li .blavatar:before {
     12052                display: none;
     12053        }
     12054
     12055        /* Search */
     12056        #wpadminbar #wp-admin-bar-search {
     12057                display: none;
     12058        }
     12059
     12060        /* New Content */
     12061        #wpadminbar #wp-admin-bar-new-content .ab-icon:before {
     12062                top: 0;
     12063                line-height: 53px;
     12064                height: 46px !important;
     12065                text-align: center;
     12066                width: 50px;
     12067                display: block;
     12068        }
     12069
     12070        /* Updates */
     12071        #wpadminbar #wp-admin-bar-updates {
     12072                text-align: center;
     12073        }
     12074
     12075        #wpadminbar #wp-admin-bar-updates .ab-icon:before {
     12076                top: 3px;
     12077        }
     12078
     12079        /* Comments */
     12080        #wpadminbar #wp-admin-bar-comments .ab-icon {
     12081                margin: 0;
     12082        }
     12083
     12084        #wpadminbar #wp-admin-bar-comments .ab-icon:before {
     12085                display: block;
     12086                font-size: 34px;
     12087                height: 46px;
     12088                line-height: 47px;
     12089                top: 0;
     12090        }
     12091
     12092        /* My Account */
     12093        #wpadminbar #wp-admin-bar-my-account > a {
     12094                position: relative;
     12095                white-space: nowrap;
     12096                text-indent: 100%;
     12097                width: 28px;
     12098                padding: 0 10px;
     12099        }
     12100
     12101        #wpadminbar .quicklinks li#wp-admin-bar-my-account.with-avatar > a img {
     12102                position: absolute;
     12103                top: 13px;
     12104                right: 10px;
     12105                width: 26px;
     12106                height: 26px;
     12107        }
     12108
     12109        #wpadminbar #wp-admin-bar-user-actions.ab-submenu {
     12110                padding: 0;
     12111        }
     12112
     12113        #wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
     12114                display: none;
     12115        }
     12116
     12117        #wpadminbar #wp-admin-bar-my-account.with-avatar #wp-admin-bar-user-actions > li {
     12118                margin: 0;
     12119        }
     12120
     12121        #wpadminbar #wp-admin-bar-user-info .display-name {
     12122                height: auto;
     12123                font-size: 16px;
     12124                line-height: 24px;
     12125                color: #eee;
     12126        }
     12127
     12128        #wpadminbar #wp-admin-bar-user-info a {
     12129                padding-top: 4px;
     12130        }
     12131
     12132        #wpadminbar #wp-admin-bar-user-info .username {
     12133                line-height: 0.8 !important;
     12134                margin-bottom: -2px;
     12135        }
     12136
     12137        /* Hide all third party items */
     12138        #wp-admin-bar-top-secondary > li {
     12139                display: none;
     12140        }
     12141
     12142        #wp-admin-bar-root-default li#wp-admin-bar-wp-logo,
     12143        #wp-admin-bar-root-default li#wp-admin-bar-my-sites,
     12144        #wp-admin-bar-root-default li#wp-admin-bar-site-name,
     12145        #wp-admin-bar-root-default li#wp-admin-bar-new-content,
     12146        #wp-admin-bar-root-default li#wp-admin-bar-comments,
     12147        #wp-admin-bar-root-default li#wp-admin-bar-new-content,
     12148        #wp-admin-bar-top-secondary li#wp-admin-bar-my-account {
     12149                display: block;
     12150        }
     12151
     12152        #wpadminbar ul#wp-admin-bar-root-default > li {
     12153                margin-right: 0;
     12154        }
     12155
     12156        /* Experimental fix for touch toolbar dropdown positioning */
     12157        #wpadminbar .ab-top-menu,
     12158        #wpadminbar .ab-top-secondary,
     12159        #wpadminbar #wp-admin-bar-wp-logo,
     12160        #wpadminbar #wp-admin-bar-my-sites,
     12161        #wpadminbar #wp-admin-bar-site-name,
     12162        #wpadminbar #wp-admin-bar-updates,
     12163        #wpadminbar #wp-admin-bar-comments,
     12164        #wpadminbar #wp-admin-bar-new-content,
     12165        #wpadminbar #wp-admin-bar-my-account {
     12166                position: static;
     12167        }
     12168
     12169        #wpadminbar #wp-admin-bar-comments,
     12170        #wpadminbar #wp-admin-bar-new-content,
     12171        #wpadminbar #wp-admin-bar-my-account {
     12172                float: right;
     12173        }
     12174
     12175        #wpadminbar #wp-admin-bar-comments .ab-sub-wrapper,
     12176        #wpadminbar #wp-admin-bar-new-content .ab-sub-wrapper,
     12177        #wpadminbar #wp-admin-bar-my-account .ab-sub-wrapper {
     12178                right: 0;
     12179                left: auto;
     12180        }
     12181
     12182        #wpadminbar ul#wp-admin-bar-root-default > li#wp-admin-bar-comments {
     12183                margin-right: 100px;
     12184        }
     12185
     12186        #wpadminbar ul#wp-admin-bar-root-default > li#wp-admin-bar-new-content {
     12187                margin-right: -100px;
     12188        }
     12189
     12190        #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
     12191                margin-right: -150px;
     12192        }
     12193
     12194        .network-admin #wpadminbar ul#wp-admin-bar-top-secondary > li#wp-admin-bar-my-account {
     12195                margin-right: 0;
     12196        }
     12197}
     12198
     12199/* Horizontal */
     12200@media screen and (max-width: 480px) and (orientation: landscape) {
     12201        #wpadminbar {
     12202                position: absolute;
     12203        }
     12204}
     12205
     12206/* Smartphone */
     12207@media screen and (max-width: 480px) {
     12208        #moby6-overlay {
     12209                position: fixed;
     12210                top: 0;
     12211                left: 0;
     12212                width: 100%;
     12213                height: 100%;
     12214                z-index: 400;
     12215        }
     12216
     12217        #wpadminbar .ab-top-menu > .menupop > .ab-sub-wrapper {
     12218                position: fixed;
     12219                width: 100%;
     12220                left: 0;
     12221        }
     12222
     12223        #wpadminbar .menupop .menupop > .ab-item:before {
     12224                display: none;
     12225        }
     12226
     12227        #wpadminbar #wp-admin-bar-wp-logo.menupop .ab-sub-wrapper {
     12228                margin-left: 0;
     12229        }
     12230
     12231        #wpadminbar #wp-admin-bar-updates,
     12232        #wpadminbar #wp-admin-bar-view,
     12233        #wpadminbar #wp-admin-bar-edit {
     12234                display: none;
     12235        }
     12236}
     12237
     12238@media screen and (max-width: 350px) {
     12239        #wpadminbar #wp-admin-bar-wp-logo {
     12240                display: none;
     12241        }
     12242}
     12243 No newline at end of file
  • src/wp-admin/js/common.js

     
    530530
    531531stickyMenu.init();
    532532
     533var moby6 = {
     534
     535        init: function() {
     536                // cached selectors
     537                this.$html = $( document.documentElement );
     538                this.$body = $( document.body );
     539                this.$wpwrap = $( '#wpwrap' );
     540                this.$wpbody = $( '#wpbody' );
     541                this.$adminmenu = $( '#adminmenu' );
     542                this.$overlay = $( '#moby6-overlay' );
     543                this.$toolbar = $( '#wp-toolbar' );
     544                this.$toolbarPopups = this.$toolbar.find( 'a[aria-haspopup="true"]' );
     545
     546                // Modify functionality based on custom activate/deactivate event
     547                this.$html
     548                        .on( 'activate.moby6', function() { moby6.activate(); } )
     549                        .on( 'deactivate.moby6', function() { moby6.deactivate(); } );
     550
     551                // Toggle sidebar when toggle is clicked
     552                $( '#wp-admin-bar-toggle-button' ).on( 'click', function(evt) {
     553                        evt.preventDefault();
     554                        moby6.$wpwrap.toggleClass( 'moby6-open' );
     555                } );
     556
     557                // Trigger custom events based on active media query.
     558                this.matchMedia();
     559                $( window ).on( 'resize', $.proxy( this.matchMedia, this ) );
     560        },
     561
     562        activate: function() {
     563
     564                window.stickymenu && window.stickymenu.disable();
     565
     566                if ( ! moby6.$body.hasClass( 'auto-fold' ) )
     567                        moby6.$body.addClass( 'auto-fold' );
     568
     569                this.modifySidebarEvents();
     570                this.disableDraggables();
     571                this.movePostSearch();
     572
     573        },
     574
     575        deactivate: function() {
     576
     577                window.stickymenu && window.stickymenu.enable();
     578
     579                this.enableDraggables();
     580                this.removeHamburgerButton();
     581                this.restorePostSearch();
     582
     583        },
     584
     585        matchMedia: function() {
     586                clearTimeout( this.resizeTimeout );
     587                this.resizeTimeout = setTimeout( function() {
     588
     589                        if ( ! window.matchMedia )
     590                                return;
     591
     592                        if ( window.matchMedia( '(max-width: 782px)' ).matches ) {
     593                                if ( moby6.$html.hasClass( 'touch' ) )
     594                                        return;
     595                                moby6.$html.addClass( 'touch' ).trigger( 'activate.moby6' );
     596                        } else {
     597                                if ( ! moby6.$html.hasClass( 'touch' ) )
     598                                        return;
     599                                moby6.$html.removeClass( 'touch' ).trigger( 'deactivate.moby6' );
     600                        }
     601
     602                        if ( window.matchMedia( '(max-width: 480px)' ).matches ) {
     603                                moby6.enableOverlay();
     604                        } else {
     605                                moby6.disableOverlay();
     606                        }
     607
     608                }, 150 );
     609        },
     610
     611        enableOverlay: function() {
     612                if ( this.$overlay.length === 0 ) {
     613                        this.$overlay = $( '<div id="moby6-overlay"></div>' )
     614                                .insertAfter( '#wpcontent' )
     615                                .hide()
     616                                .on( 'click.moby6', function() {
     617                                        moby6.$toolbar.find( '.menupop.hover' ).removeClass( 'hover' );
     618                                        $( this ).hide();
     619                                });
     620                }
     621                this.$toolbarPopups.on( 'click.moby6', function() {
     622                        moby6.$overlay.show();
     623                });
     624        },
     625
     626        disableOverlay: function() {
     627                this.$toolbarPopups.off( 'click.moby6' );
     628                this.$overlay.hide();
     629        },
     630
     631        modifySidebarEvents: function() {
     632                this.$body.off( '.wp-mobile-hover' );
     633                this.$adminmenu.find( 'a.wp-has-submenu' ).off( '.wp-mobile-hover' );
     634
     635                var scrollStart = 0;
     636                this.$adminmenu.on( 'touchstart.moby6', 'li.wp-has-submenu > a', function() {
     637                        scrollStart = $( window ).scrollTop();
     638                });
     639
     640                this.$adminmenu.on( 'touchend.moby6', 'li.wp-has-submenu > a', function( e ) {
     641                        e.preventDefault();
     642
     643                        if ( $( window ).scrollTop() !== scrollStart )
     644                                return false;
     645
     646                        $( this ).find( 'li.wp-has-submenu' ).removeClass( 'selected' );
     647                        $( this ).parent( 'li' ).addClass( 'selected' );
     648                });
     649        },
     650
     651        disableDraggables: function() {
     652                this.$wpbody
     653                        .find( '.hndle' )
     654                        .removeClass( 'hndle' )
     655                        .addClass( 'hndle-disabled' );
     656        },
     657
     658        enableDraggables: function() {
     659                this.$wpbody
     660                        .find( '.hndle-disabled' )
     661                        .removeClass( 'hndle-disabled' )
     662                        .addClass( 'hndle' );
     663        },
     664
     665        removeHamburgerButton: function() {
     666                if ( this.hamburgerButtonView !== undefined )
     667                        this.hamburgerButtonView.destroy();
     668        },
     669
     670        movePostSearch: function() {
     671                this.searchBox = this.$wpbody.find( 'p.search-box' );
     672                if ( this.searchBox.length ) {
     673                        this.searchBox.hide();
     674                        if ( this.searchBoxClone === undefined ) {
     675                                this.searchBoxClone = this.searchBox.first().clone().insertAfter( 'div.tablenav.bottom' );
     676                        }
     677                        this.searchBoxClone.show();
     678                }
     679        },
     680
     681        restorePostSearch: function() {
     682                if ( this.searchBox !== undefined ) {
     683                        this.searchBox.show();
     684                        if ( this.searchBoxClone !== undefined )
     685                                this.searchBoxClone.hide();
     686                }
     687        }
     688};
     689
     690// Fire moby6.init when document is ready
     691$( document ).ready( $.proxy( moby6.init, moby6 ) );
     692
     693// make Windows 8 devices playing along nicely
     694if ( '-ms-user-select' in document.documentElement.style && navigator.userAgent.match(/IEMobile\/10\.0/) ) {
     695        var msViewportStyle = document.createElement( 'style' );
     696        msViewportStyle.appendChild(
     697                document.createTextNode( '@-ms-viewport{width:auto!important}' )
     698        );
     699        document.getElementsByTagName( 'head' )[0].appendChild( msViewportStyle );
     700}
     701
    533702// internal use
    534703$(document).bind( 'wp_CloseOnEscape', function( e, data ) {
    535704        if ( typeof(data.cb) != 'function' )
  • src/wp-includes/admin-bar.php

     
    156156}
    157157
    158158/**
     159 * Add the sidebar toggle button.
     160 *
     161 * @since 3.8.0
     162 *
     163 * @param WP_Admin_Bar $wp_admin_bar
     164 */
     165function wp_admin_bar_sidebar_toggle( $wp_admin_bar ) {
     166        if ( is_admin() ) {
     167                $wp_admin_bar->add_menu( array(
     168                        'id'    => 'toggle-button',
     169                        'title' => '<span class="ab-icon"></span>',
     170                        'href'  => '#',
     171                        'meta'  => array(
     172                                'title' => __( 'Menu' ),
     173                        ),
     174                ) );
     175        }
     176}
     177
     178/**
    159179 * Add the "My Account" item.
    160180 *
    161181 * @since 3.3.0
  • src/wp-includes/class-wp-admin-bar.php

     
    482482                add_action( 'admin_bar_menu', 'wp_admin_bar_my_account_item', 7 );
    483483
    484484                // Site related.
     485                add_action( 'admin_bar_menu', 'wp_admin_bar_sidebar_toggle', 0 );
    485486                add_action( 'admin_bar_menu', 'wp_admin_bar_wp_menu', 10 );
    486487                add_action( 'admin_bar_menu', 'wp_admin_bar_my_sites_menu', 20 );
    487488                add_action( 'admin_bar_menu', 'wp_admin_bar_site_menu', 30 );