363 lines
17 KiB
CSS
363 lines
17 KiB
CSS
|
/*
|
||
|
* Theme Name: OceanWP RTL CSS
|
||
|
* Description: Adds support for languages written in a Right To Left (RTL) direction.
|
||
|
*/
|
||
|
|
||
|
/*------------------------------------*
|
||
|
General & Commons
|
||
|
*------------------------------------*/
|
||
|
body { direction: rtl; unicode-bidi: embed; }
|
||
|
|
||
|
/* Float right */
|
||
|
body .oceanwp-row .col,
|
||
|
.top-bar-left { float: right }
|
||
|
|
||
|
/* Float left */
|
||
|
.top-bar-right { float: left }
|
||
|
|
||
|
/* List */
|
||
|
ul, ol { margin: 15px 20px 15px 0; }
|
||
|
|
||
|
/* Tables */
|
||
|
table th, table td, caption, th, td { text-align: right; }
|
||
|
|
||
|
/* Theme heading */
|
||
|
.theme-heading .text::before { display: none; }
|
||
|
.theme-heading .text::after { content: '\f104'; font-family: 'Font Awesome 5 Free'; font-size: 18px; font-weight: 600; color: #13aff0; padding-left: 6px;}
|
||
|
|
||
|
/* Change right position to Left position*/
|
||
|
.site-breadcrumbs,
|
||
|
#top-bar-social.top-bar-right,
|
||
|
#searchform-dropdown,
|
||
|
.current-shop-items-dropdown { right: auto; left: 0; }
|
||
|
|
||
|
/* Search form input */
|
||
|
form.oceanwp-searchform input { padding: 0 15px 0 40px; }
|
||
|
|
||
|
/* Change left position to right position*/
|
||
|
#top-bar-social.top-bar-left { left: auto; right: 0; }
|
||
|
|
||
|
/* Layout */
|
||
|
.content-area { float: right; padding-left: 30px; padding-right: 0; border-left-width: 1px; border-right-width: 0; }
|
||
|
.widget-area.sidebar-primary { float: left; padding-right: 30px; padding-left: 0; }
|
||
|
.content-left-sidebar .content-area { float: left; padding-right: 30px; padding-left: 0; border-right-width: 1px; border-left-width: 0; }
|
||
|
.content-left-sidebar .widget-area.sidebar-primary { float: right; padding-left: 30px; padding-right: 0; }
|
||
|
|
||
|
/* Both sidebars */
|
||
|
.content-both-sidebars .content-area { float: left; padding-right: 30px; }
|
||
|
.content-both-sidebars .content-area { border-right-width: 1px; }
|
||
|
.content-both-sidebars .widget-area.sidebar-primary { padding-right: 0; }
|
||
|
|
||
|
/* Boxed layout */
|
||
|
.boxed-layout .site-breadcrumbs { right: auto; left: 30px; }
|
||
|
|
||
|
/* Separate layout */
|
||
|
.separate-layout .content-area { border-left-width: 0; border-right-width: 0; }
|
||
|
.separate-layout.content-left-sidebar .content-area { border-right-width: 0; border-left-width: 0; }
|
||
|
.separate-layout .widget-area.sidebar-primary { padding-right: 20px; padding-left: 0; }
|
||
|
.separate-layout.content-left-sidebar .widget-area.sidebar-primary { padding-left: 20px; padding-right: 0; }
|
||
|
body.separate-blog.separate-layout .oceanwp-row { margin-left: -20px; margin-right: 0; }
|
||
|
body.separate-blog.separate-layout #blog-entries.blog-grid > * { padding: 0 0 0 20px; }
|
||
|
|
||
|
/* Blockquote */
|
||
|
blockquote { padding-right: 20px; padding-left: 0; border-right-width: 3px; border-left-width: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Header
|
||
|
*------------------------------------*/
|
||
|
#site-logo { float: right; }
|
||
|
|
||
|
/* Top Menu header */
|
||
|
#site-header.top-header .header-top .left { float: right; }
|
||
|
#site-header.top-header .header-top .right { float: left; }
|
||
|
#site-header.top-header #site-navigation-wrap { right: -15px !important; left: auto !important; }
|
||
|
|
||
|
/* Full Screen header */
|
||
|
#site-header.full_screen-header #site-navigation-wrap { right: auto; left: 0; }
|
||
|
#site-header.full_screen-header .menu-bar { float: left; }
|
||
|
#site-header.full_screen-header #full-screen-menu { left: auto; right: 0; }
|
||
|
#site-header.full_screen-header .fs-dropdown-menu li > a > .nav-arrow { padding-left: 0; padding-right: 5px; }
|
||
|
#site-header.full_screen-header .fs-dropdown-menu > li.search-toggle-li label i { margin-left: 0; margin-right: 3px; }
|
||
|
|
||
|
/* Center header */
|
||
|
#site-header.center-header #site-navigation-wrap .left-menu { float: right; }
|
||
|
#site-header.center-header #site-navigation-wrap .right-menu { float: left; }
|
||
|
#site-header.center-header .wider .left-menu { text-align: right; }
|
||
|
#site-header.center-header .wider .right-menu { text-align: left; }
|
||
|
#site-header.center-header .closer .left-menu { text-align: left; }
|
||
|
#site-header.center-header .closer .right-menu { text-align: right; }
|
||
|
|
||
|
/* Medium header */
|
||
|
#site-header.medium-header .oceanwp-social-menu { text-align: left; }
|
||
|
#site-header.medium-header #medium-searchform { text-align: right; }
|
||
|
#site-header.medium-header #medium-searchform input { padding: 6px 12px 6px 38px; }
|
||
|
#site-header.medium-header #medium-searchform label { left: auto; right: 12px; }
|
||
|
#site-header.medium-header #medium-searchform button { right: auto; left: 0; }
|
||
|
|
||
|
/* Vertical header */
|
||
|
#site-header.vertical-header.left-logo #site-logo { text-align: right; }
|
||
|
#site-header.vertical-header.right-logo #site-logo { text-align: left; }
|
||
|
#site-header.vertical-header .has-social #site-navigation-wrap { left: auto; }
|
||
|
#site-header.vertical-header #site-navigation-wrap { left: auto; }
|
||
|
#site-header.vertical-header #site-navigation-wrap .dropdown-menu li > a .dropdown-toggle { left: 0; right: auto; }
|
||
|
#site-header.vertical-header #site-navigation-wrap .dropdown-menu li > a .dropdown-toggle:before { right: 50%; left: auto; margin-right: -10px; margin-left: 0; }
|
||
|
#site-header.vertical-header #site-navigation-wrap .dropdown-menu .sub-menu { right: 0; left: auto; }
|
||
|
#site-header.vertical-header #vertical-searchform form label { right: 12px; left: auto; }
|
||
|
#site-header.vertical-header #vertical-searchform form button { left: 0; right: auto; }
|
||
|
#site-header.vertical-header .oceanwp-social-menu.simple-social { left: auto; }
|
||
|
body.vertical-header-style.left-header #site-header.vertical-header { right: 0; left: auto; }
|
||
|
body.vertical-header-style.left-header #site-header.vertical-header .vertical-toggle { left: 0; right: auto; }
|
||
|
body.vertical-header-style.left-header #outer-wrap { margin-right: 300px; margin-left: 0; }
|
||
|
body.vertical-header-style.right-header #site-header.vertical-header { left: 0; right: auto; }
|
||
|
body.vertical-header-style.right-header #site-header.vertical-header .vertical-toggle { right: 0; left: auto; }
|
||
|
body.vertical-header-style.right-header #outer-wrap { margin-left: 300px; margin-right: 0; }
|
||
|
body.vertical-header-style.has-vh-transparent.left-header #outer-wrap { margin-right: 0; }
|
||
|
body.vertical-header-style.has-vh-transparent.right-header #outer-wrap { margin-left: 0; }
|
||
|
body.vertical-header-style.vh-closed.left-header #site-header.vertical-header { right: -266px; left: auto; }
|
||
|
body.vertical-header-style.vh-closed.left-header #outer-wrap { margin-right: 34px; margin-left: 0; }
|
||
|
body.vertical-header-style.vh-closed.right-header #site-header.vertical-header { left: -266px; right: auto; }
|
||
|
body.vertical-header-style.vh-closed.right-header #outer-wrap { margin-left: 34px; margin-right: 0; }
|
||
|
body.vertical-header-style.vh-closed.vh-opened.left-header #site-header.vertical-header { right: 0; left: auto; }
|
||
|
body.vertical-header-style.vh-closed.vh-opened.right-header #site-header.vertical-header { left: 0; right: auto; }
|
||
|
body.vertical-header-style.vh-closed.vh-opened #site-header.vertical-header #site-navigation-wrap { padding-left: 0; }
|
||
|
body.vertical-header-style.vh-closed #site-header.vertical-header #site-navigation-wrap { padding-left: 34px; padding-right: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Navigation
|
||
|
*------------------------------------*/
|
||
|
#site-navigation-wrap { float: left; left: -15px; right: auto; }
|
||
|
#site-navigation-wrap .dropdown-menu > li { float: right; }
|
||
|
#site-navigation-wrap .dropdown-menu > li > a .nav-arrow { padding-right: 6px; padding-left: 0; }
|
||
|
|
||
|
#searchform-header-replace { left: 0; right: auto; }
|
||
|
#searchform-header-replace-close { left: 8px; right: auto; }
|
||
|
|
||
|
.search-overlay.center-header .search-overlay .search-toggle-li .search-overlay-toggle.exit > span:before { padding-left: 5px; padding-right: 0; }
|
||
|
|
||
|
.dropdown-menu .sub-menu { right: 0; left: auto; text-align: right; }
|
||
|
.dropdown-menu ul .sub-menu { right: 100%; left: auto; }
|
||
|
.dropdown-menu ul li a.menu-link .nav-arrow { left: 15px; right: auto; }
|
||
|
.dropdown-menu ul li a.menu-link i { margin-left: 3px; margin-right: 0; }
|
||
|
.dropdown-menu li a.menu-link i { padding-left: 5px; padding-right: 0; }
|
||
|
|
||
|
.navigation .megamenu { right: auto; }
|
||
|
.navigation > ul > li > ul.megamenu.sub-menu > li { float: right; border-right-width: 1px; border-left-width: 0; }
|
||
|
.navigation > ul > li > ul.megamenu.sub-menu > li:first-child { border-right: none; }
|
||
|
|
||
|
.after-header-content { float: left; }
|
||
|
|
||
|
/* If social */
|
||
|
.has-social #site-navigation-wrap { left: 0; right: auto; }
|
||
|
|
||
|
/* If left menu */
|
||
|
.minimal-header.left-menu #site-navigation-wrap,
|
||
|
.transparent-header.left-menu #site-navigation-wrap { float: right; left: 0; right: auto; }
|
||
|
|
||
|
.minimal-header.left-menu #site-logo,
|
||
|
.transparent-header.left-menu #site-logo { padding-left: 20px; padding-right: 0; }
|
||
|
|
||
|
/* If center menu */
|
||
|
.center-menu #site-navigation-wrap { right: 50%; left: auto; }
|
||
|
|
||
|
/* menu icons */
|
||
|
.dropdown-menu li a.menu-link i.after { margin-right: 6px; margin-left: 0; }
|
||
|
.dropdown-menu li a.menu-link i.before { margin-left: 6px; margin-right: 0; }
|
||
|
.dropdown-menu li a.menu-link img.after { margin-right: 6px; }
|
||
|
.dropdown-menu li a.menu-link img.before { margin-left: 6px; }
|
||
|
|
||
|
/* Social menu */
|
||
|
.oceanwp-social-menu { float: left; }
|
||
|
.oceanwp-social-menu.simple-social { right: auto; left: -8px; }
|
||
|
.oceanwp-social-menu.social-with-style { right: auto; left: -2px; }
|
||
|
.oceanwp-social-menu ul li { float: right; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Mobile Navigation
|
||
|
*------------------------------------*/
|
||
|
a.sidr-class-toggle-sidr-close i { padding-left: 8px; padding-right: 0; }
|
||
|
.sidr-class-dropdown-toggle { left: 0; right: auto; }
|
||
|
.sidr-class-dropdown-menu li.sidr-class-menu-item-has-children > a { padding-right: 20px; padding-left: 60px; }
|
||
|
.sidr-class-dropdown-menu ul a:before { content: '\f104'; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Drop Down Mobile Menu Style
|
||
|
*------------------------------------*/
|
||
|
#mobile-dropdown { right: 0; left: auto; }
|
||
|
#mobile-dropdown ul li a { text-align: right; }
|
||
|
#mobile-dropdown ul li a .dropdown-toggle { left: 0; right: auto; padding-left: 40px; padding-right: 0; }
|
||
|
#mobile-dropdown ul li a .dropdown-toggle:before { right: 50%; left: auto; margin-right: -15px; margin-left: 0; }
|
||
|
#mobile-dropdown ul li ul { margin-right: 0; }
|
||
|
#mobile-dropdown #mobile-menu-search form input { padding: 6px 12px 6px 45px !important; }
|
||
|
#mobile-dropdown #mobile-menu-search form button { left: 10px; right: auto; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Full Screen Mobile Menu Style
|
||
|
*------------------------------------*/
|
||
|
#mobile-fullscreen { right: 0; left: auto; }
|
||
|
#mobile-fullscreen a.close { left: 14px; right: auto; }
|
||
|
#mobile-fullscreen .fs-dropdown-menu li .dropdown-toggle { padding-right: 5px; padding-left: 0; }
|
||
|
#mobile-fullscreen #mobile-search label i { margin-right: 3px; margin-left: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Breadcrumbs
|
||
|
*------------------------------------*/
|
||
|
.site-breadcrumbs ul li:after { content: '\f104'; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Posts
|
||
|
*------------------------------------*/
|
||
|
ul.meta li i { padding-left: 5px; padding-right: 0; }
|
||
|
.single-post ul.meta li i { padding-left: 9px; padding-right: 0; }
|
||
|
|
||
|
.blog-entry ul.meta li i,
|
||
|
.blog-entry ul.meta li i,
|
||
|
.single-post ul.meta li .owp-icon,
|
||
|
.blog-entry ul.meta li .owp-icon {
|
||
|
margin-right: 0;
|
||
|
margin-left: 8px;
|
||
|
}
|
||
|
|
||
|
/* Thumbnail style */
|
||
|
.blog-entry.thumbnail-entry .left-position .blog-entry-content { padding-right: 3em; padding-left: 0; }
|
||
|
.blog-entry.thumbnail-entry .right-position .blog-entry-content { padding-left: 3em; padding-right: 0; }
|
||
|
.blog-entry.thumbnail-entry .blog-entry-comments { float: right; }
|
||
|
.blog-entry.thumbnail-entry .blog-entry-comments i { padding-left: 6px; padding-right: 0; }
|
||
|
.blog-entry.thumbnail-entry .blog-entry-comments svg.owp-icon { margin-right: 0; margin-left: 0.7rem; }
|
||
|
.blog-entry.thumbnail-entry .blog-entry-date { float: left; }
|
||
|
|
||
|
/* Readmore button */
|
||
|
.blog-entry.large-entry .blog-entry-readmore a i { margin-right: 8px; margin-left: 0; }
|
||
|
.blog-entry .blog-entry-readmore a i:before { content: '\f104'; padding-right: 5px; }
|
||
|
|
||
|
/* Link format */
|
||
|
.link-entry i { left: 20px; right: auto; }
|
||
|
|
||
|
/* Dropcap */
|
||
|
.dropcap { float: right; margin-left: 10px; margin-right: 0; }
|
||
|
|
||
|
/* Next & Prev */
|
||
|
.single-post nav.post-navigation .nav-links .nav-previous { float: right; padding-left: 20px; padding-right: 0; text-align: right; border-left-width: 1px; border-right-width: 0; }
|
||
|
.single-post nav.post-navigation .nav-links .nav-previous i { float: right; margin-left: 20px; margin-right: 0; }
|
||
|
.single-post nav.post-navigation .nav-links .nav-next { float: left; padding-right: 20px; padding-left: 0; text-align: left; }
|
||
|
.single-post nav.post-navigation .nav-links .nav-next i { float: left; margin-right: 20px; margin-left: 0; }
|
||
|
|
||
|
/* Related Posts */
|
||
|
#related-posts time.published i { padding-left: 5px; }
|
||
|
#related-posts time.published svg.owp-icon { margin-left: 0.7rem; margin-right: 0; }
|
||
|
|
||
|
/* Author bio */
|
||
|
#author-bio .author-bio-avatar { margin-left: 30px; margin-right: 0; }
|
||
|
|
||
|
/**
|
||
|
* Post page header
|
||
|
*/
|
||
|
.single-header-ocean-6 .blog-post-title .single-post-title,
|
||
|
.single-header-ocean-7 .blog-post-title .single-post-title {
|
||
|
text-align: right;
|
||
|
}
|
||
|
|
||
|
ul.hms-style-modern li i,
|
||
|
ul.hms-style-modern li i,
|
||
|
ul.betm-style-modern li i,
|
||
|
ul.bebm-style-modern li i {
|
||
|
float: right;
|
||
|
margin-top: 5px;
|
||
|
}
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Comments
|
||
|
*------------------------------------*/
|
||
|
#respond .comment-form-author,
|
||
|
#respond .comment-form-email,
|
||
|
#respond .comment-form-url { float: right; }
|
||
|
#respond .comment-form-author { padding-left: 10px; padding-right: 0; }
|
||
|
#respond .comment-form-url { padding-right: 10px; padding-left: 0; }
|
||
|
#respond .form-submit { float: left; }
|
||
|
#comments ol.children { margin-right: 30px; margin-left: 0; }
|
||
|
.comment-body img { float: right; margin-left: 30px; margin-right: 0; }
|
||
|
.comment-author .comment-link { float: right; }
|
||
|
.comment-author .comment-meta { float: left; text-align: left; }
|
||
|
.comment-author .comment-meta .comment-reply-link,
|
||
|
.comment-author .comment-meta .comment-edit-link { margin-right: 15px; margin-left: 0; }
|
||
|
#respond #cancel-comment-reply-link { float: left; }
|
||
|
span.required { margin-right: 3px; margin-left: 0; }
|
||
|
.no-comments { text-align: left; }
|
||
|
.no-comments i { margin-left: 8px; margin-right: 0; }
|
||
|
.comment-navigation .nav-links .nav-previous { float: right; margin-left: 1.5em; margin-right: 0; }
|
||
|
.comment-navigation .nav-links .nav-previous i { margin-left: 5px; margin-right: 0; }
|
||
|
.comment-navigation .nav-links .nav-next { float: left; margin-left: 1.5em; margin-right: 0; }
|
||
|
.comment-navigation .nav-links .nav-next i { margin-right: 5px; margin-left: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Widgets
|
||
|
*------------------------------------*/
|
||
|
.widget-title { border-width: 0 3px 0 0; padding-right: 15px; padding-left: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Pagination
|
||
|
*------------------------------------*/
|
||
|
ul.page-numbers { text-align: left; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Search Results
|
||
|
*------------------------------------*/
|
||
|
.search-results article .thumbnail { margin-left: 20px; margin-right: 0; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Modal
|
||
|
*------------------------------------*/
|
||
|
.oceanwp-modal .oceanwp-close-modal { left: 0; right: auto; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Footer
|
||
|
*------------------------------------*/
|
||
|
#footer-bottom #copyright { float: right; text-align: right; padding-left: 15px; padding-right: 0; }
|
||
|
#footer-bottom #footer-bottom-menu { float: left; text-align: left; padding-right: 15px; padding-left: 0; }
|
||
|
#footer-bottom #footer-bottom-menu li { float: right; }
|
||
|
#scroll-top { left: 20px; right: auto; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
Responsive
|
||
|
*------------------------------------*/
|
||
|
.oceanwp-mobile-menu-icon.mobile-right { float: left; }
|
||
|
.oceanwp-mobile-menu-icon.mobile-left { float: right; }
|
||
|
.oceanwp-mobile-menu-icon a { padding-right: 15px; padding-left: 0; }
|
||
|
.oceanwp-mobile-menu-icon a:first-child { padding-right: 0; }
|
||
|
.oceanwp-mobile-menu-icon a.mobile-menu .oceanwp-text,
|
||
|
.oceanwp-mobile-menu-icon a.mobile-menu .oceanwp-close-text { padding-right: 6px; padding-left: 0 !important; }
|
||
|
|
||
|
/*------------------------------------*
|
||
|
All Devices under 1280px
|
||
|
*------------------------------------*/
|
||
|
@media only screen and (max-width: 1280px) {
|
||
|
body.vertical-header-style.left-header #site-header.vertical-header { right: -266px; left: auto; }
|
||
|
body.vertical-header-style.left-header #outer-wrap { margin-right: 34px; margin-left: 0; }
|
||
|
body.vertical-header-style.right-header #site-header.vertical-header { left: -266px; right: auto; }
|
||
|
body.vertical-header-style.right-header #outer-wrap { margin-left: 34px; margin-right: 0; }
|
||
|
body.vertical-header-style.vh-opened.left-header #site-header.vertical-header { right: 0; left: auto; }
|
||
|
body.vertical-header-style.vh-opened.right-header #site-header.vertical-header { left: 0; right: auto; }
|
||
|
body.vertical-header-style.vh-opened #site-header.vertical-header #site-navigation-wrap { padding-left: 0; }
|
||
|
#site-header.vertical-header #site-navigation-wrap { padding-left: 34px; padding-right: 0; }
|
||
|
}
|
||
|
|
||
|
/*------------------------------------*
|
||
|
All Devices under 960px
|
||
|
*------------------------------------*/
|
||
|
@media only screen and (max-width: 959px) {
|
||
|
|
||
|
/* Separate layout */
|
||
|
.separate-layout .widget-area.sidebar-primary { padding-right: 0; }
|
||
|
|
||
|
}
|
||
|
|
||
|
/*------------------------------------*
|
||
|
All Devices under 767px
|
||
|
*------------------------------------*/
|
||
|
@media only screen and (max-width: 767px) {
|
||
|
#respond .comment-form-author,
|
||
|
#respond .comment-form-email,
|
||
|
#respond .comment-form-url {
|
||
|
float: none;
|
||
|
padding: 0;
|
||
|
}
|
||
|
}
|