Skip to content

Commit

Permalink
Merge pull request #14 from ladybirdweb/feature-rtl-support
Browse files Browse the repository at this point in the history 
Feature:: RTL Support
  • Loading branch information
@Sakthi002
Sakthi002 authored Oct 21, 2023
2 parents b2407ae + 310a7fd commit 7fe763c
Show file tree
Hide file tree
Showing 36 changed files with 20,991 additions and 978 deletions.
134 changes: 128 additions & 6 deletions HTML/404.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,18 +18,18 @@
<link rel="shortcut icon" href="assets/ico/favicon.png">

<!-- Styles -->
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />
<!-- <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />-->
<!--[if lt IE 9]>
<script type="text/javascript" src="assets/app/js/html5shiv.min.js"></script>
<script type="text/javascript" src="assets/app/js/respond.min.js"></script>
<![endif]-->
</head>

<body>
<body style="display: none">

<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
Expand Down Expand Up @@ -95,6 +95,25 @@
<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>
</a>
</li>

<li class="nav-item dropdown">

<a class="dropdown-toggle nav-link" href="#" id="navbarDropdownlang" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

<img id="flagIcon" src="./assets/img/en.png" alt="no">
</a>

<ul class="dropdown-menu" aria-labelledby="navbarDropdown">

<li><a class="dropdown-item" href="404.html?lang=ar" id="arabicOption">
<img src="./assets/img/ar.png" alt="Img"> Arabic
</a></li>

<li><a class="dropdown-item" href="404.html?lang=en" id="englishOption">
<img src="./assets/img/en.png" alt="Img"> English
</a></li>
</ul>
</li>
</ul><!-- .navbar-menu -->

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

<script async>

let normalCSS = [
{
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.min.css'
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/app.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/edit.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/custom.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
}
// Add more objects for additional links
];

let rtlCSS = [
{
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.rtl.min.css'
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/app.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/edit.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/custom.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
}
// Add more objects for additional links
];

const urlParams = new URLSearchParams(window.location.search);

const body = document.body;

const flagIcon = document.getElementById('flagIcon');

if(urlParams.get('lang') && urlParams.get('lang') === 'ar') {

var existingLinks = document.querySelectorAll('link[rel="stylesheet"]');
existingLinks.forEach(function (link) {
link.parentNode.removeChild(link);
});

flagIcon.src = './assets/img/ar.png';

flagIcon.alt = 'Arabic';

body.setAttribute('dir', 'rtl');

rtlCSS.forEach(function (linkData) {
var link = document.createElement('link');
link.rel = linkData.rel;
link.type = linkData.type;
link.href = linkData.href;
// Append the link element to the document's head
document.head.appendChild(link);
});

setTimeout(()=>{

body.style.display = 'block';

},1000)

} else {

var existingLinks1 = document.querySelectorAll('link[rel="stylesheet"]');
existingLinks1.forEach(function (link) {
link.parentNode.removeChild(link);
});

flagIcon.src = './assets/img/en.png';

flagIcon.alt = 'English';

body.removeAttribute('dir');

normalCSS.forEach(function (linkData) {
var link = document.createElement('link');
link.rel = linkData.rel;
link.type = linkData.type;
link.href = linkData.href;
// Append the link element to the document's head
document.head.appendChild(link);
});

setTimeout(()=>{

body.style.display = 'block';

},1000)
}
</script>
</body>
</html>
135 changes: 129 additions & 6 deletions HTML/archive.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,18 +18,18 @@
<link rel="shortcut icon" href="assets/ico/favicon.png">

<!-- Styles -->
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />
<link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />
<link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />
<!-- <link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/font-awesome/css/all.min.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/app.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/edit.css" type="text/css" />-->
<!-- <link rel="stylesheet" href="assets/app/css/custom.css" type="text/css" />-->
<!--[if lt IE 9]>
<script type="text/javascript" src="assets/app/js/html5shiv.min.js"></script>
<script type="text/javascript" src="assets/app/js/respond.min.js"></script>
<![endif]-->
</head>

<body>
<body style="display: none">

<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
Expand Down Expand Up @@ -95,6 +95,25 @@
<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>
</a>
</li>

<li class="nav-item dropdown">

