854 lines
15 KiB
CSS
854 lines
15 KiB
CSS
/*
|
|
Theme Name: Twenty Fourteen
|
|
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 - Repeatable Patterns
|
|
* 4.0 - Header
|
|
* 5.0 - Navigation
|
|
* 6.0 - Content
|
|
* 6.3 - Entry Meta
|
|
* 6.4 - Entry Content
|
|
* 6.5 - Galleries
|
|
* 6.7 - Post/Image/Paging Navigation
|
|
* 6.10 - Contributor Page
|
|
* 6.14 - Comments
|
|
* 7.0 - Sidebar
|
|
* 7.1 - Widgets
|
|
* 7.2 - Content Sidebar Widgets
|
|
* 9.0 - Featured Content
|
|
* 10.0 - Media Queries
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
|
|
/**
|
|
* 1.0 Reset
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
body {
|
|
direction: rtl;
|
|
unicode-bidi: embed;
|
|
}
|
|
|
|
a {
|
|
display: inline-block;
|
|
}
|
|
|
|
ul,
|
|
ol {
|
|
margin: 0 20px 24px 0;
|
|
}
|
|
|
|
li > ul,
|
|
li > ol {
|
|
margin: 0 20px 0 0;
|
|
}
|
|
|
|
caption,
|
|
th,
|
|
td {
|
|
text-align: right;
|
|
}
|
|
|
|
|
|
/**
|
|
* 2.0 Repeatable Patterns
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.wp-caption-text {
|
|
padding-left: 10px;
|
|
padding-right: 0;
|
|
}
|
|
|
|
.screen-reader-text:focus {
|
|
right: 5px;
|
|
left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 4.0 Header
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.site-title {
|
|
float: right;
|
|
}
|
|
|
|
.search-toggle {
|
|
float: left;
|
|
margin-left: 38px;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.search-box .search-field {
|
|
float: left;
|
|
padding: 1px 6px 2px 2px;
|
|
}
|
|
|
|
.search-toggle .screen-reader-text {
|
|
right: 5px; /* Avoid a horizontal scrollbar when the site has a long menu */
|
|
left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 5.0 Navigation
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.site-navigation ul ul {
|
|
margin-right: 20px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.menu-toggle {
|
|
right: auto;
|
|
left: 0;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.0 Content
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
/**
|
|
* 6.3 Entry Meta
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.entry-meta .tag-links a {
|
|
margin: 0 10px 4px 4px;
|
|
}
|
|
|
|
.entry-meta .tag-links a:before {
|
|
border-right: 0;
|
|
border-left: 8px solid #767676;
|
|
right: -7px;
|
|
left: auto;
|
|
}
|
|
|
|
.entry-meta .tag-links a:hover:before,
|
|
.entry-meta .tag-links a:focus:before {
|
|
border-left-color: #41a62a;
|
|
}
|
|
|
|
.entry-meta .tag-links a:after {
|
|
right: -2px;
|
|
left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.4 Entry Content
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.page-links a,
|
|
.page-links > span {
|
|
margin: 0 0 2px 1px;
|
|
}
|
|
|
|
.page-links > .page-links-title {
|
|
padding-right: 0;
|
|
padding-left: 7px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.5 Galleries
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.gallery-item {
|
|
float: right;
|
|
margin: 0 0 4px 4px;
|
|
}
|
|
|
|
.gallery-columns-1 .gallery-item:nth-of-type(1n),
|
|
.gallery-columns-2 .gallery-item:nth-of-type(2n),
|
|
.gallery-columns-3 .gallery-item:nth-of-type(3n),
|
|
.gallery-columns-4 .gallery-item:nth-of-type(4n),
|
|
.gallery-columns-5 .gallery-item:nth-of-type(5n),
|
|
.gallery-columns-6 .gallery-item:nth-of-type(6n),
|
|
.gallery-columns-7 .gallery-item:nth-of-type(7n),
|
|
.gallery-columns-8 .gallery-item:nth-of-type(8n),
|
|
.gallery-columns-9 .gallery-item:nth-of-type(9n) {
|
|
margin-right: auto;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.gallery-caption {
|
|
padding: 6px 8px;
|
|
right: 0;
|
|
left: auto;
|
|
text-align: right;
|
|
}
|
|
|
|
.gallery-caption:before {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.7 Post/Image/Paging Navigation
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.paging-navigation .page-numbers {
|
|
margin-right: auto;
|
|
margin-left: 1px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.10 Contributor Page
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.contributor-avatar {
|
|
float: right;
|
|
margin: 0 0 20px 30px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 6.14 Comments
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.comment-author .avatar {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.bypostauthor > article .fn:before {
|
|
margin: 0 -2px 0 2px;
|
|
}
|
|
|
|
.comment-author,
|
|
.comment-awaiting-moderation,
|
|
.comment-content,
|
|
.comment-list .reply,
|
|
.comment-metadata {
|
|
padding-right: 30px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-edit-link {
|
|
margin-right: 10px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.comment-reply-link:before,
|
|
.comment-reply-login:before {
|
|
margin-left: auto;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.comment-reply-link:before,
|
|
.comment-reply-login:before,
|
|
.comment-edit-link:before {
|
|
-webkit-transform: scaleX(-1);
|
|
-moz-transform: scaleX(-1);
|
|
-ms-transform: scaleX(-1);
|
|
-o-transform: scaleX(-1);
|
|
transform: scaleX(-1);
|
|
}
|
|
|
|
.comment-content ul,
|
|
.comment-content ol {
|
|
margin: 0 22px 24px 0;
|
|
}
|
|
|
|
.comment-list .children {
|
|
margin-right: 15px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.comment-reply-title small a {
|
|
float: left;
|
|
}
|
|
|
|
.comment-navigation .nav-previous a {
|
|
margin-right: auto;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 7.0 Sidebars
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
/**
|
|
* 7.1 Widgets
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.widget li > ol,
|
|
.widget li > ul {
|
|
margin-right: 10px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.widget input,
|
|
.widget textarea {
|
|
padding: 1px 4px 2px 2px;
|
|
}
|
|
|
|
.widget_calendar caption {
|
|
text-align: right;
|
|
}
|
|
|
|
.widget_calendar #prev {
|
|
padding-right: 5px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.widget_calendar #next {
|
|
padding-right: 0;
|
|
padding-left: 5px;
|
|
text-align: left;
|
|
}
|
|
|
|
.widget_twentyfourteen_ephemera .entry-content ul,
|
|
.widget_twentyfourteen_ephemera .entry-content ol {
|
|
margin: 0 20px 18px 0;
|
|
}
|
|
|
|
.widget_twentyfourteen_ephemera .entry-content li > ul,
|
|
.widget_twentyfourteen_ephemera .entry-content li > ol {
|
|
margin: 0 20px 0 0;
|
|
}
|
|
|
|
|
|
/**
|
|
* 7.2 Content Sidebar Widgets
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.content-sidebar .widget li > ol,
|
|
.content-sidebar .widget li > ul {
|
|
margin-right: 18px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.content-sidebar .widget_twentyfourteen_ephemera .widget-title:before {
|
|
margin: -1px 0 0 18px;
|
|
}
|
|
|
|
|
|
/**
|
|
* 9.0 Featured Content
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
.featured-content .post-thumbnail img {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
.slider-viewport {
|
|
direction: ltr;
|
|
}
|
|
|
|
.slider .featured-content .entry-header {
|
|
right: 0;
|
|
left: auto;
|
|
text-align: right;
|
|
}
|
|
|
|
.slider-control-paging {
|
|
float: right;
|
|
}
|
|
|
|
.slider-control-paging li {
|
|
float: right;
|
|
margin: 2px 0 2px 4px;
|
|
}
|
|
|
|
.slider-control-paging li:last-child {
|
|
margin-right: auto;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.slider-control-paging a:before {
|
|
right: 10px;
|
|
left: auto;
|
|
}
|
|
|
|
.slider-direction-nav li {
|
|
border-width: 2px 0 0 1px;
|
|
float: right;
|
|
}
|
|
|
|
.slider-direction-nav li:last-child {
|
|
border-width: 2px 1px 0 0;
|
|
}
|
|
|
|
.slider-direction-nav a:before {
|
|
content: "\f429";
|
|
}
|
|
|
|
.slider-direction-nav .slider-next:before {
|
|
content: "\f430";
|
|
}
|
|
|
|
|
|
/**
|
|
* 10.0 Media Queries
|
|
* -----------------------------------------------------------------------------
|
|
*/
|
|
|
|
@media screen and (max-width: 400px) {
|
|
.list-view .site-content .post-thumbnail img {
|
|
float: right;
|
|
margin: 0 0 3px 10px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 401px) {
|
|
.site-content .entry-meta > span {
|
|
margin-right: auto;
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.site-content .format-quote .post-format a:before {
|
|
margin-right: auto;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.site-content .format-gallery .post-format a:before {
|
|
margin-right: auto;
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.site-content .format-aside .post-format a:before {
|
|
margin-right: auto;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.site-content .featured-post:before {
|
|
margin-right: auto;
|
|
margin-left: 3px;
|
|
}
|
|
|
|
.site-content .entry-date a:before,
|
|
.attachment .site-content span.entry-date:before {
|
|
margin-right: auto;
|
|
margin-left: 1px;
|
|
}
|
|
|
|
.site-content .comments-link a:before {
|
|
margin-right: auto;
|
|
margin-left: 2px;
|
|
}
|
|
|
|
.site-content .full-size-link a:before {
|
|
margin-right: auto;
|
|
margin-left: 1px;
|
|
}
|
|
|
|
.entry-content .edit-link a:before,
|
|
.entry-meta .edit-link a:before {
|
|
-webkit-transform: scaleX(-1);
|
|
-moz-transform: scaleX(-1);
|
|
-ms-transform: scaleX(-1);
|
|
-o-transform: scaleX(-1);
|
|
transform: scaleX(-1);
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 594px) {
|
|
.site-content .entry-header {
|
|
padding-right: 30px;
|
|
padding-left: 30px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 673px) {
|
|
.search-toggle {
|
|
margin-right: auto;
|
|
margin-left: 18px;
|
|
}
|
|
|
|
.content-area {
|
|
float: right;
|
|
}
|
|
|
|
.site-content {
|
|
margin-right: auto;
|
|
margin-left: 33.33333333%;
|
|
}
|
|
|
|
.archive-header,
|
|
.comments-area,
|
|
.image-navigation,
|
|
.page-header,
|
|
.page-content,
|
|
.post-navigation,
|
|
.site-content .entry-content,
|
|
.site-content .entry-summary,
|
|
.site-content footer.entry-meta {
|
|
padding-right: 30px;
|
|
padding-left: 30px;
|
|
}
|
|
|
|
.full-width .site-content {
|
|
margin-left: 0;
|
|
}
|
|
|
|
.content-sidebar {
|
|
float: left;
|
|
margin-right: -33.33333333%;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.grid .featured-content .hentry {
|
|
float: right;
|
|
}
|
|
|
|
.slider-control-paging {
|
|
padding-right: 20px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.slider-direction-nav {
|
|
float: left;
|
|
}
|
|
|
|
.slider-direction-nav li {
|
|
padding: 0 0 0 1px;
|
|
}
|
|
|
|
.slider-direction-nav li:last-child {
|
|
padding: 0 1px 0 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 783px) {
|
|
.header-main {
|
|
padding-right: 30px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.search-toggle {
|
|
margin-right: auto;
|
|
margin-left: 0;
|
|
}
|
|
|
|
.primary-navigation {
|
|
float: left;
|
|
margin: 0 -12px 0 1px;
|
|
}
|
|
|
|
.primary-navigation ul ul {
|
|
float: right;
|
|
margin: 0;
|
|
right: -999em;
|
|
left: auto;
|
|
}
|
|
|
|
.primary-navigation ul ul ul {
|
|
right: -999em;
|
|
left: auto;
|
|
}
|
|
|
|
.primary-navigation ul li:hover > ul,
|
|
.primary-navigation ul li.focus > ul {
|
|
right: auto;
|
|
}
|
|
|
|
.primary-navigation ul ul li:hover > ul,
|
|
.primary-navigation ul ul li.focus > ul {
|
|
right: 100%;
|
|
left: auto;
|
|
}
|
|
|
|
.primary-navigation .menu-item-has-children > a,
|
|
.primary-navigation .page_item_has_children > a {
|
|
padding-right: 12px;
|
|
padding-left: 26px;
|
|
}
|
|
|
|
.primary-navigation .menu-item-has-children > a:after,
|
|
.primary-navigation .page_item_has_children > a:after {
|
|
right: auto;
|
|
left: 12px;
|
|
}
|
|
|
|
.primary-navigation li .menu-item-has-children > a,
|
|
.primary-navigation li .page_item_has_children > a {
|
|
padding-right: 12px;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.primary-navigation .menu-item-has-children li.menu-item-has-children > a:after,
|
|
.primary-navigation .menu-item-has-children li.page_item_has_children > a:after,
|
|
.primary-navigation .page_item_has_children li.menu-item-has-children > a:after,
|
|
.primary-navigation .page_item_has_children li.page_item_has_children > a:after {
|
|
content: "\f503";
|
|
right: auto;
|
|
left: 8px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 810px) {
|
|
.attachment .entry-attachment .attachment {
|
|
margin-right: -168px;
|
|
margin-left: -168px;
|
|
}
|
|
|
|
.attachment .entry-attachment .attachment a {
|
|
display: block;
|
|
}
|
|
|
|
.contributor-avatar {
|
|
margin-right: -168px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.contributor-summary {
|
|
float: right;
|
|
}
|
|
|
|
.full-width .site-content blockquote.alignright,
|
|
.full-width .site-content img.size-full.alignright,
|
|
.full-width .site-content img.size-large.alignright,
|
|
.full-width .site-content img.size-medium.alignright,
|
|
.full-width .site-content .wp-caption.alignright {
|
|
margin-right: -168px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.full-width .site-content blockquote.alignleft,
|
|
.full-width .site-content img.size-full.alignleft,
|
|
.full-width .site-content img.size-large.alignleft,
|
|
.full-width .site-content img.size-medium.alignleft,
|
|
.full-width .site-content .wp-caption.alignleft {
|
|
margin-right: auto;
|
|
margin-left: -168px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 846px) {
|
|
.comment-author,
|
|
.comment-awaiting-moderation,
|
|
.comment-content,
|
|
.comment-list .reply,
|
|
.comment-metadata {
|
|
padding-right: 50px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.comment-list .children {
|
|
margin-right: 20px;
|
|
margin-left: auto;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1008px) {
|
|
.search-box-wrapper {
|
|
padding-right: 182px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.main-content {
|
|
float: right;
|
|
}
|
|
|
|
.site-content {
|
|
margin-right: 182px;
|
|
margin-left: 29.04761904%;
|
|
}
|
|
|
|
.full-width .site-content {
|
|
margin-right: 182px;
|
|
}
|
|
|
|
.content-sidebar {
|
|
margin-right: -29.04761904%;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.site:before {
|
|
right: 0;
|
|
left: auto;
|
|
}
|
|
|
|
#secondary {
|
|
float: right;
|
|
margin: 0 -100% 0 0;
|
|
}
|
|
|
|
.secondary-navigation ul ul {
|
|
right: -999em;
|
|
left: auto;
|
|
}
|
|
|
|
.secondary-navigation ul li:hover > ul,
|
|
.secondary-navigation ul li.focus > ul {
|
|
right: 162px;
|
|
left: auto;
|
|
}
|
|
|
|
.secondary-navigation .menu-item-has-children > a {
|
|
padding-right: 30px;
|
|
padding-left: 38px;
|
|
}
|
|
|
|
.secondary-navigation .menu-item-has-children > a:after {
|
|
border-right-color: #fff;
|
|
border-left-color: transparent;
|
|
right: auto;
|
|
left: 26px;
|
|
content: "\f503";
|
|
}
|
|
|
|
.footer-sidebar .widget {
|
|
float: right;
|
|
}
|
|
|
|
.featured-content {
|
|
padding-right: 182px;
|
|
padding-left: 0;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1040px) {
|
|
.archive-header,
|
|
.comments-area,
|
|
.image-navigation,
|
|
.page-header,
|
|
.page-content,
|
|
.post-navigation,
|
|
.site-content .entry-header,
|
|
.site-content .entry-content,
|
|
.site-content .entry-summary,
|
|
.site-content footer.entry-meta {
|
|
padding-right: 15px;
|
|
padding-left: 15px;
|
|
}
|
|
|
|
.full-width .archive-header,
|
|
.full-width .comments-area,
|
|
.full-width .image-navigation,
|
|
.full-width .page-header,
|
|
.full-width .page-content,
|
|
.full-width .post-navigation,
|
|
.full-width .site-content .entry-header,
|
|
.full-width .site-content .entry-content,
|
|
.full-width .site-content .entry-summary,
|
|
.full-width .site-content footer.entry-meta {
|
|
padding-right: 30px;
|
|
padding-left: 30px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1080px) {
|
|
.site-content {
|
|
margin-right: 222px;
|
|
margin-left: 29.04761904%;
|
|
}
|
|
|
|
.full-width .site-content {
|
|
margin-right: 222px;
|
|
}
|
|
|
|
.search-box-wrapper,
|
|
.featured-content {
|
|
padding-right: 222px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.secondary-navigation ul li:hover > ul,
|
|
.secondary-navigation ul li.focus > ul {
|
|
right: 202px;
|
|
left: auto;
|
|
}
|
|
|
|
.slider-control-paging {
|
|
padding-right: 24px;
|
|
padding-left: 0;
|
|
}
|
|
|
|
.slider-control-paging li {
|
|
margin: 12px 0 12px 12px;
|
|
}
|
|
|
|
.slider-control-paging a:before {
|
|
right: 6px;
|
|
left: auto;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1110px) {
|
|
.archive-header,
|
|
.comments-area,
|
|
.image-navigation,
|
|
.page-header,
|
|
.page-content,
|
|
.post-navigation,
|
|
.site-content .entry-header,
|
|
.site-content .entry-content,
|
|
.site-content .entry-summary,
|
|
.site-content footer.entry-meta {
|
|
padding-right: 30px;
|
|
padding-left: 30px;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1218px) {
|
|
.archive-header,
|
|
.comments-area,
|
|
.image-navigation,
|
|
.page-header,
|
|
.page-content,
|
|
.post-navigation,
|
|
.site-content .entry-header,
|
|
.site-content .entry-content,
|
|
.site-content .entry-summary,
|
|
.site-content footer.entry-meta {
|
|
margin-left: 54px;
|
|
}
|
|
|
|
.full-width .archive-header,
|
|
.full-width .comments-area,
|
|
.full-width .image-navigation,
|
|
.full-width .page-header,
|
|
.full-width .page-content,
|
|
.full-width .post-navigation,
|
|
.full-width .site-content .entry-header,
|
|
.full-width .site-content .entry-content,
|
|
.full-width .site-content .entry-summary,
|
|
.full-width .site-content footer.entry-meta {
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width: 1260px) {
|
|
.site-content blockquote.alignright {
|
|
margin-right: -18%;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.site-content blockquote.alignleft {
|
|
margin-left: -18%;
|
|
margin-right: auto;
|
|
}
|
|
} |