Skip to content

Commit 7de4488

Browse files
ahangarhaahangarha
committed
Use logical properties in css
Signed-off-by: Mostafa Ahangarha <[email protected]>
1 parent 165a2ff commit 7de4488

File tree

9 files changed

+36
-24
lines changed

9 files changed

+36
-24
lines changed

‎css/notes.css‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,20 +28,28 @@ li:focus .app-navigation-entry__utils .action-item {
2828

2929
/* Welcome / Help */
3030
.feature {
31-
background-position: left center;
31+
background-position-y: center;
3232
width: 100%;
3333
min-height: 32px;
3434
line-height: 32px;
35-
padding-left: 32px;
35+
padding-inline-start: 32px;
3636
margin-top: 0.3em !important;
3737
margin-bottom: 0.3em !important;
3838
display: inline-block;
3939
vertical-align: middle;
4040
}
4141

42+
body[dir='ltr'] .feature {
43+
background-position-x: left;
44+
}
45+
46+
body[dir='rtl'] .feature {
47+
background-position-x: right;
48+
}
49+
4250
.feature ul {
4351
list-style: circle outside;
44-
padding-left: 2em;
52+
padding-inline-start: 2em;
4553
}
4654

4755

@@ -66,6 +74,6 @@ li:focus .app-navigation-entry__utils .action-item {
6674
}
6775

6876
.app-content {
69-
margin-left: 0 !important;
77+
margin-inline-start: 0 !important;
7078
}
7179
}

‎src/App.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -317,9 +317,9 @@ export default {
317317
padding-top: 0 !important;
318318
// Prevent shrinking or growing
319319
flex: 0 0 auto;
320-
padding-right: 3px;
320+
padding-inline-end: 3px;
321321
padding-bottom: 3px;
322-
padding-left: 3px;
322+
padding-inline-start: 3px;
323323
margin: 0 3px;
324324
}
325325
</style>

‎src/components/EditorEasyMDE.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@ export default {
354354
border-radius: var(--border-radius);
355355
background-position: center;
356356
margin-top: 5px;
357-
margin-left: 2px;
357+
margin-inline-start: 2px;
358358
}
359359
360360
.CodeMirror .cm-formatting-task.cm-property::before {
@@ -370,10 +370,10 @@ export default {
370370
371371
.upload-button {
372372
position: fixed;
373-
right: 64px;
373+
inset-inline-end: 64px;
374374
z-index: 10;
375375
height: 40px;
376-
margin-right: 5px;
376+
margin-inline-end: 5px;
377377
top: 65px;
378378
}
379379
</style>

‎src/components/EditorMarkdownIt.vue‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -196,7 +196,7 @@ export default {
196196
}
197197
198198
& ul, & ol {
199-
margin-left: 3ex;
199+
margin-inline-start: 3ex;
200200
}
201201
202202
& li > p, & li > ul, & li > ol {
@@ -220,8 +220,8 @@ export default {
220220
221221
& blockquote {
222222
font-style: italic;
223-
border-left: 4px solid var(--color-border);
224-
padding-left: 2ex;
223+
border-inline-start: 4px solid var(--color-border);
224+
padding-inline-start: 2ex;
225225
color: var(--color-text-light)
226226
}
227227
@@ -263,8 +263,8 @@ export default {
263263
.download-icon-inner {
264264
height: 3em;
265265
width: auto;
266-
margin-left: auto;
267-
margin-right: auto;
266+
margin-inline-start: auto;
267+
margin-inline-end: auto;
268268
margin-bottom: 5px;
269269
}
270270
@@ -281,7 +281,7 @@ export default {
281281
282282
& table td, & table th {
283283
padding: 0.35em 0.5em;
284-
text-align: left;
284+
text-align: start;
285285
border: 1px solid var(--color-border);
286286
}
287287

‎src/components/HelpMobile.vue‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,15 +56,19 @@ export default {
5656
<style scoped>
5757
.badge-wrapper {
5858
margin-top: 2em;
59-
margin-left: 2em;
59+
margin-inline-start: 2em;
6060
width: 100%;
6161
clear:both;
6262
}
6363
64-
.badge {
64+
body[dir='ltr'] .badge {
6565
float: left;
6666
}
6767
68+
body[dir='rtl'] .badge {
69+
float: right;
70+
}
71+
6872
.appstore-badge {
6973
height: 72px;
7074
box-sizing: border-box;

‎src/components/Modal/EditorHint.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ export default {
6666
margin-top: 24px;
6767
6868
button {
69-
margin-left: 12px;
69+
margin-inline-start: 12px;
7070
}
7171
}
7272
</style>

‎src/components/NotePlain.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -438,9 +438,9 @@ export default {
438438
margin: 0 auto;
439439
}
440440
.note-container {
441-
padding-right: 250px;
441+
padding-inline-end: 250px;
442442
transition-duration: var(--animation-quick);
443-
transition-property: padding-right;
443+
transition-property: padding-inline-end;
444444
}
445445
}
446446
@@ -467,7 +467,7 @@ export default {
467467
.action-buttons {
468468
position: fixed;
469469
top: 50px;
470-
right: 20px;
470+
inset-inline-end: 20px;
471471
width: 44px;
472472
margin-top: 1em;
473473
z-index: 2000;

‎src/components/NoteRich.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -196,7 +196,7 @@ export default {
196196
197197
.is-mobile:deep(.text-menubar) {
198198
// Avoid overlapping the navigation toggle
199-
margin-left: 44px;
199+
margin-inline-start: 44px;
200200
z-index: 1;
201201
}
202202
</style>

‎src/components/NotesView.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -227,7 +227,7 @@ export default {
227227
228228
.content-list__search {
229229
padding: 4px;
230-
padding-left: 50px;
230+
padding-inline-start: 50px;
231231
position: sticky;
232232
top: 0;
233233
background-color: var(--color-main-background-translucent);
@@ -268,6 +268,6 @@ export default {
268268
border: 2px solid var(--color-loading-light);
269269
border-top-color: var(--color-loading-dark);
270270
vertical-align: top;
271-
margin-right: 5px;
271+
margin-inline-end: 5px;
272272
}
273273
</style>

0 commit comments

Comments
 (0)