WordPress/wp-admin/css/about.css
Helen Hou-Sandí 08d45e5006 About page, at last.
All strings are available for translation. We anticipate few, if any, changes before release. Images and video will be moved to w.org soon.

props ryelle, melchoyce, nacin, MarkJaquith, helen, DrewAPicture, kpdesign.
fixes #29243.

Built from https://develop.svn.wordpress.org/trunk@29643


git-svn-id: http://core.svn.wordpress.org/trunk@29417 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2014-08-27 04:40:15 +00:00

386 lines
6.4 KiB
CSS

/*------------------------------------------------------------------------------
22.0 - About Pages
------------------------------------------------------------------------------*/
.about-wrap {
position: relative;
margin: 25px 40px 0 20px;
max-width: 1050px; /* readability */
font-size: 15px;
}
.about-wrap div.updated,
.about-wrap div.error {
display: none !important;
}
.about-wrap hr {
border: 0;
height: 0;
margin: 0;
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.about-wrap img {
margin: 0;
max-width: 100%;
vertical-align: middle;
}
/* Typography */
.about-wrap p {
line-height: 1.6em;
font-size: 14px;
}
.about-wrap h1 {
margin: 0.2em 200px 0 0;
color: #333;
line-height: 1.2em;
font-size: 2.8em;
font-weight: 400;
}
.about-wrap h4 {
color: #222;
}
.about-wrap .about-text,
.about-wrap p.about-description,
.about-wrap li.wp-person a.web {
font-weight: normal;
line-height: 1.6em;
font-size: 19px;
}
.about-description {
margin-top: 1.4em;
}
.about-text {
margin: 1em 200px 1em 0;
min-height: 60px;
color: #777;
font-size: 24px;
}
.about-wrap .changelog h2.about-headline-callout {
margin: 1.1em 0 0.2em;
font-size: 2.4em;
font-weight: 300;
line-height: 1.3;
text-align: center;
}
.about-wrap h3 {
margin: 1em 0 .6em;
font-size: 1.5em;
line-height: 1.5em;
}
.customize h3 {
margin-top: 1.75em;
text-align: center;
}
.about-wrap .feature-section h4 {
margin: 1.4em 0 0.6em 0;
font-size: 1.2em;
}
.about-wrap .feature-section p {
margin-top: 0.6em;
}
.about-wrap code,
.about-wrap ol li p {
font-size: 14px;
}
.about-wrap .button.button-large {
padding: 8px 20px 10px !important;
height: 46px !important;
font-size: 14px;
line-height: 28px !important;
}
/* 3.8 Images */
.about-wrap .about-overview-img {
margin: 0;
}
/* Point Releases */
.about-wrap .point-releases {
margin-top: 5px;
border-bottom: 1px solid #dfdfdf;
}
.about-wrap .changelog.point-releases h3 {
padding-top: 35px;
}
.about-wrap .changelog.point-releases h3:first-child {
padding-top: 7px;
}
/* WordPress Version Badge */
.wp-badge {
background: #0074a2 url(../images/w-logo-white.png?ver=20131202) no-repeat;
background: #0074a2, url(../images/wordpress-logo-white.svg?ver=20131110) no-repeat; /* multiple backgrounds are ignored by browsers that don't support SVGs */
background-position: center 24px;
-webkit-background-size: 85px 85px;
background-size: 85px 85px;
color: #78c8e6;
font-size: 14px;
text-align: center;
font-weight: 600;
margin: 5px 0 0;
padding-top: 120px;
height: 40px;
display: inline-block;
width: 150px;
text-rendering: optimizeLegibility;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.about-wrap .wp-badge {
position: absolute;
top: 0;
right: 0;
}
/* Tabs */
.about-wrap h2.nav-tab-wrapper {
padding-left: 6px;
}
.about-wrap h2 .nav-tab {
padding: 4px 15px 6px;
margin: 0 3px -1px 0;
font-size: 18px;
vertical-align: top;
border-width: 1px;
}
/* Changelog / Update screen */
.about-overview {
margin-top: 40px;
text-align: center;
}
.about-overview p {
margin: 1em auto 50px;
max-width: 770px;
font-size: 18px;
line-height: 1.5;
text-align: center;
}
.about-wrap .feature-section {
margin-top: 40px;
padding-bottom: 20px;
}
.about-wrap .feature-section.two-col > div {
position: relative;
width: 47.5%;
margin-right: 4.999999999%;
float: left;
}
.about-wrap .feature-section.three-col > div {
position: relative;
width: 29.95%;
margin-right: 4.999999999%;
float: left;
}
.about-wrap .feature-section.col .last-feature {
margin-right: 0;
}
.about-wrap .under-the-hood .feature-section {
margin-top: 0;
}
.about-wrap .changelog .feature-section {
overflow: hidden;
}
.about-wrap .feature-section.two-col div p {
margin-right: 3%;
}
.about-wrap .feature-section div p img {
float: right;
margin-left: 10px;
max-width: 20%;
}
.about-wrap .changelog li {
list-style-type: disc;
margin-left: 3em;
}
/* Return to Dashboard Home link */
.about-wrap .return-to-dashboard {
margin: 30px 0 0 -5px;
font-size: 14px;
font-weight: bold;
}
.about-wrap .return-to-dashboard a {
text-decoration: none;
padding: 0 5px;
}
/* Credits */
.about-wrap h4.wp-people-group {
margin-top: 2.6em;
font-size: 16px;
}
.about-wrap ul.wp-people-group {
overflow: hidden;
padding: 0 5px;
margin: 0 -15px 0 -5px;
}
.about-wrap ul.compact {
margin-bottom: 0
}
.about-wrap li.wp-person {
float: left;
margin-right: 10px;
}
.about-wrap li.wp-person img.gravatar {
float: left;
margin: 0 10px 10px 0;
padding: 2px;
width: 60px;
height: 60px;
}
.about-wrap ul.compact li.wp-person img.gravatar {
width: 30px;
height: 30px;
}
/* @todo: combine this */
.about-wrap li.wp-person {
height: 70px;
width: 280px;
padding-bottom: 15px;
}
.about-wrap ul.compact li.wp-person {
height: auto;
width: 180px;
padding-bottom: 0;
margin-bottom: 0;
}
.about-wrap #wp-people-group-validators + p.wp-credits-list {
margin-top: 0;
}
.about-wrap li.wp-person a.web {
display: block;
margin: 6px 0 2px;
font-size: 16px;
text-decoration: none;
}
.about-wrap p.wp-credits-list a {
white-space: nowrap;
}
/* Freedoms */
.freedoms-php .about-wrap ol {
margin: 40px 60px;
}
.freedoms-php .about-wrap ol li {
list-style-type: decimal;
font-weight: bold;
}
.freedoms-php .about-wrap ol p {
font-weight: normal;
margin: 0.6em 0;
}
/* =Media Queries
-------------------------------------------------------------- */
@media screen and ( max-width: 782px ) {
.about-wrap .feature-section.one-col > div,
.about-wrap .feature-section.two-col > div,
.about-wrap .feature-section.three-col > div {
width: 100%;
margin: 0 0 40px;
padding: 0 0 40px;
float: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.about-wrap .under-the-hood .feature-section > div,
.about-wrap .feature-section.col > div.last-feature {
margin: 0;
padding: 0;
border-bottom: none;
}
}
@media only screen and (max-width: 500px) {
.about-wrap {
margin-right: 20px;
margin-left: 10px;
}
.about-wrap h1,
.about-text {
margin-right: 0;
}
.about-text {
margin-bottom: 0.25em;
}
.about-wrap .wp-badge {
position: relative;
margin-bottom: 1.5em;
width: 100%;
}
.about-wrap .feature-section.three-col div {
width: 100%;
float: none;
}
.about-wrap .three-col.about-updates .col-1 {
padding: 0;
float: none;
}
.about-wrap .three-col.about-updates .col-2 {
margin: 0 0 20px;
width: 100%;
float: none;
}
}