Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[4.0][RTL] CSS logical properties initial #28589

Merged
merged 7 commits into from
Apr 8, 2020
Merged

[4.0][RTL] CSS logical properties initial #28589

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d0b6101
[4.0][RTL] CSS logical properties init
ciar4n Apr 6, 2020
9cba3ac
Update _modals.scss
ciar4n Apr 6, 2020
6b264dd
use margin-inline
ciar4n Apr 6, 2020
eb0d8bb
Update _modals.scss
ciar4n Apr 7, 2020
570d447
Revert "Update _modals.scss"
ciar4n Apr 7, 2020
9c5a697
Revert "use margin-inline"
ciar4n Apr 7, 2020
69948e4
Merge branch '4.0-dev' of https://github.com/joomla/joomla-cms into l…
ciar4n Apr 8, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 1 addition & 8 deletions administrator/templates/atum/scss/blocks/_form.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -132,14 +132,7 @@ legend {
color: $white;
background: $black;
border-radius: .2rem;

[dir=ltr] & {
text-align: left;
}

[dir=rtl] & {
text-align: right;
}
text-align: start;
}

// reveal associated tooltip on focus
Expand Down
5 changes: 3 additions & 2 deletions administrator/templates/atum/scss/blocks/_global.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,10 @@ html {
body {
min-height: 100%;
display: flex;
flex-direction: column;
padding: 0;
margin: 0;
flex-direction: column;
text-align: start;

&.monochrome {
filter: grayscale(1);
Expand Down Expand Up @@ -163,7 +164,7 @@ body .container-main {

// Quickicon specific
.message-alert {
text-align: right !important;
text-align: end !important;
}

// dashboard items
Expand Down
4 changes: 2 additions & 2 deletions administrator/templates/atum/scss/blocks/_header.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@
img {
max-width: calc(18rem - .8rem);
max-height: 1.3rem;
margin-left: .8rem;
margin-inline-start: .8rem;

&.logo-small {
display: none;
Expand All @@ -85,7 +85,7 @@
white-space: nowrap;

[class^='icon-'] {
margin-right: .625rem;
margin-inline-end: .625rem;
font-size: 1rem;
}
}
Expand Down
24 changes: 7 additions & 17 deletions administrator/templates/atum/scss/blocks/_modals.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,6 @@
background: var(--white);
border-color: var(--whiteoffset);
box-shadow: 1px 1px 1px 0 rgba(0, 0, 0, .25);


}

.btn-primary:not([href]),
Expand All @@ -22,8 +20,6 @@
color: var(--atum-text-dark);
background: var(--white);
border: 1px solid var(--atum-text-dark);


}

.btn-primary:not([href]) {
Expand Down Expand Up @@ -66,14 +62,11 @@
display: inline-block;
width: 2.375rem;
height: 100%;
margin: 0 16px 0 -22px;
margin: 0 16px;
ciar4n marked this conversation as resolved.
Show resolved Hide resolved
margin-inline-start: -22px;
line-height: 2.375rem;
color: hsla(0, 0%, 100%, .9);
background-color: var(--danger);

[dir=rtl] & {
margin: 0 -22px 0 16px;
}
}

.btn.btn-success [class*=" fa-"],
Expand All @@ -84,14 +77,11 @@
display: inline-block;
width: 2.375rem;
height: 100%;
margin: 0 16px 0 -22px;
margin: 0 16px;
margin-inline-start: -22px;
line-height: 2.375rem;
color: hsla(0, 0%, 100%, .9);
background-color: var(--success);

[dir=rtl] & {
margin: 0 -22px 0 16px;
}
}
}

Expand Down Expand Up @@ -124,7 +114,7 @@

// Changelog
.changelog {
text-align: left !important;
text-align: start !important;

&__item {
display: flex;
Expand All @@ -139,7 +129,7 @@
flex: 1 0 180px;
max-width: 180px;
padding: 10px 15px;
text-align: right;
text-align: end;
background: darken($gray-100, 2.5%);
border-right: 1px solid $table-border-color;

Expand All @@ -164,7 +154,7 @@
padding: 10px 15px;

ul {
padding-left: 15px;
padding-inline-start: 15px;
margin-bottom: 0;
}

Expand Down
80 changes: 19 additions & 61 deletions administrator/templates/atum/scss/blocks/_sidebar.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@
}

.open {
box-shadow: inset 0 0 100px var(--atum-bg-light);
box-shadow: inset 0 0 100px var(--atum-bg-light);
}

// All list items
Expand All @@ -129,7 +129,6 @@
span.fas {
transform: scale(1.3);
}

}

.menu-dashboard,
Expand All @@ -151,7 +150,6 @@

&:hover,
&.mm-active {

// invert colors
color: var(--atum-link-color);
background-color: var(--atum-sidebar-bg);
Expand All @@ -169,12 +167,10 @@
}

li {

.menu-dashboard,
.menu-quicktask {
> a {
&.mm-active {

&::before {
display: none;
}
Expand All @@ -185,12 +181,12 @@
}

span.fas {
padding: .9rem 0;
padding: 0.9rem 0;
}

.sidebar-item-title {
display: inline-block;
padding: .6rem 0;
padding: 0.6rem 0;
word-break: break-word;
}

Expand All @@ -208,9 +204,8 @@

// 1st level items
> li {

> a {
padding: 0 .35rem;
padding: 0 0.35rem;

&:hover {
color: var(--atum-text-light);
Expand All @@ -219,7 +214,6 @@
}

&.mm-active {

color: var(--atum-link-color);
&:hover {
color: var(--atum-text-light);
Expand All @@ -232,10 +226,8 @@
&:hover {
color: var(--atum-text-light);
}

}
}

}

// 2nd level items
Expand All @@ -249,23 +241,19 @@
border: 0;

&.mm-active {

> a {
color: var(--atum-link-color);
}
}

> a {
padding: 0 1rem 0 2.4rem;

[dir=rtl] & {
padding: 0 2.4rem 0 1rem;
}
padding: 0 1rem;
padding-inline-start: 2.4rem;
}
}

a {
font-size: .9rem;
font-size: 0.9rem;

&[href]:hover:not(.menu-dashboard):not(.menu-quicktask) {
color: $white;
Expand All @@ -276,7 +264,6 @@
color: $white;
background-color: var(--atum-sidebar-link-color);


&::before {
position: absolute;
top: .15rem;
Expand All @@ -298,21 +285,12 @@

// 3rd level items
ul {
li { border-bottom: 1px solid var(--atum-bg-light);
}
li {
border-bottom: 1px solid var(--atum-bg-light);
}

a {


[dir=ltr] & {
padding-left: 3rem;
}

[dir=rtl] & {
padding-right: 3rem;
}


padding-inline-start: 3rem;
}

a::before {
Expand All @@ -330,7 +308,6 @@
background-color: var(--atum-bg-dark-90);
}
}

}

.divider,
Expand All @@ -346,27 +323,20 @@
height: 1px;
margin: 4px 18px;
background-color: $bluegray;
opacity: .7;
opacity: 0.7;
}

.menuitem-group {
margin-top: .65rem;
font-size: .75rem;

[dir=ltr] & {
padding-left: 2.4rem;
}

[dir=rtl] & {
padding-right: 2.4rem;
}
margin-top: 0.65rem;
font-size: 0.75rem;
padding-inline-start: 2.4rem;
}

.home-image {
padding: 0;

&.fa-star {
padding: .8rem 0;
padding: 0.8rem 0;
}
}

Expand All @@ -391,13 +361,7 @@
// Dropdown indicator
.has-arrow {
.sidebar-item-title {
[dir=ltr] & {
margin-right: auto;
}

[dir=rtl] & {
margin-left: auto;
}
margin-inline-end: auto;
}

&:hover::after {
Expand All @@ -413,11 +377,11 @@
font-weight: 900;
color: var(--atum-sidebar-font-color);

[dir=ltr] & {
[dir="ltr"] & {
content: "\f054";
}

[dir=rtl] & {
[dir="rtl"] & {
content: "\f053";
}
}
Expand All @@ -443,7 +407,6 @@
font-size: .9rem;
text-align: center;
vertical-align: top;

}

.badge {
Expand All @@ -464,12 +427,10 @@

// Sidebar Closed
.closed {

.sidebar-wrapper {
flex: 1 0 $sidebar-width-closed;
max-width: $sidebar-width-closed;


&.transit-wider-closed {
flex: 1 0 33%;
max-width: $sidebar-width-login;
Expand All @@ -488,9 +449,7 @@
background-color: var(--atum-sidebar-link-color);
}


.main-nav {

> li > ul {
height: 0;
padding: 0;
Expand Down Expand Up @@ -564,7 +523,6 @@

#sidebarmenu {
overflow-y: scroll;

}
}

Expand Down