diff --git a/.DS_Store b/.DS_Store index ce63371e..9be389df 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/assets/.DS_Store b/assets/.DS_Store index 2a87f346..131b057a 100644 Binary files a/assets/.DS_Store and b/assets/.DS_Store differ diff --git a/assets/css/header.css b/assets/css/header.css index 6bed6c70..10f180db 100644 --- a/assets/css/header.css +++ b/assets/css/header.css @@ -1,9 +1,4 @@ -/* header.css */ - header { - display: flex; - justify-content: space-between; - align-items: center; padding: 20px; background-color: #ffffff; border-bottom: 1px solid #F2F2F2; @@ -13,43 +8,68 @@ header { z-index: 1000; } +.header-container { + display: flex; + justify-content: space-between; + align-items: center; + max-width: 1120px; + margin: 0 auto; + width: 100%; + box-sizing: border-box; + flex-wrap: wrap; +} + .logo { display: flex; align-items: center; font-weight: 500; font-size: 18px; + color: #171C24; + margin-left: 0; } .logo-img { width: 35px; - margin-right: 10px; /* Spacing between logo and text */ + margin-right: 2.5px; +} +.version-number { + font-size: 10px; + font-family: system-ui, -apple-system; + font-weight: 550; + color: #697483; + background-color:#ECF0F5; + padding: 1px 4px; + border-radius: 3px; + margin-right: 40.5rem; + margin-bottom: -3px; } nav ul { list-style: none; display: flex; - gap: 40px; + gap: 25px; margin: 0; + padding: 0; } nav ul li a { text-decoration: none; - color: #697483; /* Default color for inactive links */ + color: #697483; font-size: 14px; font-weight: 500; - transition: color 0.3s; /* Smooth color transition */ + transition: color 0.3s; } nav ul li a.active { - color: #BEC7D5; /* Color for active link */ + color: #BEC7D5; } nav ul li a:not(.disabled):hover { - color: #272B2F; /* Color on hover for non-disabled links */ + color: #272B2F; } nav ul li a.disabled { - color: #BEC7D5; /* Color for disabled link */ - pointer-events: none; /* Disable click events */ - cursor: default; /* Change cursor to default */ + color: #BEC7D5; + pointer-events: none; + cursor: default; } diff --git a/assets/css/home.css b/assets/css/home.css index ed845c1f..0fbcc741 100644 --- a/assets/css/home.css +++ b/assets/css/home.css @@ -10,10 +10,13 @@ main { padding: 60px 20px; text-align: center; } +.shorten-section{ + margin-bottom: 5em; +} .shorten-section h1 { color: #171C24; - margin-top: 65px; + margin-top: 5.3ex; font-size: 45px; font-weight: 700; margin-bottom: 0px; diff --git a/assets/images/.DS_Store b/assets/images/.DS_Store index 51d73eb5..90743784 100644 Binary files a/assets/images/.DS_Store and b/assets/images/.DS_Store differ diff --git a/assets/images/favicon.ico b/assets/images/favicon.ico new file mode 100644 index 00000000..36dfaecc Binary files /dev/null and b/assets/images/favicon.ico differ diff --git a/assets/js/header.js b/assets/js/header.js deleted file mode 100644 index e69de29b..00000000 diff --git a/header.php b/header.php index dad454bf..469cf71f 100644 --- a/header.php +++ b/header.php @@ -1,9 +1,13 @@
+
+
+ 1.2.0 +
+
diff --git a/home.php b/home.php deleted file mode 100644 index 5a0e6793..00000000 --- a/home.php +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - Xeorl - Shorten your links - - - - - - -
-
-

Open source inits.

-

Lovingly hand-crafted.

-

Premium link shortening for use in web, iOS, Android, and
- desktop apps. Supported for urls. Completely open source, MIT
- licensed and built by xodivorce.

-
- - -
- -
-
- - - - diff --git a/index.php b/index.php index c9d21341..20814aeb 100644 --- a/index.php +++ b/index.php @@ -3,7 +3,6 @@ session_start(); // Include necessary files -include "header.php"; include "php/config.php"; // Set a cookie to track user visits or preferences @@ -57,13 +56,18 @@ if (isset($_GET)) { + Xeorl - Link Shortener and Management Tool - Xeorl - Shorten your links + + +
diff --git a/php/config.php b/php/config.php index 8261334f..0160c612 100644 --- a/php/config.php +++ b/php/config.php @@ -7,7 +7,7 @@ 3. Go to JavaScript file and search this keyword - let domain - then paste your url there 4. After all changes you've to wait because javascript file save changes may take time to reflect */ - $domain = "https://localhost/web-Projects/url/"; //like this: codingnepalweb.com/ + $domain = "http://localhost/Web-Projects/xeorl/"; //like this: codingnepalweb.com/ $host = "localhost"; $user = "root"; //Database username $pass = ""; //Database password diff --git a/script.js b/script.js deleted file mode 100644 index 50daa7d2..00000000 --- a/script.js +++ /dev/null @@ -1,38 +0,0 @@ -const form = document.querySelector(".wrapper form"), - fullURL = form.querySelector("input"), - shortenBtn = form.querySelector("form button"), - urlsArea = document.querySelector(".urls-area"); - -form.onsubmit = (e) => { - e.preventDefault(); -}; - -shortenBtn.onclick = () => { - let xhr = new XMLHttpRequest(); - xhr.open("POST", "php/url-controll.php", true); - xhr.onload = () => { - if (xhr.readyState == 4 && xhr.status == 200) { - let data = xhr.response; - if (data.length <= 5) { - // Example of setting the shortened URL directly to the list - let domain = "localhost/url/"; - let shortenURL = domain + data; - - // Create a new row for the URL and append it to the list - let newRow = ` -
-
  • ${shortenURL}
  • -
  • ${fullURL.value}
  • -
  • 0
  • -
  • Delete
  • -
    - `; - urlsArea.insertAdjacentHTML('afterbegin', newRow); - } else { - alert(data); - } - } - }; - let formData = new FormData(form); - xhr.send(formData); -}; diff --git a/style.css b/style.css deleted file mode 100644 index 3886dcd2..00000000 --- a/style.css +++ /dev/null @@ -1,255 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap'); -*{ - margin: 0; - padding: 0; - box-sizing: border-box; - text-decoration: none; - font-family: 'Poppins', sans-serif; -} -body{ - display: flex; - align-items: center; - justify-content: center; - min-height: 100vh; - background: #20B2AA; - padding: 0 10px; -} -.wrapper{ - background: #fff; - padding: 20px; - width: 800px; - border-radius: 5px; - box-shadow: 0px 5px 10px rgba(0,0,0,0.1); -} -::selection{ - background: rgba(23,162,184,0.3); -} -.wrapper form{ - height: 50px; - width: 100%; - display: flex; - position: relative; - align-items: center; -} -form .url-icon{ - position: absolute; - width: 50px; - text-align: center; - font-size: 23px; - color: #c4c4c4; - pointer-events: none; -} -form input:valid ~ .url-icon{ - color: #20B2AA; -} -form input{ - height: 100%; - width: 100%; - outline: none; - padding: 0 120px 0 45px; - font-size: 20px; - caret-color: #20B2AA; - border: 2px solid #ddd; - border-radius: 5px; - transition: all 0.1s ease; -} -form input:valid{ - border-color: #20B2AA; -} -form input::placeholder{ - color: #c4c4c4; -} -form input:focus::placeholder{ - color: #d9d9d9; -} -form button{ - position: absolute; - right: 6px; - padding: 5px 15px; - font-size: 18px; - border-radius: 5px; - border: none; - outline: none; - background: #20B2AA; - color: #fff; - cursor: pointer; - transition: all 0.3s ease; -} -form button:hover{ - background: #1fada6; -} -.wrapper form button{ - opacity: 0; - pointer-events: none; -} -.wrapper form input:valid ~ button{ - opacity: 1; - pointer-events: auto; -} -.wrapper a{ - color: #000; -} - -.wrapper .statistics{ - margin: 20px 0; - display: flex; - padding-right: 5px; - align-items: center; - justify-content: space-between; -} -.statistics span{ - font-size: 17px; -} -.statistics span span{ - font-weight: 500; -} -.statistics a:hover{ - color: #20B2AA; -} - -.wrapper .urls-area{ - border: 1px solid #ddd; - border-radius: 5px; - margin-bottom: 5px; - max-height: 400px; - overflow-y: scroll; -} -.urls-area::-webkit-scrollbar{ - width: 0px; -} -.urls-area :is(.title, .data){ - display: flex; - width: 100%; - justify-content: space-between; -} -.urls-area li{ - width: 100%; - list-style: none; - border-right: 1px solid #ddd; -} -.urls-area li:last-child{ - border-right: 0px; -} -.urls-area .title li{ - text-align: center; - background: #f2f2f2; - padding: 10px 0; -} -.urls-area .data li{ - padding: 8px 10px; - display: flex; - align-items: center; - justify-content: center; - word-break: break-all; -} -.urls-area .data li:last-child a{ - height: 100%; - width: 100%; - display: flex; - align-items: center; - justify-content: center; -} -.urls-area .data li a:hover{ - color: #20B2AA; - text-decoration: underline; -} -.urls-area .data li:last-child a:hover{ - text-decoration: none; -} -.urls-area .data:nth-child(odd){ - background: #f2f2f2; -} -.urls-area li:nth-child(1){ - max-width: 30%; -} -.urls-area li:nth-child(2){ - max-width: 45%; -} -.urls-area li:nth-child(3){ - max-width: 11%; -} -.urls-area li:nth-child(4){ - max-width: 14%; -} - -.blur-effect{ - position: absolute; - top: 0; - left: 0; - height: 100%; - width: 100%; - backdrop-filter: blur(2px); - background: rgba(0,0,0,0.01); - display: none; -} -.popup-box{ - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%) scale(0.9); - background: #fff; - padding: 25px; - max-width: 480px; - width: 100%; - border-radius: 5px; - box-shadow: 0px 5px 10px rgba(0,0,0,0.1); - opacity: 0; - visibility: hidden; - pointer-events: none; - transition: all 0.3s ease; -} -.popup-box.show{ - opacity: 1; - pointer-events: auto; - visibility: visible; - transform: translate(-50%, -50%) scale(1); -} -.popup-box .info-box{ - color: #0f5753; - background: #bef4f1; - border: 1px solid #7de8e3; - padding: 10px; - text-align: center; - font-size: 17px; - border-radius: 5px; -} -.popup-box .info-box.error{ - color: #721c24; - background: #f8d7da; - border-color: #f5c6cb; -} -.popup-box form{ - margin-top: 10px; - position: relative; -} -.popup-box form label{ - font-size: 18px; -} -.popup-box form .copy-icon{ - position: absolute; - right: 10px; - top: 50%; - transform: translateY(-100%); - font-size: 20px; - cursor: pointer; -} -.copy-icon:hover{ - color: #20B2AA; -} -.popup-box form input{ - height: 45px; - padding: 0 35px 0 15px; - margin-top: 3px; - border: 1px solid #ccc; -} -.popup-box form input:focus{ - border-color: #20B2AA; -} -.popup-box form button{ - width: 100%; - height: 45px; - position: relative; - right: 0; - font-size: 20px; - margin-top: 10px; -} \ No newline at end of file