mirror of
https://github.com/WordPress/WordPress.git
synced 2024-11-17 08:05:21 +01:00
2878ae6271
Non-wrapping `label`s are more widely supported by assitive technologies. The CSS changes account for the element re-ordering, and tweak the formatting for improved readability. Props afercia, xkon, laurelfulford, azaozz. Merges [43125] to the 4.9 branch. Fixes #43436. Built from https://develop.svn.wordpress.org/branches/4.9@43130 git-svn-id: http://core.svn.wordpress.org/branches/4.9@42959 1a063a9b-81f0-0310-95a4-ce76da25c4cd
849 lines
12 KiB
CSS
849 lines
12 KiB
CSS
/*
|
|
Theme Name: Twenty Fifteen
|
|
Description: Adds support for languages written in a Right To Left (RTL) direction.
|
|
It's easy, just a matter of overwriting all the horizontal positioning attributes
|
|
of your CSS stylesheet in a separate stylesheet file named rtl.css.
|
|
|
|
See: https://codex.wordpress.org/Right_to_Left_Language_Support
|
|
*/
|
|
|
|
/**
|
|
* Table of Contents:
|
|
*
|
|
* 1.0 - Reset
|
|
* 2.0 - Typography
|
|
* 3.0 - Elements
|
|
* 4.0 - Forms
|
|
* 5.0 - Navigations
|
|
* 6.0 - Accessibility
|
|
* 7.0 - Alignments
|
|
* 8.0 - Header
|
|
* 9.0 - Widgets
|
|
* 10.0 - Content
|
|
* 10.1 - Posts and pages
|
|
* 10.2 - Comments
|
|
* 11.0 - Media Queries
|
|
* 11.1 - Mobile Large
|
|
* 11.2 - Tablet Small
|
|
* 11.3 - Tablet Large
|
|
* 11.4 - Desktop Small
|
|
* 11.5 - Desktop Medium
|
|
* 11.6 - Desktop Large
|
|
* 11.7 - Desktop X-Large
|
|
*/
|
|
|
|
|
|
/**
|
|
* 1.0 Reset
|
|
*/
|
|
|
|
body {
|
|
direction: rtl;
|
|
unicode-bidi: embed;
|
|
}
|
|
|
|
caption,
|
|
th,
|
|
td {
|
|
text-align: right;
|
|
}
|
|
|
|
|
|
/**
|
|
* 2.0 Typography
|
|
*/
|
|
|
|
body,
|
|
button,
|
|
input[type="button"],
|
|
input[type="reset"],
|
|
input[type="submit"],
|
|
input,
|
|
select,
|
|
textarea,
|
|
blockquote cite,
|
|
blockquote small,
|
|
.post-password-form label,
|
|
.main-navigation .menu-item-description,
|
|
.post-navigation .meta-nav,
|
|
.post-navigation .post-title,
|
|
.pagination,
|
|
.image-navigation,
|
|
.comment-navigation,
|
|
.site-title,
|
|
.site-description,
|
|
.widget-title,
|
|
.widget_calendar caption,
|
|
.widget_rss .rss-date,
|
|
.widget_rss cite,
|
|
.author-heading,
|
|
.entry-footer,
|
|
.page-title,
|
|
.page-links,
|
|
.entry-caption,
|
|
.comments-title,
|
|
.comment-reply-title,
|
|
.comment-metadata,
|
|
.pingback .edit-link,
|
|
.comment-list .reply a,
|
|
.comment-form label,
|
|
.comment-notes,
|
|
.comment-awaiting-moderation,
|
|
.logged-in-as,
|
|
.form-allowed-tags,
|
|
.no-comments,
|
|
.wp-caption-text,
|
|
.gallery-caption {
|
|
font-family: Arial, Tahoma, sans-serif;
|
|
}
|
|
|
|
::-webkit-input-placeholder {
|
|
font-family: Arial, Tahoma, sans-serif;
|
|
}
|
|
|
|
:-moz-placeholder {
|
|
font-family: Arial, Tahoma, sans-serif;
|
|
}
|
|
|
|
::-moz-placeholder {
|
|
font-family: Arial, Tahoma, sans-serif;
|
|
}
|
|
|
|
:-ms-input-placeholder {
|
|
font-family: Arial, Tahoma, sans-serif;
|
|
}
|
|
|
|
blockquote {
|
|
border-right: 4px solid rgba(51, 51, 51, 0.7);
|
|
border-left: 0;
|
|
padding-right: 0.7778em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
|
|
/**
|
|
* 3.0 Elements
|
|
*/
|
|
|
|
ul,
|
|
ol {
|
|
margin: 0 1.3333em 1.6em 0;
|
|
}
|
|
|
|
caption,
|
|
th,
|
|
td {
|
|
text-align: right;
|
|
}
|
|
|
|
|
|
/**
|
|
* 4.0 Forms
|
|
*/
|
|
|
|
.post-password-form input[type="submit"] {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
|
|
|
|
/**
|
|
* 5.0 Navigations
|
|
*/
|
|
|
|
.main-navigation ul ul {
|
|
margin-right: 0.8em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.main-navigation .menu-item-has-children > a {
|
|
padding-right: 0;
|
|
padding-left: 48px;
|
|
}
|
|
|
|
.dropdown-toggle {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
|
|
.dropdown-toggle:after {
|
|
right: -1px;
|
|
left: auto;
|
|
}
|
|
|
|
.social-navigation li {
|
|
float: right;
|
|
}
|
|
|
|
.social-navigation a:before {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.secondary-toggle {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
|
|
.post-navigation .has-post-thumbnail a:before {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.pagination .prev {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.pagination .prev:before {
|
|
content: "\f429";
|
|
right: -1px;
|
|
left: auto;
|
|
}
|
|
|
|
.pagination .next {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
|
|
.pagination .next:before {
|
|
content: "\f430";
|
|
right: auto;
|
|
left: -1px;
|
|
}
|
|
|
|
.image-navigation .nav-previous a:before,
|
|
.comment-navigation .nav-previous a:before {
|
|
content: "\f429";
|
|
margin-right: auto;
|
|
margin-left: 0.2em;
|
|
}
|
|
|
|
.image-navigation .nav-next a:after,
|
|
.comment-navigation .nav-next a:after {
|
|
content: "\f430";
|
|
margin-right: 0.2em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.0 Accessibility
|
|
*/
|
|
|
|
.screen-reader-text:hover,
|
|
.screen-reader-text:focus {
|
|
right: 5px;
|
|
left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 7.0 Alignments
|
|
*/
|
|
|
|
.alignright {
|
|
float: right;
|
|
}
|
|
|
|
.alignleft {
|
|
float: left;
|
|
}
|
|
|
|
.aligncenter {
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4em 0 1.6em 1.6em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4em 1.6em 1.6em 0;
|
|
}
|
|
|
|
|
|
/**
|
|
* 8.0 Header
|
|
*/
|
|
|
|
.site-branding {
|
|
padding-right: 0;
|
|
padding-left: 60px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 9.0 Widgets
|
|
*/
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.7667em 0.8em 0 0;
|
|
}
|
|
|
|
.textwidget ul,
|
|
.textwidget ol {
|
|
margin-left: 0;
|
|
margin-right: 1.6em;
|
|
}
|
|
|
|
/**
|
|
* 10.0 Content
|
|
*/
|
|
|
|
/**
|
|
* 10.1 Posts and pages
|
|
*/
|
|
|
|
.entry-content .more-link:after {
|
|
content: "\f430";
|
|
}
|
|
|
|
.author-link:after {
|
|
content: "\f430";
|
|
}
|
|
|
|
.author-info .avatar {
|
|
float: right;
|
|
margin: 0 0 1.6em 1.6em;
|
|
}
|
|
|
|
.posted-on:before,
|
|
.byline:before,
|
|
.cat-links:before,
|
|
.tags-links:before,
|
|
.comments-link:before,
|
|
.entry-format:before,
|
|
.edit-link:before,
|
|
.full-size-link:before {
|
|
margin-right: auto;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.posted-on,
|
|
.byline,
|
|
.cat-links,
|
|
.tags-links,
|
|
.comments-link,
|
|
.entry-format,
|
|
.full-size-link {
|
|
margin-right: auto;
|
|
margin-left: 1em;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.3333em 0.3333em;
|
|
}
|
|
|
|
.page-links > .page-links-title {
|
|
padding-right: 0;
|
|
padding-left: 0.5em;
|
|
}
|
|
|
|
.type-attachment .entry-header {
|
|
clear: left;
|
|
}
|
|
|
|
.format-link .entry-title a:after {
|
|
-webkit-transform: scaleX(-1);
|
|
-moz-transform: scaleX(-1);
|
|
-ms-transform: scaleX(-1);
|
|
-o-transform: scaleX(-1);
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
|
|
/**
|
|
* 10.2 Comments
|
|
*/
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 0.8em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
float: right;
|
|
margin-right: 0;
|
|
margin-left: 0.4em;
|
|
}
|
|
|
|
.bypostauthor > article .fn:after {
|
|
right: 3px;
|
|
left: auto;
|
|
}
|
|
|
|
.comment-metadata .edit-link {
|
|
margin-right: 1em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.pingback .edit-link {
|
|
margin-right: 1em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.comment-content ul,
|
|
.comment-content ol {
|
|
margin: 0 1.3333em 1.6em 0;
|
|
}
|
|
|
|
.comment-reply-title small a {
|
|
float: left;
|
|
}
|
|
|
|
.comment-form #wp-comment-cookies-consent {
|
|
margin: 0 0 0 10px;
|
|
}
|
|
|
|
/**
|
|
* 11.0 Media Queries
|
|
*/
|
|
|
|
|
|
/**
|
|
* 11.1 Mobile Large 620px
|
|
*/
|
|
|
|
@media screen and (min-width: 38.75em) {
|
|
ul,
|
|
ol {
|
|
margin-right: 0;
|
|
margin-left: auto;
|
|
}
|
|
|
|
li > ul,
|
|
li > ol,
|
|
blockquote > ul,
|
|
blockquote > ol {
|
|
margin-right: 1.3333em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
blockquote {
|
|
margin-right: -1em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
blockquote > blockquote {
|
|
margin-right: 0;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.page-header {
|
|
border-color: inherit;
|
|
border-left: none;
|
|
border-style: solid;
|
|
border-width: 0 7px 0 0;
|
|
}
|
|
|
|
.page-title,
|
|
.taxonomy-description {
|
|
margin-right: -7px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.comment-content ul,
|
|
.comment-content ol {
|
|
margin-right: 0;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.comment-content li > ul,
|
|
.comment-content li > ol,
|
|
.comment-content blockquote > ul,
|
|
.comment-content blockquote > ol {
|
|
margin-right: 1.3333em;
|
|
margin-left: auto;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.2 Tablet Small 740px
|
|
*/
|
|
|
|
@media screen and (min-width: 46.25em) {
|
|
blockquote {
|
|
margin-right: -1.05em;
|
|
margin-left: auto;
|
|
padding-right: 0.85em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.main-navigation ul ul {
|
|
margin-right: 1em;
|
|
margin-left: auto;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4118em 0 1.6471em 1.6471em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4118em 1.6471em 1.6471em 0;
|
|
}
|
|
|
|
.site-branding {
|
|
padding-right: 0;
|
|
padding-left: 66px;
|
|
}
|
|
|
|
.widget blockquote {
|
|
margin-right: -1.2353em;
|
|
margin-left: auto;
|
|
padding-right: 1em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget blockquote > blockquote {
|
|
margin-right: 0;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.widget blockquote.alignright,
|
|
.widget .wp-caption.alignright,
|
|
.widget img.alignright {
|
|
margin: 0.5em 0 1.5em 1.5em;
|
|
}
|
|
|
|
.widget blockquote.alignleft,
|
|
.widget .wp-caption.alignleft,
|
|
.widget img.alignleft {
|
|
margin: 0.5em 1.5em 1.5em 0;
|
|
}
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.9643em 1em 0 0;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.2857em 0.2857em;
|
|
}
|
|
|
|
.author-info .avatar {
|
|
margin: 0 0 1.6471em 1.6471em;
|
|
}
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 1.2353em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
margin-left: 1.64705em;
|
|
}
|
|
|
|
.bypostauthor > article .fn:after {
|
|
right: 6px;
|
|
left: auto;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.3 Tablet Large 880px
|
|
*/
|
|
|
|
@media screen and (min-width: 55em) {
|
|
blockquote {
|
|
margin-right: -1.0909em;
|
|
margin-left: auto;
|
|
padding-right: 0.9091em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4211em 0 1.6842em 1.6842em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4211em 1.6842em 1.6842em 0;
|
|
}
|
|
|
|
.site-branding {
|
|
padding-right: 0;
|
|
padding-left: 74px;
|
|
}
|
|
|
|
.widget blockquote {
|
|
margin-right: -1.2632em;
|
|
margin-left: auto;
|
|
padding-right: 1.0526em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.7188em 1em 0 0;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.25em 0.25em;
|
|
}
|
|
|
|
.author-info .avatar {
|
|
margin: 0 0 1.6842em 1.6842em;
|
|
}
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 1.4737em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
margin-left: 1.6842em;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.4 Desktop Small 955px
|
|
*/
|
|
|
|
@media screen and (min-width: 59.6875em) {
|
|
body:before {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.sidebar {
|
|
float: right;
|
|
margin-right: auto;
|
|
margin-left: -100%;
|
|
}
|
|
|
|
.site-content {
|
|
float: right;
|
|
margin-right: 29.4118%;
|
|
margin-left: auto;
|
|
}
|
|
|
|
blockquote {
|
|
margin-right: -1.3333em;
|
|
margin-left: auto;
|
|
padding-right: 1.1111em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.main-navigation .menu-item-has-children > a {
|
|
padding-right: 0;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4em 0 1.6em 1.6em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4em 1.6em 1.6em 0;
|
|
}
|
|
|
|
.widget blockquote {
|
|
margin-right: -1.5em;
|
|
margin-left: auto;
|
|
padding-right: 1.1667em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.4583em 1em 0 0;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.3333em 0.3333em;
|
|
}
|
|
|
|
.author-info .avatar {
|
|
margin: 0 0 1.5em 1.5em;
|
|
}
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 0.8em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
margin-left: 0.8em;
|
|
}
|
|
|
|
.bypostauthor > article .fn:after {
|
|
right: 3px;
|
|
left: auto;
|
|
}
|
|
|
|
.site-branding {
|
|
padding: 0;
|
|
}
|
|
|
|
.site-footer {
|
|
float: right;
|
|
margin: 0 35.2941% 0 0;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.5 Desktop Medium 1100px
|
|
*/
|
|
|
|
@media screen and (min-width: 68.75em) {
|
|
blockquote {
|
|
margin-right: -1.05em;
|
|
margin-left: auto;
|
|
padding-right: 0.85em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.main-navigation .menu-item-has-children > a {
|
|
padding-right: 0;
|
|
padding-left: 34px;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4118em 0 1.6471em 1.6471em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4118em 1.6471em 1.6471em 0;
|
|
}
|
|
|
|
.widget blockquote {
|
|
padding-right: 1.2143em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.4643em 1em 0 0;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.2857em 0.2857em;
|
|
}
|
|
|
|
.author-info .avatar {
|
|
margin: 0 0 1.6471em 1.6471em;
|
|
}
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 1.1667em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
margin-left: 1.64705em;
|
|
}
|
|
|
|
.bypostauthor > article .fn:after {
|
|
right: 6px;
|
|
left: auto;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.6 Desktop Large 1240px
|
|
*/
|
|
|
|
@media screen and (min-width: 77.5em) {
|
|
blockquote {
|
|
margin-right: -1.0909em;
|
|
margin-left: auto;
|
|
padding-right: 0.9091em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.main-navigation .menu-item-has-children > a {
|
|
padding-right: 0;
|
|
padding-left: 38px;
|
|
}
|
|
|
|
blockquote.alignright,
|
|
.wp-caption.alignright,
|
|
img.alignright {
|
|
margin: 0.4211em 0 1.6842em 1.6842em;
|
|
}
|
|
|
|
blockquote.alignleft,
|
|
.wp-caption.alignleft,
|
|
img.alignleft {
|
|
margin: 0.4211em 1.6842em 1.6842em 0;
|
|
}
|
|
|
|
.widget blockquote {
|
|
padding-right: 1.25em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget_categories .children,
|
|
.widget_nav_menu .sub-menu,
|
|
.widget_pages .children {
|
|
margin: 0.4688em 1em 0 0;
|
|
}
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 0.25em 0.25em;
|
|
}
|
|
|
|
.author-info .avatar {
|
|
margin: 0 0 1.6842em 1.6842em;
|
|
}
|
|
|
|
.comment-list .children > li {
|
|
padding-right: 1.4737em;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-author .avatar {
|
|
margin-left: 1.64705em;
|
|
}
|
|
}
|
|
|
|
|
|
/**
|
|
* 11.7 Desktop X-Large 1403px
|
|
*/
|
|
|
|
@media screen and (min-width: 87.6875em) {
|
|
body:before {
|
|
width: -webkit-calc(50% - 289px);
|
|
width: calc(50% - 289px);
|
|
}
|
|
}
|