<a class="dropdown-toggle nav-link" href="#" id="navbarDropdownlang" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

<img id="flagIcon" src="./assets/img/en.png" alt="no">
</a>

<ul class="dropdown-menu" aria-labelledby="navbarDropdown">

<li><a class="dropdown-item" href="archive.html?lang=ar" id="arabicOption">
<img src="./assets/img/ar.png" alt="Img"> Arabic
</a></li>

<li><a class="dropdown-item" href="archive.html?lang=en" id="englishOption">
<img src="./assets/img/en.png" alt="Img"> English
</a></li>
</ul>
</li>
</ul><!-- .navbar-menu -->

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

<script async>

let normalCSS = [
{
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.min.css'
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/app.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/edit.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/custom.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
}
// Add more objects for additional links
];

let rtlCSS = [
{
rel: 'stylesheet',type: 'text/css', href: 'assets/bootstrap/css/bootstrap.rtl.min.css'
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/app.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/edit.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/app/css/rtl/custom.css',
},
{
rel: 'stylesheet', type: 'text/css', href: 'assets/font-awesome/css/all.min.css'
}
// Add more objects for additional links
];

const urlParams = new URLSearchParams(window.location.search);

const body = document.body;

const flagIcon = document.getElementById('flagIcon');

if(urlParams.get('lang') && urlParams.get('lang') === 'ar') {

var existingLinks = document.querySelectorAll('link[rel="stylesheet"]');
existingLinks.forEach(function (link) {
link.parentNode.removeChild(link);
});

flagIcon.src = './assets/img/ar.png';

flagIcon.alt = 'Arabic';

body.setAttribute('dir', 'rtl');

rtlCSS.forEach(function (linkData) {
var link = document.createElement('link');
link.rel = linkData.rel;
link.type = linkData.type;
link.href = linkData.href;
// Append the link element to the document's head
document.head.appendChild(link);
});

setTimeout(()=>{

body.style.display = 'block';

},1000)

} else {

var existingLinks1 = document.querySelectorAll('link[rel="stylesheet"]');
existingLinks1.forEach(function (link) {
link.parentNode.removeChild(link);
});

flagIcon.src = './assets/img/en.png';

flagIcon.alt = 'English';

body.removeAttribute('dir');

normalCSS.forEach(function (linkData) {
var link = document.createElement('link');
link.rel = linkData.rel;
link.type = linkData.type;
link.href = linkData.href;
// Append the link element to the document's head
document.head.appendChild(link);
});

setTimeout(()=>{

body.style.display = 'block';

},1000)
}
</script>

</body>
</html>
14 changes: 7 additions & 7 deletions HTML/assets/app/css/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -103,7 +103,7 @@ h6,
.h1,
.h2,
.h3,
.h4,
.h4,
.h5,
.h6 {
font-family: inherit;
Expand Down Expand Up @@ -447,7 +447,7 @@ ol.with-line-border > li {
height: 100%;
}
.map-frame,
.map-frame > * {
.map-frame > * {
max-width: 100%;
}

Expand Down Expand Up @@ -869,7 +869,7 @@ ol.with-line-border > li {
}
.entry-thumbnail,
.entry-content .video-frame,
.entry-content .map-frame {
.entry-content .map-frame {
width: 100%;
position: relative;
top: -1.5em;
Expand Down Expand Up @@ -1299,10 +1299,10 @@ ol.with-line-border > li {
content: "";
display: block;
float: left;
width: 0;
height: 0;
width: 0;
height: 0;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-bottom: 8px solid transparent;
border-right: 12px solid #fff;
position: absolute;
top: 8px;
Expand Down Expand Up @@ -1503,7 +1503,7 @@ ol.with-line-border > li {
.site-navigation .navbar-user > .opened > a > i.sub-indicator:before {
content: "\f139";
}

}
@media (max-width: 767px) {
.form-border {
Expand Down
2 changes: 1 addition & 1 deletion HTML/assets/app/css/edit.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ ul.navbar-login li:hover{
}
.navbar .nav-item a {
padding: 15px;
font-size:
/*font-size: */
}
.navbar .nav-item:hover a{
text-decoration: none;
Expand Down
Loading

0 comments on commit 7fe763c

Please sign in to comment.