vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-07-04 17:20:07 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

First pass of the 4.4 about page. Adds strings (not yet translatable) and screen shots (not CDN).

Browse Source 
Props wonderboymusic, markjaquith, helen, nacin, liljimmi, mordauk, melchoyce, ryelle, ocean90, DrewAPicture
See #34663.


git-svn-id: https://develop.svn.wordpress.org/trunk@35763 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Drew Jaynes
2015-12-04 12:23:24 +00:00
parent 12b1cc4410
commit 1035906de6
3 changed files with 206 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/wp-admin/css/about.css
View File

@@ -178,12 +178,12 @@
font-size: 2.2em;
font-weight: 300;
line-height: 1.3;
text-align: left;
text-align: center;
}
.about-wrap .headline-feature h3 {
margin-top: 30px;
text-align: center;
margin-top: 0;
text-align: left;
}
.about-wrap .feature-list h2 {
@@ -200,6 +200,19 @@
margin-top: 0.6em;
}
.about-wrap .two-col-text {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 40px;
-moz-column-gap: 40px;
column-gap: 40px;
}
.about-wrap .two-col-text p:first-of-type {
margin-top: 0;
}
/* 2.2 - Structure */
.about-wrap .feature-video {
@@ -226,27 +239,50 @@
.about-wrap .feature-section {
overflow: hidden;
padding: 0 0 40px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.about-wrap .headline-feature .feature-section {
.about-wrap .headline-feature {
margin: 0 auto;
max-width: 95%;
max-width: 80%;
}
.about-wrap .feature-section .media-container {
border: 1px solid #ddd;
overflow: hidden;
}
.about-wrap .feature-section .svg-container {
padding: 50px 0;
text-align: center;
background-color: #e1e1e3;
.about-wrap .headline-feature .col {
width: 65.2%;
}
.about-wrap .feature-section .svg-container img {
max-width: 150px;
.about-wrap .headline-feature .col.feature-image {
width: 30%;
}
.about-wrap .headline-feature .vertical-screen {
float: right;
margin-left: 40px;
max-width: 100%;
}
.about-wrap .headline-feature .horizontal-screen {
margin-top: 20px;
max-width: 100%;
}
.about-wrap .embed-container {
text-align: center;
}
.about-wrap .embed-cloudup iframe {
height: 299px;
}
.about-wrap .embed-container iframe {
max-width: 100%;
}
.about-wrap .wp-embedded-content {
max-width: 100%;
}
.about-wrap .feature-section:not(.under-the-hood) .col {
@@ -378,7 +414,47 @@
width: 100%;
margin: 40px 0 0;
padding: 0 0 40px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.about-wrap .headline-feature {
position: relative;
}
.about-wrap .headline-feature .col.feature-image {
position: absolute;
bottom: 0;
right: 0;
width: 40%;
}
.about-wrap .headline-feature .horizontal-image {
position: relative;
}
.about-wrap .headline-feature .horizontal-image:before {
display: block;
content: "";
width: 100%;
padding-top: 80%;
}
.about-wrap .headline-feature .horizontal-image > .content {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.about-wrap .headline-feature .horizontal-image img {
position: absolute;
bottom: 0;
}
.about-wrap .two-col-text {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
}
.about-wrap .three-col img {
@@ -422,11 +498,6 @@
width: 100%;
}
.about-wrap .feature-section .svg-container {
padding-top: 20px;
padding-bottom: 20px;
}
.about-wrap .three-col .col,
.about-wrap .headline-feature .feature-section .col {
width: 100% !important;

13
src/wp-admin/css/common.css
View File

@@ -2720,6 +2720,7 @@ div.action-links {
}
/* Thickbox for Plugin Install screen */
body.about-php #TB_window,
body.plugin-install-php #TB_window,
body.import-php #TB_window,
body.plugins-php #TB_window,
@@ -2729,6 +2730,7 @@ body.index-php #TB_window {
}
/* IE 8 needs a change in the pseudo element content */
.ie8 body.about-php #TB_window:before,
.ie8 body.plugin-install-php #TB_window:before,
.ie8 body.import-php #TB_window:before,
.ie8 body.plugins-php #TB_window:before,
@@ -2738,6 +2740,7 @@ body.index-php #TB_window {
background: none;
}
body.about-php #TB_window.thickbox-loading:before,
body.plugin-install-php #TB_window.thickbox-loading:before,
body.import-php #TB_window.thickbox-loading:before,
body.plugins-php #TB_window.thickbox-loading:before,
@@ -2763,6 +2766,7 @@ body.index-php #TB_window.thickbox-loading:before {
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
body.about-php #TB_window.thickbox-loading:before,
body.plugin-install-php #TB_window.thickbox-loading:before,
body.import-php #TB_window.thickbox-loading:before,
body.plugins-php #TB_window.thickbox-loading:before,
@@ -2772,6 +2776,7 @@ body.index-php #TB_window.thickbox-loading:before {
}
}
body.about-php #TB_title,
body.plugin-install-php #TB_title,
body.import-php #TB_title,
body.plugins-php #TB_title,
@@ -2781,6 +2786,7 @@ body.index-php #TB_title {
height: 1px;
}
body.about-php #TB_ajaxWindowTitle,
body.plugin-install-php #TB_ajaxWindowTitle,
body.import-php #TB_ajaxWindowTitle,
body.plugins-php #TB_ajaxWindowTitle,
@@ -2789,6 +2795,7 @@ body.index-php #TB_ajaxWindowTitle {
display: none;
}
body.about-php .tb-close-icon,
body.plugin-install-php .tb-close-icon,
body.import-php .tb-close-icon,
body.plugins-php .tb-close-icon,
@@ -2801,6 +2808,10 @@ body.index-php .tb-close-icon {
transition: color .1s ease-in-out, background .1s ease-in-out;
}
body.about-php #TB_closeWindowButton:focus,
body.about-php #TB_closeWindowButton:focus .tb-close-icon,
body.about-php .tb-close-icon:focus,
body.about-php .tb-close-icon:hover,
body.plugin-install-php #TB_closeWindowButton:focus,
body.plugin-install-php #TB_closeWindowButton:focus .tb-close-icon,
body.plugin-install-php .tb-close-icon:focus,
@@ -2827,6 +2838,7 @@ body.index-php .tb-close-icon:hover {
box-shadow: none;
}
body.about-php .tb-close-icon:before,
body.plugin-install-php .tb-close-icon:before,
body.import-php .tb-close-icon:before,
body.plugins-php .tb-close-icon:before,
@@ -2838,6 +2850,7 @@ body.index-php .tb-close-icon:before {
/* move plugin install close icon to top on narrow screens */
@media screen and ( max-width: 830px ) {
body.about-php .tb-close-icon,
body.plugin-install-php .tb-close-icon,
body.import-php .tb-close-icon,
body.plugins-php .tb-close-icon,