vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-08-13 05:10:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Improvements to the plugin information modal:

Browse Source 
* Whitespace/braces cleanup for [29040].
* Reduce width of modal to 792px, which is the default banner size.
* Reduce banner height when screen height is smaller than 500px.
* Remove inline CSS.
* Re-use tab var in JS.
* Encode ampersands in links.

props avryl, michalzuber, ocean90.
see #27440.


git-svn-id: https://develop.svn.wordpress.org/trunk@29125 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Dominik Schilling (ocean90)
2014-07-12 22:07:16 +00:00
parent c7f2a54dc8
commit 1285d1450b
3 changed files with 161 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/wp-admin/css/common.css
+47 -44
View File
@@ -1835,13 +1835,6 @@ div.action-links {
background-size: 100% auto;
}
@media only screen and (max-width: 800px) {
#plugin-information-title.with-banner {
height: 100px;
bottom: 100px;
}
}
#plugin-information-title h2 {
font-family: "Helvetica Neue", sans-serif;
padding:0;
@@ -1868,14 +1861,6 @@ div.action-links {
border-radius: 8px;
}
@media only screen and (max-width: 800px) {
#plugin-information-title.with-banner h2 {
top: 12px;
font-size: 20px;
line-height: 40px;
}
}
#plugin-information-title div.vignette {
display: none;
}
@@ -1891,14 +1876,6 @@ div.action-links {
box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
}
@media only screen and (max-width: 800px) {
#plugin-information-title.with-banner div.vignette {
height: 65px;
bottom: 65px;
width: 800%;
}
}
#plugin-information-tabs {
padding: 0 16px;
position: absolute;
@@ -1910,20 +1887,14 @@ div.action-links {
}
#plugin-information-tabs.with-banner {
top: 215px;
top: 214px;
background: rgba( 255, 255, 255, 0.85 );
}
@media only screen and (max-width: 800px) {
#plugin-information-tabs.with-banner {
top: 65px;
}
}
#plugin-information-tabs a {
position: relative;
float: left;
padding: 8px 10px 9px;
padding: 9px 10px;
margin: 0;
height: 18px;
line-height: 18px;
@@ -1934,13 +1905,19 @@ div.action-links {
}
#plugin-information-tabs a.current {
margin: -1px -1px 0;
margin: 0 -1px 0;
background: #fff;
border: 1px solid #ddd;
border-bottom: none;
padding-top: 8px;
color: #333;
}
#plugin-information-tabs.with-banner a.current {
border-top: none;
padding-top: 9px;
}
#plugin-information-tabs a:active,
#plugin-information-tabs a:focus {
outline: none;
@@ -1951,20 +1928,16 @@ div.action-links {
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
position: absolute;
top: 90px;
top: 91px;
right: 0;
bottom: 58px;
left: 0;
overflow: auto;
}
#plugin-information-content.with-banner {
top:249px;
}
@media only screen and (max-width: 800px) {
#plugin-information-content.with-banner {
top:99px;
}
border-top: none;
top: 250px;
}
#section-holder {
@@ -2024,6 +1997,10 @@ div.action-links {
margin: 0 0 10px;
}
#plugin-information .counter-container {
margin: 3px 0;
}
#plugin-information .counter-label {
float: left;
margin-right: 5px;
@@ -2118,10 +2095,36 @@ div.action-links {
font-size: 13px;
}
@media screen and ( max-width: 782px ) {
#plugin-information-content {
overflow: auto;
bottom: 58px;
@media screen and ( max-width: 771px ), screen and ( max-height: 500px ) {
#plugin-information-title.with-banner {
height: 100px;
bottom: 100px;
}
#plugin-information-title.with-banner h2 {
top: 12px;
font-size: 20px;
line-height: 40px;
}
#plugin-information-title.with-banner div.vignette {
height: 65px;
bottom: 65px;
width: 800%;
}
#plugin-information-tabs.with-banner {
top: 63px;
}
#plugin-information-content.with-banner {
top: 99px;
}
}
@media screen and ( max-width: 771px ) {
#plugin-information-tabs {
padding: 0;
}
#plugin-information .fyi {