|
|
| خط ۱: |
خط ۱: |
| <html> | | <div class="header"> |
| <!DOCTYPE html>
| |
| <html>
| |
| <head>
| |
| <meta charset="UTF-8">
| |
| <meta name="viewport" content="width=device-width, initial-scale=1.0">
| |
| <title>ویکیجو خوش آمدید</title>
| |
| <style>
| |
| body {
| |
| font-family: IRANSans, Arial, sans-serif;
| |
| text-align: center;
| |
| display: flex;
| |
| flex-direction: column;
| |
| justify-content: center;
| |
| align-items: center;
| |
| height: 100vh;
| |
| }
| |
|
| |
|
| .header {
| | [https://wikijoo.ir/ [[File:https://wikijoo.ir/resources/assets/Wikijoo.png|WikiJoo Logo]]] |
| background-color: #f8f9fa;
| |
| padding: 10px;
| |
| }
| |
|
| |
|
| .header img {
| | </div> |
| height: 240px;
| | <div class="search-box"> |
| }
| |
|
| |
|
| .search-box {
| |
| margin-top: 20px;
| |
| display: flex;
| |
| justify-content: flex-end;
| |
| align-items: center;
| |
| direction: rtl;
| |
| }
| |
|
| |
|
| .search-box input[type="text"] {
| |
| font-size: 18px;
| |
| padding: 10px;
| |
| width: 400px;
| |
| max-width: 100%;
| |
| border: 1px solid #dfe1e5;
| |
| border-radius: 8px;
| |
| }
| |
|
| |
|
| .search-box input[type="submit"] {
| |
| font-size: 18px;
| |
| padding: 10px 20px;
| |
| background-color: #007bff;
| |
| color: #fff;
| |
| border: none;
| |
| cursor: pointer;
| |
| border-radius: 4px;
| |
| margin-right: 10px;
| |
| }
| |
|
| |
|
| .search-box ul {
| | </div> |
| list-style-type: none;
| |
| margin: 0;
| |
| padding: 0;
| |
| text-align: left;
| |
| position: absolute;
| |
| width: 400px;
| |
| background-color: #fff;
| |
| border: 1px solid #f0f0f0;
| |
| border-top: none;
| |
| border-radius: 0 0 8px 8px;
| |
| display: none;
| |
| }
| |
| | |
| .search-box ul li {
| |
| padding: 10px;
| |
| cursor: pointer;
| |
| }
| |
| | |
| .search-box ul li:hover {
| |
| background-color: #f0f0f0;
| |
| }
| |
| </style>
| |
| <script>
| |
| // Function to handle search suggestion
| |
| function showSuggestions() {
| |
| var input = document.getElementById("search-input");
| |
| var suggestURL = "https://wikijoo.ir/api.php?action=opensearch&format=json&search=" + input.value;
| |
| | |
| fetch(suggestURL)
| |
| .then(function(response) {
| |
| return response.json();
| |
| })
| |
| .then(function(data) {
| |
| var suggestions = data[1];
| |
| var suggestionList = document.getElementById("suggestions");
| |
| | |
| suggestionList.innerHTML = "";
| |
| suggestions.forEach(function(suggestion) {
| |
| var listItem = document.createElement("li");
| |
| listItem.textContent = suggestion;
| |
| listItem.addEventListener("click", function() {
| |
| input.value = suggestion;
| |
| suggestionList.style.display = "none";
| |
| document.forms[0].submit();
| |
| });
| |
| suggestionList.appendChild(listItem);
| |
| });
| |
| | |
| suggestionList.style.display = "block";
| |
| });
| |
| }
| |
| </script>
| |
| </head>
| |
| <body>
| |
| <div class="header">
| |
| <a href="https://wikijoo.ir/"><img src="https://wikijoo.ir/resources/assets/Wikijoo.png" alt="WikiJoo Logo"></a>
| |
| </div>
| |
| <div class="search-box">
| |
| <form action="https://wikijoo.ir/index.php" method="get">
| |
| <input type="text" id="search-input" name="search" placeholder="در بیش از ۸۰ هزار مقاله جستجو کنید..." required oninput="showSuggestions()">
| |
| <input type="submit" value="جستجو">
| |
| <ul id="suggestions" style="display: none;"></ul>
| |
| </form>
| |
| </div>
| |
| </body>
| |
| </html>
| |
