Skip to content

Commit 7fe763c

Browse files
authored
Merge pull request #14 from ladybirdweb/feature-rtl-support
Feature:: RTL Support
2 parents b2407ae + 310a7fd commit 7fe763c

36 files changed

+20991
-978
lines changed

HTML/404.html

Lines changed: 128 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,18 +18,18 @@
1818
<link rel="shortcut icon" href="assets/ico/favicon.png">
1919

2020
<!-- Styles -->
21-
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />
22-
<link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />
23-
<link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />
24-
<link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />
25-
<link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />
21+
<!-- <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />-->
22+
<!-- <link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />-->
23+
<!-- <link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />-->
24+
<!-- <link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />-->
25+
<!-- <link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />-->
2626
<!--[if lt IE 9]>
2727
<script type="text/javascript" src="assets/app/js/html5shiv.min.js"></script>
2828
<script type="text/javascript" src="assets/app/js/respond.min.js"></script>
2929
<![endif]-->
3030
</head>
3131

32-
<body>
32+
<body style="display: none">
3333

3434
<div id="page" class="hfeed site">
3535
<header id="masthead" class="site-header" role="banner">
@@ -95,6 +95,25 @@
9595
<a href="#" class="nav-link collapsed" data-toggle="collapse" data-target="#login-form">Login <i class="sub-indicator fa fa-chevron-circle-down fa-fw text-muted"></i>
9696
</a>
9797
</li>
98+
99+
<li class="nav-item dropdown">
100+
101+
<a class="dropdown-toggle nav-link" href="#" id="navbarDropdownlang" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
102+
103+
<img id="flagIcon" src="./assets/img/en.png" alt="no">
104+
</a>
105+
106+
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
107+
108+
<li><a class="dropdown-item" href="404.html?lang=ar" id="arabicOption">
109+
<img src="./assets/img/ar.png" alt="Img"> Arabic
110+
</a></li>
111+
112+
<li><a class="dropdown-item" href="404.html?lang=en" id="englishOption">
113+
<img src="./assets/img/en.png" alt="Img"> English
114+
</a></li>
115+
</ul>
116+
</li>
98117
</ul><!-- .navbar-menu -->
99118

100119
<span class="switcher-toggle desk_none" onclick="myFunction()">
@@ -385,5 +404,108 @@ <h2 class="section-title h4 clearfix">Get Updates <i class="line"></i></h2>
385404
<script type="text/javascript" src="assets/app/js/autocomplete.js"></script>
386405
<script type="text/javascript" src="assets/app/js/app.js"></script>
387406

407+
<script async>
408+
409+
let normalCSS = [
410+
{
411+
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.min.css'
412+
},
413+
{
414+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/app.css',
415+
},
416+
{
417+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/edit.css',
418+
},
419+
{
420+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/custom.css',
421+
},
422+
{
423+
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
424+
}
425+
// Add more objects for additional links
426+
];
427+
428+
let rtlCSS = [
429+
{
430+
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.rtl.min.css'
431+
},
432+
{
433+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/app.css',
434+
},
435+
{
436+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/edit.css',
437+
},
438+
{
439+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/custom.css',
440+
},
441+
{
442+
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
443+
}
444+
// Add more objects for additional links
445+
];
446+
447+
const urlParams = new URLSearchParams(window.location.search);
448+
449+
const body = document.body;
450+
451+
const flagIcon = document.getElementById('flagIcon');
452+
453+
if(urlParams.get('lang') && urlParams.get('lang') === 'ar') {
454+
455+
var existingLinks = document.querySelectorAll('link[rel="stylesheet"]');
456+
existingLinks.forEach(function (link) {
457+
link.parentNode.removeChild(link);
458+
});
459+
460+
flagIcon.src = './assets/img/ar.png';
461+
462+
flagIcon.alt = 'Arabic';
463+
464+
body.setAttribute('dir', 'rtl');
465+
466+
rtlCSS.forEach(function (linkData) {
467+
var link = document.createElement('link');
468+
link.rel = linkData.rel;
469+
link.type = linkData.type;
470+
link.href = linkData.href;
471+
// Append the link element to the document's head
472+
document.head.appendChild(link);
473+
});
474+
475+
setTimeout(()=>{
476+
477+
body.style.display = 'block';
478+
479+
},1000)
480+
481+
} else {
482+
483+
var existingLinks1 = document.querySelectorAll('link[rel="stylesheet"]');
484+
existingLinks1.forEach(function (link) {
485+
link.parentNode.removeChild(link);
486+
});
487+
488+
flagIcon.src = './assets/img/en.png';
489+
490+
flagIcon.alt = 'English';
491+
492+
body.removeAttribute('dir');
493+
494+
normalCSS.forEach(function (linkData) {
495+
var link = document.createElement('link');
496+
link.rel = linkData.rel;
497+
link.type = linkData.type;
498+
link.href = linkData.href;
499+
// Append the link element to the document's head
500+
document.head.appendChild(link);
501+
});
502+
503+
setTimeout(()=>{
504+
505+
body.style.display = 'block';
506+
507+
},1000)
508+
}
509+
</script>
388510
</body>
389511
</html>

