gab-social/app/javascript/styles/gabsocial/rtl.scss

347 lines
6.6 KiB
SCSS
Raw Normal View History

2019-07-02 08:10:25 +01:00
body.rtl {
direction: rtl;
2019-09-17 00:31:30 +01:00
.column-header>button {
2019-07-02 08:10:25 +01:00
text-align: right;
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0, 15px);
2019-07-02 08:10:25 +01:00
}
.landing-page__logo {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(20px, 0);
2019-07-02 08:10:25 +01:00
}
.landing-page .features-list .features-list__row .visual {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 15px);
2019-07-02 08:10:25 +01:00
}
.column-link__icon,
.column-header__icon {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 5px);
2019-07-02 08:10:25 +01:00
}
.compose-form .compose-form__buttons-wrapper .character-counter__wrapper {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(4px, 0);
2019-07-02 08:10:25 +01:00
}
.navigation-bar__profile {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 8px);
2019-07-02 08:10:25 +01:00
}
.search__input {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(30px, 10px);
2019-07-02 08:10:25 +01:00
}
.search__icon .fa {
right: auto;
left: 10px;
}
.column-header__buttons {
left: 0;
right: auto;
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, -15px);
2019-07-02 08:10:25 +01:00
}
.column-inline-form .icon-button {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 5px);
2019-07-02 08:10:25 +01:00
}
.column-header__links .text-btn {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(10px, 0);
2019-07-02 08:10:25 +01:00
}
.account__avatar-wrapper {
float: right;
}
.column-header__back-button {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(5px, 0);
2019-07-02 08:10:25 +01:00
}
.column-header__setting-arrows {
float: left;
}
.setting-toggle__label {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 8px);
2019-07-02 08:10:25 +01:00
}
.status__avatar {
left: auto;
right: 10px;
}
.status,
.activity-stream .status.light {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(10px, 68px);
2019-07-02 08:10:25 +01:00
}
.status__info .status__display-name,
.activity-stream .status.light .status__display-name {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(25px, 0);
2019-07-02 08:10:25 +01:00
}
.activity-stream .pre-header {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0, 68px);
2019-07-02 08:10:25 +01:00
}
.status__prepend {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 68px);
2019-07-02 08:10:25 +01:00
}
.status__prepend-icon-wrapper {
left: auto;
right: -26px;
}
.activity-stream .pre-header .pre-header__icon {
left: auto;
right: 42px;
}
.account__avatar-overlay-overlay {
right: auto;
left: 0;
}
2019-09-17 00:31:30 +01:00
.column-back-button--slim {
2019-07-02 08:10:25 +01:00
right: auto;
left: 0;
}
.status__relative-time,
.activity-stream .status.light .status__header .status__meta {
float: left;
}
.status__action-bar {
&__counter {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(11px, 0);
2019-07-02 08:10:25 +01:00
.status__action-bar-button {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(4px, 0);
2019-07-02 08:10:25 +01:00
}
}
}
.status__action-bar-button {
float: right;
2019-09-17 00:31:30 +01:00
@include horizontal-margin(18px, 0);
2019-07-02 08:10:25 +01:00
}
.status__action-bar-dropdown {
float: right;
}
.privacy-dropdown__dropdown {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 40px);
2019-07-02 08:10:25 +01:00
}
.privacy-dropdown__option__icon {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(10px, 0);
2019-07-02 08:10:25 +01:00
}
.detailed-status__display-name .display-name {
text-align: right;
}
.detailed-status__display-avatar {
float: right;
2019-09-17 00:31:30 +01:00
@include horizontal-margin(10px, 0);
2019-07-02 08:10:25 +01:00
}
.detailed-status__favorites,
2020-03-04 22:50:15 +00:00
.detailed-status__reposts {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 6px);
2019-07-02 08:10:25 +01:00
}
.fa-ul {
margin-left: 0;
margin-left: 2.14285714em;
}
.fa-li {
left: auto;
right: -2.14285714em;
}
.admin-wrapper {
direction: rtl;
}
.admin-wrapper .sidebar ul a i.fa,
a.table-action-link i.fa {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(5px, 0);
2019-07-02 08:10:25 +01:00
}
.simple_form .check_boxes .checkbox label {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0, 25px);
2019-07-02 08:10:25 +01:00
}
.simple_form .input.with_label.boolean label.checkbox {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(25px, 0);
2019-07-02 08:10:25 +01:00
}
.simple_form .check_boxes .checkbox input[type="checkbox"],
.simple_form .input.boolean input[type="checkbox"] {
left: auto;
right: 0;
}
.simple_form .input.radio_buttons .radio {
left: auto;
right: 0;
}
2019-09-17 00:31:30 +01:00
.simple_form .input.radio_buttons .radio>label {
@include horizontal-padding(0, 28px);
2019-07-02 08:10:25 +01:00
}
.simple_form .input-with-append .input input {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(142px, 0);
2019-07-02 08:10:25 +01:00
}
.simple_form .input.boolean label.checkbox {
left: auto;
right: 0;
}
.simple_form .input.boolean .label_input,
.simple_form .input.boolean .hint {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0, 28px);
2019-07-02 08:10:25 +01:00
}
.simple_form .label_input__append {
right: auto;
left: 3px;
&::after {
right: auto;
left: 0;
background-image: linear-gradient(to left, rgba(darken($ui-base-color, 10%), 0), darken($ui-base-color, 10%));
}
}
.simple_form select {
background: darken($ui-base-color, 10%) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 12%))}'/></svg>") no-repeat left 8px center / auto 16px;
}
.table th,
.table td {
text-align: right;
}
.filters .filter-subset {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(45px, 0);
2019-07-02 08:10:25 +01:00
}
.landing-page .header-wrapper .mascot {
right: 60px;
left: auto;
}
.landing-page__call-to-action .row__information-board {
direction: rtl;
}
.landing-page .header .hero .floats .float-1 {
left: -120px;
right: auto;
}
.landing-page .header .hero .floats .float-2 {
left: 210px;
right: auto;
}
.landing-page .header .hero .floats .float-3 {
left: 110px;
right: auto;
}
.landing-page .header .links .brand img {
left: 0;
}
.landing-page .fa-external-link {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0 !important, 5px);
2019-07-02 08:10:25 +01:00
}
.landing-page .features #gabsocial-timeline {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(30px, 0);
2019-07-02 08:10:25 +01:00
}
@media screen and (min-width: 631px) {
2019-09-17 00:31:30 +01:00
2019-07-02 08:10:25 +01:00
.column,
.drawer {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(5px);
2019-07-02 08:10:25 +01:00
&:first-child {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(5px, 10px);
2019-07-02 08:10:25 +01:00
}
}
2019-09-17 00:31:30 +01:00
.columns-area>div {
2019-07-02 08:10:25 +01:00
.column,
.drawer {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(5px);
2019-07-02 08:10:25 +01:00
}
}
}
.public-layout {
.header {
.nav-button {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(8px, 0);
2019-07-02 08:10:25 +01:00
}
}
.public-account-header__tabs {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 20px);
2019-07-02 08:10:25 +01:00
}
}
.landing-page__information {
.account__display-name {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(5px, 0);
2019-07-02 08:10:25 +01:00
}
.account__avatar-wrapper {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(12px, 0);
2019-07-02 08:10:25 +01:00
}
}
.card__bar .display-name {
text-align: right;
2019-09-17 00:31:30 +01:00
@include horizontal-margin(0, 15px);
2019-07-02 08:10:25 +01:00
}
.fa-chevron-left::before {
content: "\F054";
}
.fa-chevron-right::before {
content: "\F053";
}
.column-back-button__icon {
2019-09-17 00:31:30 +01:00
@include horizontal-margin(5px, 0);
2019-07-02 08:10:25 +01:00
}
.column-header__setting-arrows .column-header__setting-btn:last-child {
2019-09-17 00:31:30 +01:00
@include horizontal-padding(0, 10px);
2019-07-02 08:10:25 +01:00
}
2019-09-17 00:31:30 +01:00
.simple_form .input.radio_buttons .radio>label input {
2019-07-02 08:10:25 +01:00
left: auto;
right: 0;
}
2019-09-17 00:31:30 +01:00
}