diff options
| author | altaf-creator <64111012+altaf-creator@users.noreply.github.com> | 2023-05-03 22:12:11 +0700 |
|---|---|---|
| committer | altaf-creator <64111012+altaf-creator@users.noreply.github.com> | 2023-05-03 22:12:11 +0700 |
| commit | 568debd74070ecb23433a8fb413b48dcc56141eb (patch) | |
| tree | 1916a58c3a5ec60827da2ea6e38baf2116b266d2 /src/sura.html | |
Initial commit
Diffstat (limited to 'src/sura.html')
| -rw-r--r-- | src/sura.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/src/sura.html b/src/sura.html new file mode 100644 index 0000000..eae5b2d --- /dev/null +++ b/src/sura.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html lang="en"> + +<head> + <meta charset="UTF-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <link rel="stylesheet" href="styles/style.css"> + <link href="styles/css/fontawesome.css" rel="stylesheet"> + <link href="styles/css/brands.css" rel="stylesheet"> + <link href="styles/css/solid.css" rel="stylesheet"> + <link rel="icon" href="images/favicon.png"> + <title>OpenQuran</title> +</head> + +<body onload="quranOnLoad()"> + <script src="scripts/window-buttons.js" defer></script> + + <div class="navbar"> + <a href="./" style="text-decoration: none;" id="openquran-link"> + <div class="navbar-logo"> + <img src="images/favicon.png" alt="" class="navbar-logo-img"> + <p class="navbar-logo-txt"><b>OpenQuran</b></p> + </div> + </a> + <div class="navbar-middle"></div> + <p style="text-align: right; color: rgba(0, 0, 0, 0.5); margin-right: 20px;" id="navbar-text">السَّلاَمُ + عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ</p> + <div class="window-button-container"> + <button class="window-button" id="minimize"> + <i class="fa-solid fa-minus"></i> + </button> + </div> + <div class="window-button-container" id="maximize"> + <button class="window-button" style="display: grid; place-items: center;"> + <img src="images/maximize.png" alt="" style="width: 12px;"> + </button> + </div> + <div class="window-button-container" style="margin-right: 15px"> + <button onclick="window.top.close()" class="window-button"> + <i class="fa-solid fa-xmark"></i> + </button> + </div> + </div> + <div id="main-container"> + <div class="sidebar"> + <div class="scroll scroll-auto" id="scroll-sura"> + <div class="dropdown" tabindex="0" id="dropdown"> + <div class="dropdown-button"> + <span id="dropdown-content">English</span> + <span style="float: right; font-size: 16px; line-height: 24px;"><i + class="fa-solid fa-angle-down"></i></span> + </div> + <div class="dropdown-content"> + <a href="#" class="dropdown-item" + onclick="changeDropdownName(`dropdown-content`, `English`); changeLang(0);">English</a> + <a href="#" class="dropdown-item" + onclick="changeDropdownName(`dropdown-content`, `Indonesia`); changeLang(1);">Indonesia</a> + </div> + </div> + <hr style="margin: 10px"> + <div id="sidebar-sura"> + + </div> + </div> + </div> + <div class="sidebar-links"> + <a href="attribution.html" class="link">Attribution</a> + </div> + <div class="main height-no-scroll"> + <div class="scroll main-content-padding"> + <div class="dropdown" tabindex="0" id="dropdown-alternate"> + <div class="dropdown-button"> + <span id="dropdown-content-alternate">English</span> + <span style="float: right; font-size: 16px; line-height: 24px;"><i + class="fa-solid fa-angle-down"></i></span> + </div> + <div class="dropdown-content" style="width: calc(100% - 85px);"> + <a href="#" class="dropdown-item" + onclick="changeDropdownName(`dropdown-content-alternate`, `English`); changeLang(0);">English</a> + <a href="#" class="dropdown-item" + onclick="changeDropdownName(`dropdown-content-alternate`, `Indonesia`); changeLang(1);">Indonesia</a> + </div> + </div> + <h1 id="header" class="title">Choose a sura</h1> + <h3 id="subheader" class="subtitle"></h3> + <div id="main"> + + </div> + </div> + </div> + </div> + + <script src="scripts/quran.js"></script> + <script> + function changeDropdownName(id, text) { + document.getElementById(id).innerHTML = text; + } + </script> +</body> + +</html>
\ No newline at end of file |