WordPress/wp-admin/css/about-rtl.css
Aaron Jorbin 50cb2c5e28 Update autoprefixer browser support matrix
WordPress no longer supports many old old browsers: https://make.wordpress.org/core/2017/04/23/target-browser-coverage/

This also removes alot of no longer necessary CSS. It served us well, but we are never getting back together with IE8,9,10.

So, in the (paraphrased) words of Taylor Swift:

I remember when we dropped support  the first time
Saying, "This is it, I've had enough, " 'cause like
We hadn't seen many users in a month
When you said you needed flexbox. (What?)
Then you postMessage again and say
"IE8, I miss you and I swear I'm gonna change, trust me."
Remember how that lasted for a day?
I say, "I hate the box model, " we break up, you call me, "I love css-grids."
Ooh, we called it off again last night
But ooh, this time I'm telling you, I'm telling you

We are never ever ever supporting IE 8,9,10,
We are never ever ever supporting IE 8,9,10,
You go talk to EDGE, talk to my FIREFOX, talk to CHROME
But we are never ever ever ever getting back together
Like, ever...

Fixes #37651.
Props stunnedbeast, netweb, jorbin.



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


git-svn-id: http://core.svn.wordpress.org/trunk@40912 1a063a9b-81f0-0310-95a4-ce76da25c4cd
2017-07-16 01:15:46 +00:00

489 lines
8.3 KiB
CSS

