diff --git a/src/wp-admin/css/theme.css b/src/wp-admin/css/theme.css deleted file mode 100644 index 13eefb5366..0000000000 --- a/src/wp-admin/css/theme.css +++ /dev/null @@ -1,876 +0,0 @@ -.theme-browser .themes { - clear: both; - padding: 0 0 100px; -} - -.themes-php .wrap h2 { - float: left; - margin-bottom: 15px; -} - -.themes-php .wrap h2 .button { - margin-left: 20px; -} - -.themes-php .theme-count { - color: #fff; - border-radius: 30px; - background: #777; - font-size: 14px; - padding: 4px 10px; - font-weight: 600; - margin-left: 5px; - margin-right: 20px; - position: relative; - top: -3px; -} - -/* Position admin messages */ -.themes-php div.updated { - margin: 0 0 20px 0; - clear: both; -} - -.themes-php div.updated a { - text-decoration: underline; -} - -/** - * Main theme element - * (has flexible margins) - */ -.theme { - cursor: pointer; - float: left; - margin: 0 5% 4% 0; - position: relative; - width: 30%; - border: 1px solid #dedede; - -webkit-box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1); - box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1); - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -.theme:nth-child(3n) { - margin-right: 0; -} - -.theme:hover, -.theme:focus { - cursor: pointer; -} - -.theme .theme-name { - font-size: 15px; - font-weight: 600; - margin: 0; - padding: 15px; - -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); - box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; -} - -.theme-name { - background: #fff; - background: rgba(255,255,255,0.65); -} - -/* Activate and Customize buttons, shown on hover */ -.theme .theme-actions { - opacity: 0; - -webkit-transition: opacity 0.1s ease-in-out; - transition: opacity 0.1s ease-in-out; - position: absolute; - bottom: 0; - right: 0; - height: 38px; - padding: 9px 10px 0 10px; - background: rgba(244, 244, 244, 0.7); - border-left: 1px solid rgba(0,0,0,0.05); -} - -.theme:hover .theme-actions { - opacity: 1; -} - -.theme .theme-actions .button-primary { - margin-right: 3px; -} - -.theme .theme-actions .button-secondary { - float: none; - margin-left: 3px; -} - -/** - * Theme Screenshot - * - * Has a fixed aspect ratio of 1.5 to 1 regardless of screenshot size - * It is also responsive. - */ -.theme .theme-screenshot { - display: block; - overflow: hidden; - position: relative; - -webkit-transition: opacity 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out; -} - -.theme .theme-screenshot:after { - content: ''; - display: block; - padding-top: 66%; /* using a 3/2 aspect ratio */ -} - -.theme .theme-screenshot img { - height: auto; - position: absolute; - left: 0; - top: 0; - width: 100%; - -webkit-transform: translateZ( 0 ); /* Prevents rendering bugs in Chrome */ - -webkit-transition: opacity 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out; -} - -.theme:after { - display: block; - opacity: 0; - content: '\f348'; - -webkit-font-smoothing: antialiased; - font: normal 64px/1 'dashicons'; - vertical-align: middle; - text-align: center; - color: #000; - position: absolute; - top: 0; - left: 0; - right: 0; - padding-top: 24%; - text-shadow: 0 1px 20px rgba(255,255,255,0.9); - -webkit-transition: opacity 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out; -} - -.theme:hover:after { - opacity: 0.6; -} - -.theme:hover .theme-screenshot { - background: #fff; -} - -.theme:hover .theme-screenshot img { - opacity: 0.4; -} - -/** - * Displays a theme update notice - * when an update is available. - */ -.theme .theme-update { - background: #d54e21; - background: rgba(213, 78, 33, 0.95); - color: #fff; - display: block; - font-size: 13px; - font-weight: 400; - height: 48px; - line-height: 48px; - padding: 0 10px; - position: absolute; - top: 0; - right: 0; - left: 0; - border-bottom: 1px solid rgba(0,0,0,0.25); - overflow: hidden; -} - -.theme .theme-update:before { - content: '\f113'; - display: inline-block; - font: normal 20px/1 'dashicons'; - margin: 0 6px 0 0; - opacity: 0.8; - position: relative; - top: 5px; - speak: none; - -webkit-font-smoothing: antialiased; -} - - -/** - * The currently active theme - */ -.theme.active { -} - -.theme.active .theme-screenshot { -} - -.theme.active .theme-name { - background: #0074a2; - color: #fff; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); - box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); -} - -.theme.active .theme-actions { - top: 0; - left: 0; - background: #2f2f2f; - height: 48px; - opacity: 1; - line-height: 48px; - padding: 0 10px; - z-index: 1; -} - -.theme.active .theme-actions .button { - float: right; - margin-top: 10px; -} - -.theme.active .current-label { - font-size: 13px; - font-weight: 400; - color: #ccc; - margin-left: 5px; -} - -.theme.active .theme-update { - top: 48px; -} - -.theme .theme-author { - background: #222; - color: #eee; - display: none; - font-size: 14px; - margin: 0 10px; - padding: 5px 10px; - position: absolute; - bottom: 56px; -} - -.theme.display-author .theme-author { - display: block; -} - -.theme.display-author .theme-author a { - color: inherit; - text-decoration: none; -} - -/** - * Add new theme - */ -.theme-browser .add-new-theme { - border: none; - box-shadow: none; -} - -.theme-browser .add-new-theme a { - color: #999; - text-decoration: none; - display: block; - position: relative; - z-index: 1; -} - -.theme-browser .add-new-theme:after { - display: block; - content: ''; - opacity: 1; - background: rgba(0, 0, 0, 0); - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - padding: 10% 0 0 0; - text-shadow: none; - border: 5px dashed rgba(0, 0, 0, 0.1); - -webkit-transition: opacity 0.2s ease-in-out; - transition: opacity 0.2s ease-in-out; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -.theme-browser .add-new-theme span:after { - background: rgba(153, 153, 153, 0.1); - border-radius: 50%; - display: inline-block; - content: '\f132'; - -webkit-font-smoothing: antialiased; - font: normal 74px/115px 'dashicons'; - width: 100px; - height: 100px; - vertical-align: middle; - text-align: center; - color: rgb(153, 153, 153); - position: absolute; - top: 30%; - left: 50%; - margin-left: -50px; - text-indent: -4px; - padding: 0; - text-shadow: none; - z-index:4; -} - -.theme-browser .add-new-theme:hover .theme-screenshot { - background: none; -} - -.theme-browser .add-new-theme:hover span:after { - background: #fff; - color: #0074a2; -} - -.theme-browser .add-new-theme:hover:after { - border-color: transparent; - color: #fff; - background: #0074a2; -} - -.theme-browser .add-new-theme .theme-name { - background: none; - text-align: center; - box-shadow: none; - font-weight: 400; - position: relative; - top: -50px; -} - -.theme-browser .add-new-theme:hover .theme-name { - color: #fff; - z-index: 2; -} - -/* - * The search form - */ -.themes-php .theme-search { - position: relative; - top: -2px; - left: 20px; - font-size: 16px; - font-weight: 300; - line-height: 1.5; -} - -/** - * Theme Overlay - * Shown when clicking a theme - */ -.theme-overlay .theme-backdrop { - position: absolute; - left: -20px; - right: 0; - top: 0; - bottom: 0; - background: rgba( 238, 238, 238, 0.9 ); - z-index: 10; -} - -body.theme-overlay-open { - overflow: hidden; -} - -.theme-overlay .theme-utility { - position: absolute; - top: 0; - left: 0; - right: 0; - border-bottom: 1px solid #eee; -} - -.theme-overlay .back { - cursor: pointer; - height: 48px; - width: 50px; - text-align: center; - float: right; - border-left: 1px solid #eee; -} - -.theme-overlay .back:hover { - background: #333; -} - -.theme-overlay .back:hover:before { - color: #fff; -} - -.theme-overlay .back:before { - font: normal 30px/48px 'dashicons' !important; - color: #bbb; - display: inline-block; - content: '\f335'; - font-weight: 300; -} - -/* Left and right navigation */ -.theme-overlay .right, -.theme-overlay .left { - cursor: pointer; - height: 48px; - width: 54px; - float: left; - text-align: center; - border-right: 1px solid #eee; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.theme-overlay .right:hover, -.theme-overlay .left:hover { - background: #333; -} - -.theme-overlay .right:hover:before, -.theme-overlay .left:hover:before { - color: #fff; -} - -.theme-overlay .left:before { - content: '\f341'; -} - -.theme-overlay .right:before { - content: '\f345'; -} - -.theme-overlay .right:before, -.theme-overlay .left:before { - font: normal 16px/54px 'dashicons' !important; - display: inline; - font-weight: 300; -} - -.theme-overlay .theme-wrap { - clear: both; - position: fixed; - top: 120px; - left: 190px; - right: 40px; - bottom: 80px; - overflow: auto; - background: #fff; - padding: 88px 40px 110px 40px; - -webkit-box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1); - box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1); - z-index: 20; -} - -.theme-overlay .theme-wrap:after { - content: "."; - display: block; - height: 0; - clear: both; - visibility: hidden; -} - -.theme-overlay .theme-actions { - position: fixed; - text-align: center; - bottom: 80px; - left: 190px; - right: 40px; - padding: 20px 25px; - background: rgba(243, 243, 243 ,0.9); - border-top: 1px solid rgba(0,0,0,0.1); - z-index: 30; -} - -.theme-overlay.active .theme-actions { -} - -.theme-overlay .theme-actions a { - margin-right: 5px; - margin-bottom: 0; - font-size: 16px; - line-height: 37px; - height: 37px; - padding: 0 20px 1px 20px; -} - -.theme-overlay .theme-actions .delete-theme { - border-radius: 2px; - color: #a00; - font-size: 14px; - padding: 0 10px; - position: absolute; - right: 10px; - bottom: 20px; - text-decoration: none; -} - -.theme-overlay .theme-actions .delete-theme:hover { - background: #d54e21; - color: #fff; -} - -.theme-overlay .theme-actions .active-theme, -.theme-overlay.active .theme-actions .inactive-theme { - display: none; -} - -.theme-overlay .theme-actions .inactive-theme, -.theme-overlay.active .theme-actions .active-theme { - display: block; -} - -/** - * Theme Screenshots gallery - */ -.theme-overlay .theme-screenshots { - float: left; - margin: 0 30px 0 0; - width: 55%; - text-align: center; -} - -/* First screenshot, shown big */ -.theme-overlay .screenshot { - border: 1px solid #fff; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - overflow: hidden; - position: relative; - -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.2); - box-shadow: 0 0 0 1px rgba(0,0,0,0.2); -} - -.theme-overlay .screenshot:after { - content: ''; - display: block; - padding-top: 66.66666%; /* using a 3/2 aspect ratio */ -} - -.theme-overlay .screenshot img { - cursor: pointer; - height: auto; - position: absolute; - left: 0; - top: 0; - width: 100%; -} - -/* Other screenshots, shown small and square */ -.theme-overlay .screenshot.thumb { - background: #ccc; - border: 1px solid #eee; - float: none; - display: inline-block; - margin: 10px 5px 0; - width: 140px; - height: 80px; -} - -.theme-overlay .screenshot.thumb:after { - content: ''; - display: block; - padding-top: 100%; /* using a 1/1 aspect ratio */ -} - -.theme-overlay .screenshot.thumb img { - cursor: pointer; - height: auto; - position: absolute; - left: 0; - top: 0; - width: 100%; - height: auto; -} - -.theme-overlay .screenshot.selected { - background: transparent; - border: 2px solid #2ea2cc; -} - -.theme-overlay .screenshot.selected img { - opacity: 0.8; -} - -/* No screenshot placeholder */ -.theme .theme-screenshot.blank, -.theme-overlay .screenshot.blank { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=); -} - -/** - * Theme heading information - */ -.theme-overlay .theme-info { - width: 40%; - float: left; -} - -.theme-overlay .current-label { - background: #333; - color: #fff; - font-size: 11px; - display: inline-block; - padding: 2px 8px; - border-radius: 2px; - margin: 0 0 -10px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.theme-overlay .theme-name { - color: #222; - font-size: 32px; - font-weight: 100; - margin: 10px 0 0; - line-height: 1.3; -} - -.theme-overlay .theme-version { - color: #999; - font-size: 13px; - font-weight: 400; - float: none; - display: inline-block; - margin-left: 10px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; -} - -.theme-overlay .theme-author { - color: #686868; - font-size: 16px; - font-weight: 400; - margin: 15px 0 25px; -} - -.theme-overlay .theme-author a { - color: inherit; - text-decoration: none; -} - -.theme-overlay .theme-description { - color: #555; - font-size: 15px; - font-weight: 400; - line-height: 1.5; - margin: 30px 0 0 0; -} - -.theme-overlay .theme-tags { - border-top: 3px solid #eee; - color: #888; - font-size: 13px; - font-weight: 400; - margin: 30px 0 0 0; - padding-top: 20px; - text-transform: capitalize; -} - -.theme-overlay .theme-tags span { - color: #444; - font-weight: bold; - margin-right: 5px; -} - -.theme-overlay .theme-actions { -} - -/* Theme Updates info */ -.theme-overlay .theme-update-message { - background: #fefaf7; - border: 1px solid #eee; - border-left: 4px solid #d54e21; - border-radius: 3px; - padding: 5px 20px 10px; -} - -.theme-overlay .theme-update { - color: #222; - font-size: 18px; - display: inline-block; - line-height: 40px; - margin: 0; -} - -.theme-overlay .parent-theme { - background: #f7fcfe; - border: 1px solid #eee; - border-left: 4px solid #2ea2cc; - font-size: 14px; - font-weight: normal; - margin-top: 30px; - padding: 10px 10px 10px 20px; -} - -.theme-overlay .parent-theme strong { - font-weight: 700; -} - -/** - * Basic Responsive structure... - * - * Shuffles theme columns around based on screen width - */ - -@media only screen and (min-width: 1700px) { - .theme { - width: 22.7%; - margin: 0 3% 3% 0; - } - - .theme:nth-child(3n) { - margin-right: 3%; - } - - .theme:nth-child(4n) { - margin-right: 0; - } - - .theme-overlay .theme-wrap, - .theme-overlay .theme-actions { - right: 15%; - left: 22%; - } -} - -@media only screen and (max-width: 1200px) { - .theme { - width: 47.5%; - margin-right: 0; - } - - .theme:nth-child(even) { - margin-right: 0; - } - - .theme:nth-child(odd) { - margin-right: 5%; - } -} - -/* Admin menu is folded */ -@media only screen and (max-width: 900px) { - .theme-overlay .theme-wrap, - .theme-overlay .theme-actions { - left: 76px; - } -} - -@media only screen and (max-width: 780px) { - .theme.active .theme-actions .button { - margin-top: 6px; - margin-right: -3px - } - - .theme-overlay .theme-wrap { - top: 45px; - right: 0; - bottom: 0; - left: 0; - padding: 70px 20px 100px; - } - - .theme-overlay .theme-actions { - right: 0; - bottom: 0; - left: 0; - text-align: left; - padding: 10px; - } - - .theme-overlay .theme-screenshots { - width: 40%; - } - - .theme-overlay .theme-info { - width: 50%; - } - - .theme-overlay .theme-actions .delete-theme { - bottom: 10px; - } -} - -@media only screen and (max-width: 650px) { - .theme { - width: 100%; - margin-right: 0; - } - - .theme:hover .theme-actions { - display: none; - } - - .theme:nth-child(2n), - .theme:nth-child(3n) { - margin-right: 0; - } - - .theme-overlay .theme-update, - .theme-overlay .theme-description { - margin-left: 0; - } - - .theme-overlay.active .theme-actions .active-theme .button:nth-child(3n) { - display: none; - } - - .theme.active .theme-actions .button { - margin-top: 6px; - margin-right: 0; - } - - .theme-overlay .theme-screenshots { - width: 100%; - float: none; - } - - .theme-overlay .theme-info { - width: 100%; - } - - .theme-overlay .theme-author { - margin: 5px 0 15px 0; - } - - .theme-overlay .theme-version { - margin-left: 0; - position: absolute; - top: 18px; - left: 130px; - } - - .theme-overlay .current-label { - margin-top: 10px; - font-size: 13px; - } - - .themes-php .wrap h2 { - width: 100%; - } - - .themes-php .theme-search { - float: none; - clear: both; - left: 0; - top: 0; - right: 0; - margin: 10px 0; - width: 100%; - } -} diff --git a/src/wp-admin/css/wp-admin.css b/src/wp-admin/css/wp-admin.css index e766386402..714a2b70f0 100644 --- a/src/wp-admin/css/wp-admin.css +++ b/src/wp-admin/css/wp-admin.css @@ -6288,6 +6288,883 @@ span.imgedit-scale-warn { 16.1 - Manage Themes ------------------------------------------------------------------------------*/ +.theme-browser .themes { + clear: both; + padding: 0 0 100px; +} + +.themes-php .wrap h2 { + float: left; + margin-bottom: 15px; +} + +.themes-php .wrap h2 .button { + margin-left: 20px; +} + +.themes-php .theme-count { + color: #fff; + border-radius: 30px; + background: #777; + font-size: 14px; + padding: 4px 10px; + font-weight: 600; + margin-left: 5px; + margin-right: 20px; + position: relative; + top: -3px; +} + +/* Position admin messages */ +.themes-php div.updated { + margin: 0 0 20px 0; + clear: both; +} + +.themes-php div.updated a { + text-decoration: underline; +} + +/** + * Main theme element + * (has flexible margins) + */ +.theme { + cursor: pointer; + float: left; + margin: 0 5% 4% 0; + position: relative; + width: 30%; + border: 1px solid #dedede; + -webkit-box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1); + box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1); + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +.theme:nth-child(3n) { + margin-right: 0; +} + +.theme:hover, +.theme:focus { + cursor: pointer; +} + +.theme .theme-name { + font-size: 15px; + font-weight: 600; + margin: 0; + padding: 15px; + -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); + box-shadow: inset 0 1px 0 rgba(0,0,0,0.1); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.theme-name { + background: #fff; + background: rgba(255,255,255,0.65); +} + +/* Activate and Customize buttons, shown on hover */ +.theme .theme-actions { + opacity: 0; + -webkit-transition: opacity 0.1s ease-in-out; + transition: opacity 0.1s ease-in-out; + position: absolute; + bottom: 0; + right: 0; + height: 38px; + padding: 9px 10px 0 10px; + background: rgba(244, 244, 244, 0.7); + border-left: 1px solid rgba(0,0,0,0.05); +} + +.theme:hover .theme-actions { + opacity: 1; +} + +.theme .theme-actions .button-primary { + margin-right: 3px; +} + +.theme .theme-actions .button-secondary { + float: none; + margin-left: 3px; +} + +/** + * Theme Screenshot + * + * Has a fixed aspect ratio of 1.5 to 1 regardless of screenshot size + * It is also responsive. + */ +.theme .theme-screenshot { + display: block; + overflow: hidden; + position: relative; + -webkit-transition: opacity 0.2s ease-in-out; + transition: opacity 0.2s ease-in-out; +} + +.theme .theme-screenshot:after { + content: ''; + display: block; + padding-top: 66%; /* using a 3/2 aspect ratio */ +} + +.theme .theme-screenshot img { + height: auto; + position: absolute; + left: 0; + top: 0; + width: 100%; + -webkit-transform: translateZ( 0 ); /* Prevents rendering bugs in Chrome */ + -webkit-transition: opacity 0.2s ease-in-out; + transition: opacity 0.2s ease-in-out; +} + +.theme:after { + display: block; + opacity: 0; + content: '\f348'; + -webkit-font-smoothing: antialiased; + font: normal 64px/1 'dashicons'; + vertical-align: middle; + text-align: center; + color: #000; + position: absolute; + top: 0; + left: 0; + right: 0; + padding-top: 24%; + text-shadow: 0 1px 20px rgba(255,255,255,0.9); + -webkit-transition: opacity 0.2s ease-in-out; + transition: opacity 0.2s ease-in-out; +} + +.theme:hover:after { + opacity: 0.6; +} + +.theme:hover .theme-screenshot { + background: #fff; +} + +.theme:hover .theme-screenshot img { + opacity: 0.4; +} + +/** + * Displays a theme update notice + * when an update is available. + */ +.theme .theme-update { + background: #d54e21; + background: rgba(213, 78, 33, 0.95); + color: #fff; + display: block; + font-size: 13px; + font-weight: 400; + height: 48px; + line-height: 48px; + padding: 0 10px; + position: absolute; + top: 0; + right: 0; + left: 0; + border-bottom: 1px solid rgba(0,0,0,0.25); + overflow: hidden; +} + +.theme .theme-update:before { + content: '\f113'; + display: inline-block; + font: normal 20px/1 'dashicons'; + margin: 0 6px 0 0; + opacity: 0.8; + position: relative; + top: 5px; + speak: none; + -webkit-font-smoothing: antialiased; +} + + +/** + * The currently active theme + */ +.theme.active { +} + +.theme.active .theme-screenshot { +} + +.theme.active .theme-name { + background: #0074a2; + color: #fff; + -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); + box-shadow: inset 0 1px 1px rgba(0,0,0,0.5); +} + +.theme.active .theme-actions { + top: 0; + left: 0; + background: #2f2f2f; + height: 48px; + opacity: 1; + line-height: 48px; + padding: 0 10px; + z-index: 1; +} + +.theme.active .theme-actions .button { + float: right; + margin-top: 10px; +} + +.theme.active .current-label { + font-size: 13px; + font-weight: 400; + color: #ccc; + margin-left: 5px; +} + +.theme.active .theme-update { + top: 48px; +} + +.theme .theme-author { + background: #222; + color: #eee; + display: none; + font-size: 14px; + margin: 0 10px; + padding: 5px 10px; + position: absolute; + bottom: 56px; +} + +.theme.display-author .theme-author { + display: block; +} + +.theme.display-author .theme-author a { + color: inherit; + text-decoration: none; +} + +/** + * Add new theme + */ +.theme-browser .add-new-theme { + border: none; + box-shadow: none; +} + +.theme-browser .add-new-theme a { + color: #999; + text-decoration: none; + display: block; + position: relative; + z-index: 1; +} + +.theme-browser .add-new-theme:after { + display: block; + content: ''; + opacity: 1; + background: rgba(0, 0, 0, 0); + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + padding: 10% 0 0 0; + text-shadow: none; + border: 5px dashed rgba(0, 0, 0, 0.1); + -webkit-transition: opacity 0.2s ease-in-out; + transition: opacity 0.2s ease-in-out; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +.theme-browser .add-new-theme span:after { + background: rgba(153, 153, 153, 0.1); + border-radius: 50%; + display: inline-block; + content: '\f132'; + -webkit-font-smoothing: antialiased; + font: normal 74px/115px 'dashicons'; + width: 100px; + height: 100px; + vertical-align: middle; + text-align: center; + color: rgb(153, 153, 153); + position: absolute; + top: 30%; + left: 50%; + margin-left: -50px; + text-indent: -4px; + padding: 0; + text-shadow: none; + z-index:4; +} + +.theme-browser .add-new-theme:hover .theme-screenshot { + background: none; +} + +.theme-browser .add-new-theme:hover span:after { + background: #fff; + color: #0074a2; +} + +.theme-browser .add-new-theme:hover:after { + border-color: transparent; + color: #fff; + background: #0074a2; +} + +.theme-browser .add-new-theme .theme-name { + background: none; + text-align: center; + box-shadow: none; + font-weight: 400; + position: relative; + top: -50px; +} + +.theme-browser .add-new-theme:hover .theme-name { + color: #fff; + z-index: 2; +} + +/* + * The search form + */ +.themes-php .theme-search { + position: relative; + top: -2px; + left: 20px; + font-size: 16px; + font-weight: 300; + line-height: 1.5; +} + +/** + * Theme Overlay + * Shown when clicking a theme + */ +.theme-overlay .theme-backdrop { + position: absolute; + left: -20px; + right: 0; + top: 0; + bottom: 0; + background: rgba( 238, 238, 238, 0.9 ); + z-index: 10; +} + +body.theme-overlay-open { + overflow: hidden; +} + +.theme-overlay .theme-utility { + position: absolute; + top: 0; + left: 0; + right: 0; + border-bottom: 1px solid #eee; +} + +.theme-overlay .back { + cursor: pointer; + height: 48px; + width: 50px; + text-align: center; + float: right; + border-left: 1px solid #eee; +} + +.theme-overlay .back:hover { + background: #333; +} + +.theme-overlay .back:hover:before { + color: #fff; +} + +.theme-overlay .back:before { + font: normal 30px/48px 'dashicons' !important; + color: #bbb; + display: inline-block; + content: '\f335'; + font-weight: 300; +} + +/* Left and right navigation */ +.theme-overlay .right, +.theme-overlay .left { + cursor: pointer; + height: 48px; + width: 54px; + float: left; + text-align: center; + border-right: 1px solid #eee; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.theme-overlay .right:hover, +.theme-overlay .left:hover { + background: #333; +} + +.theme-overlay .right:hover:before, +.theme-overlay .left:hover:before { + color: #fff; +} + +.theme-overlay .left:before { + content: '\f341'; +} + +.theme-overlay .right:before { + content: '\f345'; +} + +.theme-overlay .right:before, +.theme-overlay .left:before { + font: normal 16px/54px 'dashicons' !important; + display: inline; + font-weight: 300; +} + +.theme-overlay .theme-wrap { + clear: both; + position: fixed; + top: 120px; + left: 190px; + right: 40px; + bottom: 80px; + overflow: auto; + background: #fff; + padding: 88px 40px 110px 40px; + -webkit-box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1); + box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(0,0,0,0.1); + z-index: 20; +} + +.theme-overlay .theme-wrap:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} + +.theme-overlay .theme-actions { + position: fixed; + text-align: center; + bottom: 80px; + left: 190px; + right: 40px; + padding: 20px 25px; + background: rgba(243, 243, 243 ,0.9); + border-top: 1px solid rgba(0,0,0,0.1); + z-index: 30; +} + +.theme-overlay.active .theme-actions { +} + +.theme-overlay .theme-actions a { + margin-right: 5px; + margin-bottom: 0; + font-size: 16px; + line-height: 37px; + height: 37px; + padding: 0 20px 1px 20px; +} + +.theme-overlay .theme-actions .delete-theme { + border-radius: 2px; + color: #a00; + font-size: 14px; + padding: 0 10px; + position: absolute; + right: 10px; + bottom: 20px; + text-decoration: none; +} + +.theme-overlay .theme-actions .delete-theme:hover { + background: #d54e21; + color: #fff; +} + +.theme-overlay .theme-actions .active-theme, +.theme-overlay.active .theme-actions .inactive-theme { + display: none; +} + +.theme-overlay .theme-actions .inactive-theme, +.theme-overlay.active .theme-actions .active-theme { + display: block; +} + +/** + * Theme Screenshots gallery + */ +.theme-overlay .theme-screenshots { + float: left; + margin: 0 30px 0 0; + width: 55%; + text-align: center; +} + +/* First screenshot, shown big */ +.theme-overlay .screenshot { + border: 1px solid #fff; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + overflow: hidden; + position: relative; + -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.2); + box-shadow: 0 0 0 1px rgba(0,0,0,0.2); +} + +.theme-overlay .screenshot:after { + content: ''; + display: block; + padding-top: 66.66666%; /* using a 3/2 aspect ratio */ +} + +.theme-overlay .screenshot img { + cursor: pointer; + height: auto; + position: absolute; + left: 0; + top: 0; + width: 100%; +} + +/* Other screenshots, shown small and square */ +.theme-overlay .screenshot.thumb { + background: #ccc; + border: 1px solid #eee; + float: none; + display: inline-block; + margin: 10px 5px 0; + width: 140px; + height: 80px; +} + +.theme-overlay .screenshot.thumb:after { + content: ''; + display: block; + padding-top: 100%; /* using a 1/1 aspect ratio */ +} + +.theme-overlay .screenshot.thumb img { + cursor: pointer; + height: auto; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: auto; +} + +.theme-overlay .screenshot.selected { + background: transparent; + border: 2px solid #2ea2cc; +} + +.theme-overlay .screenshot.selected img { + opacity: 0.8; +} + +/* No screenshot placeholder */ +.theme .theme-screenshot.blank, +.theme-overlay .screenshot.blank { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=); +} + +/** + * Theme heading information + */ +.theme-overlay .theme-info { + width: 40%; + float: left; +} + +.theme-overlay .current-label { + background: #333; + color: #fff; + font-size: 11px; + display: inline-block; + padding: 2px 8px; + border-radius: 2px; + margin: 0 0 -10px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.theme-overlay .theme-name { + color: #222; + font-size: 32px; + font-weight: 100; + margin: 10px 0 0; + line-height: 1.3; +} + +.theme-overlay .theme-version { + color: #999; + font-size: 13px; + font-weight: 400; + float: none; + display: inline-block; + margin-left: 10px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.theme-overlay .theme-author { + color: #686868; + font-size: 16px; + font-weight: 400; + margin: 15px 0 25px; +} + +.theme-overlay .theme-author a { + color: inherit; + text-decoration: none; +} + +.theme-overlay .theme-description { + color: #555; + font-size: 15px; + font-weight: 400; + line-height: 1.5; + margin: 30px 0 0 0; +} + +.theme-overlay .theme-tags { + border-top: 3px solid #eee; + color: #888; + font-size: 13px; + font-weight: 400; + margin: 30px 0 0 0; + padding-top: 20px; + text-transform: capitalize; +} + +.theme-overlay .theme-tags span { + color: #444; + font-weight: bold; + margin-right: 5px; +} + +.theme-overlay .theme-actions { +} + +/* Theme Updates info */ +.theme-overlay .theme-update-message { + background: #fefaf7; + border: 1px solid #eee; + border-left: 4px solid #d54e21; + border-radius: 3px; + padding: 5px 20px 10px; +} + +.theme-overlay .theme-update { + color: #222; + font-size: 18px; + display: inline-block; + line-height: 40px; + margin: 0; +} + +.theme-overlay .parent-theme { + background: #f7fcfe; + border: 1px solid #eee; + border-left: 4px solid #2ea2cc; + font-size: 14px; + font-weight: normal; + margin-top: 30px; + padding: 10px 10px 10px 20px; +} + +.theme-overlay .parent-theme strong { + font-weight: 700; +} + +/** + * Basic Responsive structure... + * + * Shuffles theme columns around based on screen width + */ + +@media only screen and (min-width: 1700px) { + .theme { + width: 22.7%; + margin: 0 3% 3% 0; + } + + .theme:nth-child(3n) { + margin-right: 3%; + } + + .theme:nth-child(4n) { + margin-right: 0; + } + + .theme-overlay .theme-wrap, + .theme-overlay .theme-actions { + right: 15%; + left: 22%; + } +} + +@media only screen and (max-width: 1200px) { + .theme { + width: 47.5%; + margin-right: 0; + } + + .theme:nth-child(even) { + margin-right: 0; + } + + .theme:nth-child(odd) { + margin-right: 5%; + } +} + +/* Admin menu is folded */ +@media only screen and (max-width: 900px) { + .theme-overlay .theme-wrap, + .theme-overlay .theme-actions { + left: 76px; + } +} + +@media only screen and (max-width: 780px) { + .theme.active .theme-actions .button { + margin-top: 6px; + margin-right: -3px + } + + .theme-overlay .theme-wrap { + top: 45px; + right: 0; + bottom: 0; + left: 0; + padding: 70px 20px 100px; + } + + .theme-overlay .theme-actions { + right: 0; + bottom: 0; + left: 0; + text-align: left; + padding: 10px; + } + + .theme-overlay .theme-screenshots { + width: 40%; + } + + .theme-overlay .theme-info { + width: 50%; + } + + .theme-overlay .theme-actions .delete-theme { + bottom: 10px; + } +} + +@media only screen and (max-width: 650px) { + .theme { + width: 100%; + margin-right: 0; + } + + .theme:hover .theme-actions { + display: none; + } + + .theme:nth-child(2n), + .theme:nth-child(3n) { + margin-right: 0; + } + + .theme-overlay .theme-update, + .theme-overlay .theme-description { + margin-left: 0; + } + + .theme-overlay.active .theme-actions .active-theme .button:nth-child(3n) { + display: none; + } + + .theme.active .theme-actions .button { + margin-top: 6px; + margin-right: 0; + } + + .theme-overlay .theme-screenshots { + width: 100%; + float: none; + } + + .theme-overlay .theme-info { + width: 100%; + } + + .theme-overlay .theme-author { + margin: 5px 0 15px 0; + } + + .theme-overlay .theme-version { + margin-left: 0; + position: absolute; + top: 18px; + left: 130px; + } + + .theme-overlay .current-label { + margin-top: 10px; + font-size: 13px; + } + + .themes-php .wrap h2 { + width: 100%; + } + + .themes-php .theme-search { + float: none; + clear: both; + left: 0; + top: 0; + right: 0; + margin: 10px 0; + width: 100%; + } +} + .broken-themes { clear: both; } diff --git a/src/wp-admin/themes.php b/src/wp-admin/themes.php index f883d78da9..faf4bc04bc 100644 --- a/src/wp-admin/themes.php +++ b/src/wp-admin/themes.php @@ -104,7 +104,6 @@ wp_localize_script( 'theme', '_wpThemeSettings', array( ) ); add_thickbox(); -wp_enqueue_style( 'theme' ); wp_enqueue_script( 'theme' ); wp_enqueue_script( 'customize-loader' ); diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php index fff7366cdf..9ea2337091 100644 --- a/src/wp-includes/script-loader.php +++ b/src/wp-includes/script-loader.php @@ -594,7 +594,6 @@ function wp_default_styles( &$styles ) { // do not refer to these directly, the right one is queued by the above "meta" colors handle $styles->add( 'colors-fresh', "/wp-admin/css/colors-fresh$suffix.css", array( 'wp-admin', 'buttons' ) ); - $styles->add( 'theme', "/wp-admin/css/theme.css" ); $styles->add( 'media', "/wp-admin/css/media$suffix.css" ); $styles->add( 'install', "/wp-admin/css/install$suffix.css", array('buttons') ); $styles->add( 'thickbox', '/wp-includes/js/thickbox/thickbox.css', array( 'dashicons' ), '20121105' );