HTML/archive.html

Lines changed: 129 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,18 +18,18 @@
1818
<link rel="shortcut icon" href="assets/ico/favicon.png">
1919

2020
<!-- Styles -->
21-
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />
22-
<link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />
23-
<link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />
24-
<link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />
25-
<link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />
21+
<!-- <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />-->
22+
<!-- <link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />-->
23+
<!-- <link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />-->
24+
<!-- <link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />-->
25+
<!-- <link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />-->
2626
<!--[if lt IE 9]>
2727
<script type="text/javascript" src="assets/app/js/html5shiv.min.js"></script>
2828
<script type="text/javascript" src="assets/app/js/respond.min.js"></script>
2929
<![endif]-->
3030
</head>
3131

32-
<body>
32+
<body style="display: none">
3333

3434
<div id="page" class="hfeed site">
3535
<header id="masthead" class="site-header" role="banner">
@@ -95,6 +95,25 @@
9595
<a href="#" class="nav-link collapsed" data-toggle="collapse" data-target="#login-form">Login <i class="sub-indicator fa fa-chevron-circle-down fa-fw text-muted"></i>
9696
</a>
9797
</li>
98+
99+
<li class="nav-item dropdown">
100+
101+
<a class="dropdown-toggle nav-link" href="#" id="navbarDropdownlang" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
102+
103+
<img id="flagIcon" src="./assets/img/en.png" alt="no">
104+
</a>
105+
106+
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
107+
108+
<li><a class="dropdown-item" href="archive.html?lang=ar" id="arabicOption">
109+
<img src="./assets/img/ar.png" alt="Img"> Arabic
110+
</a></li>
111+
112+
<li><a class="dropdown-item" href="archive.html?lang=en" id="englishOption">
113+
<img src="./assets/img/en.png" alt="Img"> English
114+
</a></li>
115+
</ul>
116+
</li>
98117
</ul><!-- .navbar-menu -->
99118

100119
<span class="switcher-toggle desk_none" onclick="myFunction()">
@@ -586,5 +605,109 @@ <h2 class="section-title h4 clearfix">Get Updates <i class="line"></i></h2>
586605
<script type="text/javascript" src="assets/app/js/autocomplete.js"></script>
587606
<script type="text/javascript" src="assets/app/js/app.js"></script>
588607