/*------------------------------------------------------------------------------
22.0 - About Pages
1.0 Global: About, Credits, Freedoms
1.1 Typography
1.2 Structure
1.3 Point Releases
2.0 About Page
2.1 Typography
2.2 Structure
3.0 Credits & Freedoms Pages
------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------
1.0 - Global: About, Credits, Freedoms
------------------------------------------------------------------------------*/
.about-wrap {
position: relative;
margin: 25px 20px 0 40px;
max-width: 1050px; /* readability */
font-size: 15px;
}
.about-wrap div.updated,
.about-wrap div.error,
.about-wrap .notice {
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%;
height: auto;
vertical-align: middle;
}
.about-wrap .jetpack-video-wrapper {
margin-bottom: 0;
}
/* WordPress Version Badge */
.wp-badge {
background: #0073aa url(../images/w-logo-white.png?ver=20160308) no-repeat;
background-position: center 25px;
background-size: 80px 80px;
color: #fff;
font-size: 14px;
text-align: center;
font-weight: 600;
margin: 5px 0 0;
padding-top: 120px;
height: 40px;
display: inline-block;
width: 140px;
text-rendering: optimizeLegibility;
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.svg .wp-badge {
background-image: url(../images/wordpress-logo-white.svg?ver=20160308);
}
.about-wrap .wp-badge {
position: absolute;
top: 0;
left: 0;
}
/* Tabs */
.about-wrap .nav-tab {
padding-left: 15px;
padding-right: 15px;
font-size: 18px;
}
/* 1.1 - Typography */
.about-wrap p {
line-height: 1.5;
font-size: 14px;
}
.about-wrap .feature-section p {
max-width: 55em;
margin-right: auto;
margin-left: auto;
}
.about-wrap h1 {
margin: 0.2em 0 0 200px;
padding: 0;
color: #32373c;
line-height: 1.2em;
font-size: 2.8em;
font-weight: 400;
}
.about-wrap h2 {
margin: 40px 0 .6em;
font-size: 2.7em;
line-height: 1.3;
font-weight: 300;
text-align: center;
}
.about-wrap h3 {
margin: 1.25em 0 .6em;
font-size: 1.4em;
line-height: 1.5;
}
.about-wrap h4 {
color: #23282d;
}
.about-wrap .changelog h2 {
font-size: 1.4em;
font-weight: 600;
text-align: right;
}
.about-wrap .changelog h3 {
margin: 1.33em 0;
font-size: 1em;
line-height: inherit;
color: #23282d;
}
.about-wrap code,
.about-wrap ol li p {
font-size: 14px;
font-weight: 400;
}
.about-wrap .about-description,
.about-wrap .about-text {
margin-top: 1.4em;
font-weight: 400;
line-height: 1.6em;
font-size: 19px;
}
.about-wrap .about-text {
margin: 1em 0 1em 200px;
min-height: 60px;
color: #555d66;
}
/* 1.2 - Structure */
.about-wrap [class$="-col"] {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
align-items: center;
flex-wrap: wrap;
}
.about-wrap .feature-section.one-col {
margin: 0 auto;
max-width: 700px;
}
.about-wrap [class$="-col"] .col {
-webkit-box-flex: 1;
flex: 1;
}
.about-wrap .two-col .col {
min-width: 47%;
max-width: 47%;
}
.about-wrap .three-col .col {
-webkit-align-self: flex-start;
align-self: flex-start;
min-width: 31%;
max-width: 31%;
}
.about-wrap .two-col img {
margin-bottom: 1.5em;
}
.about-wrap .feature-video .mejs-controls {
display: none !important;
}
.about-wrap .feature-video .mejs-overlay-loading span {
background: transparent; /* Hide loading.gif */
}
/* 1.3 - Point Releases */
.about-wrap .point-releases {
margin-top: 5px;
border-bottom: 1px solid #ddd;
}
.about-wrap .changelog.point-releases h3 {
padding-top: 35px;
}
.about-wrap .changelog.point-releases h3:first-child {
padding-top: 7px;
}
/*------------------------------------------------------------------------------
2.0 - About Page
------------------------------------------------------------------------------*/
/* 2.1 - Typography */
.about-wrap .feature-section.two-col h3 {
margin-top: 0;
}
.about-wrap .feature-section h4 {
margin: 1.4em 0 0.6em 0;
font-size: 1em;
}
.about-wrap .feature-section p {
margin-top: 0.6em;
}
.about-wrap .lead-description {
font-size: 1.5em;
text-align: center;
}
.about-wrap .two-col-text {
-webkit-column-count: 2;
column-count: 2;
-webkit-column-gap: 40px;
column-gap: 40px;
}
.about-wrap .two-col-text p:first-of-type {
margin-top: 0;
}
.about-wrap .streamlined-updates p,
.about-wrap .native-fonts p {
margin-bottom: 3em;
}
/* 2.2 - Structure */
.about-wrap .headline-feature.feature-video {
position: relative;
margin: 40px 0;
padding-bottom: 56.25%;
width: 100%;
max-width: 100%;
height: 0;
text-align: center;
}
.about-wrap .feature-video embed {
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
}
.about-wrap .featured-image {
text-align: center;
}
.about-wrap .feature-section {
overflow: hidden;
padding: 0 0 40px;
}
.about-wrap .feature-section.no-heading {
padding-top: 35px;
}
.about-wrap .feature-section .media-container {
overflow: hidden;
}
.about-wrap .feature-section img {
margin-bottom: 1em;
}
.about-wrap .embed-container {
text-align: center;
}
.about-wrap .embed-container iframe {
max-width: 100%;
}
.about-wrap .wp-embedded-content {
max-width: 100%;
}
.about-wrap .feature-section .col {
margin-top: 40px;
}
.about-wrap .changelog {
margin-bottom: 40px;
}
.about-wrap .changelog.feature-section .col {
margin-top: 40px;
}
/* Return to Dashboard Home link */
.about-wrap .return-to-dashboard {
margin: 30px -5px 0 0;
font-size: 14px;
font-weight: 600;
}
.about-wrap .return-to-dashboard a {
text-decoration: none;
padding: 0 5px;
}
/*------------------------------------------------------------------------------
3.0 - Credits & Freedoms Pages
------------------------------------------------------------------------------*/
/* Credits */
.about-wrap h3.wp-people-group {
margin: 2.6em 0 1.33em;
padding: 0;
font-size: 16px;
line-height: inherit;
}
.about-wrap .wp-people-group {
padding: 0 5px;
margin: 0 -5px 0 -15px;
}
.about-wrap .compact {
margin-bottom: 0
}
.about-wrap .wp-person {
display: inline-block;
vertical-align: top;
margin-left: 10px;
padding-bottom: 15px;
height: 70px;
width: 280px;
}
.about-wrap .compact .wp-person {
height: auto;
width: 180px;
padding-bottom: 0;
margin-bottom: 0;
}
.about-wrap .wp-person .gravatar {
float: right;
margin: 0 0 10px 10px;
padding: 1px;
width: 60px;
height: 60px;
}
.about-wrap .compact .wp-person .gravatar {
width: 30px;
height: 30px;
}
.about-wrap .wp-person .web {
margin: 6px 0 2px;
font-size: 16px;
font-weight: 400;
line-height: 2em;
text-decoration: none;
}
.about-wrap .wp-person .title {
display: block;
}
.about-wrap #wp-people-group-validators + p.wp-credits-list {
margin-top: 0;
}
.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: 600;
}
.freedoms-php .about-wrap ol p {
font-weight: 400;
margin: 0.6em 0;
}
/*------------------------------------------------------------------------------
4.0 - Media Queries
------------------------------------------------------------------------------*/
@media screen and ( max-width: 782px ) {
.about-wrap .two-col-text {
-webkit-column-count: 1;
column-count: 1;
}
.about-wrap .two-col .col,
.about-wrap .three-col .col {
min-width: 48% !important;
}
.about-wrap .three-col img {
display: block;
margin: 0 auto;
}
}
@media only screen and (max-width: 500px) {
.about-wrap {
margin-left: 20px;
margin-right: 10px;
}
.about-wrap h1,
.about-wrap .about-text {
margin-left: 0;
}
.about-wrap .about-text {
margin-bottom: 0.25em;
}
.about-wrap .wp-badge {
position: relative;
margin-bottom: 1.5em;
width: 100%;
}
.about-wrap .two-col .col,
.about-wrap .three-col .col {
min-width: 100% !important;
}
.about-wrap .under-the-hood.three-col .col,
.about-wrap .under-the-hood.two-col .col,
.about-wrap .under-the-hood.one-col .col {
margin-bottom: 2em;
padding-bottom: 0;
}
.about-wrap .under-the-hood:nth-of-type(2n),
.about-wrap .under-the-hood:nth-of-type(3n) {
margin-top: 0;
}
.about-wrap .under-the-hood:nth-of-type(2n) h3,
.about-wrap .under-the-hood:nth-of-type(3n) h3 {
margin-top: 0;
}
}