Discource-C
/
DiscoTOC
mirror of https://github.com/discourse/DiscoTOC.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

RTL style tweaks

This commit is contained in:
Joe 2019-03-09 11:01:21 +08:00 committed by GitHub
parent 43402b506f
commit e3128161ae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 27 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
common/common.scss
View File

@ -149,14 +149,14 @@
} }
} }
.d-toc-anchor-link { .d-toc-anchor-link {
font-size: initial;
color: $primary-medium;
.ltr & { .ltr & {
margin-left: 5px; margin-left: 5px;
} }
.rtl & { .rtl & {
margin-right: 5px; margin-right: 5px;
} }
font-size: initial;
color: $primary-medium;
} }
} }
@ -178,12 +178,7 @@
max-height: 85vh; max-height: 85vh;
padding-left: 0; padding-left: 0;
margin-top: 50px; margin-top: 50px;
.ltr & {
margin-left: -1px;
}
.rtl & {
margin-right: -1px;
}
position: sticky; position: sticky;
top: 75px; top: 75px;
margin-bottom: 135px; margin-bottom: 135px;
@ -192,6 +187,12 @@
overflow-x: hidden; overflow-x: hidden;
align-self: flex-start; align-self: flex-start;
flex: 1 1 auto; flex: 1 1 auto;
.ltr & {
margin-left: -1px;
}
.rtl & {
margin-right: -1px;
}
} }
.d-toc-article { .d-toc-article {
display: flex; display: flex;
@ -224,7 +225,7 @@
position: fixed; position: fixed;
right: 0; right: 0;
top: 0; top: 0;
margin-left: -1px;
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
max-width: 500px; max-width: 500px;
@ -232,6 +233,12 @@
transition: transform 0.5s, opacity 0.25s; transition: transform 0.5s, opacity 0.25s;
transform: translatex(100%); transform: translatex(100%);
opacity: 0; opacity: 0;
.ltr & {
margin-left: -1px;
}
.rtl & {
margin-right: -1px;
}
&.d-toc-mobile { &.d-toc-mobile {
transform: translatex(0); transform: translatex(0);
opacity: 1; opacity: 1;
@ -251,32 +258,33 @@
height: 3em; height: 3em;
background: $secondary; background: $secondary;
.ltr & {
padding-right: 1em;
}
.rtl & {
padding-left: 1em;
}
margin-bottom: 1em; margin-bottom: 1em;
position: sticky; position: sticky;
top: 0; top: 0;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
.ltr & {
padding-right: 1em;
}
.rtl & {
padding-left: 1em;
}
} }
.d-toc-toggle { .d-toc-toggle {
position: fixed; position: fixed;
bottom: 5px; bottom: 5px;
padding: 0.5em 1em;
background: $tertiary;
color: $secondary;
z-index: 3;
.ltr & { .ltr & {
right: 16px; right: 16px;
} }
.rtl & { .rtl & {
left: 16px; left: 16px;
} }
padding: 0.5em 1em;
background: $tertiary;
color: $secondary;
z-index: 3;
} }
#d-toc > ul { #d-toc > ul {
.ltr & { .ltr & {