608+
<script async>
609+
610+
let normalCSS = [
611+
{
612+
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.min.css'
613+
},
614+
{
615+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/app.css',
616+
},
617+
{
618+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/edit.css',
619+
},
620+
{
621+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/custom.css',
622+
},
623+
{
624+
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
625+
}
626+
// Add more objects for additional links
627+
];
628+
629+
let rtlCSS = [
630+
{
631+
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.rtl.min.css'
632+
},
633+
{
634+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/app.css',
635+
},
636+
{
637+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/edit.css',
638+
},
639+
{
640+
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/custom.css',
641+
},
642+
{
643+
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
644+
}
645+
// Add more objects for additional links
646+
];
647+
648+
const urlParams = new URLSearchParams(window.location.search);
649+
650+
const body = document.body;
651+
652+
const flagIcon = document.getElementById('flagIcon');
653+
654+
if(urlParams.get('lang') && urlParams.get('lang') === 'ar') {
655+
656+
var existingLinks = document.querySelectorAll('link[rel="stylesheet"]');
657+
existingLinks.forEach(function (link) {
658+
link.parentNode.removeChild(link);
659+
});
660+
661+
flagIcon.src = './assets/img/ar.png';
662+
663+
flagIcon.alt = 'Arabic';
664+
665+
body.setAttribute('dir', 'rtl');
666+
667+
rtlCSS.forEach(function (linkData) {
668+
var link = document.createElement('link');
669+
link.rel = linkData.rel;
670+
link.type = linkData.type;
671+
link.href = linkData.href;
672+
// Append the link element to the document's head
673+
document.head.appendChild(link);
674+
});
675+
676+
setTimeout(()=>{
677+
678+
body.style.display = 'block';
679+
680+
},1000)
681+
682+
} else {
683+
684+
var existingLinks1 = document.querySelectorAll('link[rel="stylesheet"]');
685+
existingLinks1.forEach(function (link) {
686+
link.parentNode.removeChild(link);
687+
});
688+
689+
flagIcon.src = './assets/img/en.png';
690+
691+
flagIcon.alt = 'English';
692+
693+
body.removeAttribute('dir');
694+
695+
normalCSS.forEach(function (linkData) {
696+
var link = document.createElement('link');
697+
link.rel = linkData.rel;
698+
link.type = linkData.type;
699+
link.href = linkData.href;
700+
// Append the link element to the document's head
701+
document.head.appendChild(link);
702+
});
703+
704+
setTimeout(()=>{
705+
706+
body.style.display = 'block';
707+
708+
},1000)
709+
}
710+
</script>
711+
589712
</body>
590713
</html>

HTML/assets/app/css/app.css

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -103,7 +103,7 @@ h6,
103103
.h1,
104104
.h2,
105105
.h3,
106-
.h4,
106+
.h4,
107107
.h5,
108108
.h6 {
109109
font-family: inherit;
@@ -447,7 +447,7 @@ ol.with-line-border > li {
447447
height: 100%;
448448
}
449449
.map-frame,
450-
.map-frame > * {
450+
.map-frame > * {
451451
max-width: 100%;
452452
}
453453

@@ -869,7 +869,7 @@ ol.with-line-border > li {
869869
}
870870
.entry-thumbnail,
871871
.entry-content .video-frame,
872-
.entry-content .map-frame {
872+
.entry-content .map-frame {
873873
width: 100%;
874874
position: relative;
875875
top: -1.5em;
@@ -1299,10 +1299,10 @@ ol.with-line-border > li {
12991299
content: "";
13001300
display: block;
13011301
float: left;
1302-
width: 0;
1303-
height: 0;
1302+
width: 0;
1303+
height: 0;
13041304
border-top: 8px solid transparent;
1305-
border-bottom: 8px solid transparent;
1305+
border-bottom: 8px solid transparent;
13061306
border-right: 12px solid #fff;
13071307
position: absolute;
13081308
top: 8px;
@@ -1503,7 +1503,7 @@ ol.with-line-border > li {
15031503
.site-navigation .navbar-user > .opened > a > i.sub-indicator:before {
15041504
content: "\f139";
15051505
}
1506-
1506+
15071507
}
15081508
@media (max-width: 767px) {
15091509
.form-border {

HTML/assets/app/css/edit.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ ul.navbar-login li:hover{
4949
}
5050
.navbar .nav-item a {
5151
padding: 15px;
52-
font-size:
52+
/*font-size: */
5353
}
5454
.navbar .nav-item:hover a{
5555
text-decoration: none;

0 commit comments

Comments
 (0)