Add files via upload

StyingDev · Oct 9, 2024 · dc0eba3 · dc0eba3
1 parent 5326700
commit dc0eba3
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 42 deletions.
diff --git a/manifest.json b/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "StyTab",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "description": "Stytab - A minimalist Startpage that meets your needs.",
   "chrome_url_overrides": {
     "newtab": "startpage.html"

diff --git a/startpage.html b/startpage.html
@@ -5,14 +5,12 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>StyTab</title>
   <link rel="icon" type="image/x-icon" href="icons/Dizzy.svg">
-
   <link rel="stylesheet" href="styles/animations.css">
   <link rel="stylesheet" href="styles/base.css">
   <link rel="stylesheet" href="styles/gradient.css">
   <link rel="stylesheet" href="styles/quick-links.css">
   <link rel="stylesheet" href="styles/search-bar.css">
   <link rel="stylesheet" href="styles/settings.css">
-
 </head>
 <body>
 
@@ -65,7 +63,6 @@ <h2>Settings</h2>
         <option value="https://search.yahoo.com/search">Yahoo</option>
         <option value="https://www.qwant.com/">Qwant</option>
         <option value="https://www.startpage.com/">StartPage</option>
-        <option value="https://www.yandex.com/search/">Yandex</option>
         <option value="https://priv.au/search">Priv.au</option>
     </select>
 
@@ -100,8 +97,7 @@ <h2>Settings</h2>
       </label>
     </div>
 
-
-    <button id="save-settings">Save</button>
+    <button id="save-settings">Save</button>    
 
   </div>
 
@@ -125,14 +121,9 @@ <h2>QuickLinks</h2>
     <!-- Quick links section -->
     <div class="quick-links-sidebar" id="quick-links-sidebar"></div>
 
-    <p class="footer"><span id="github-link">Make sure to star it on GitHub!</span></p>
-
+    <p class="footer"><span id="github-link">✨ Make sure to star it on GitHub!</span></p>
   </div>
 
-
-
-
-
   <div class="modal-overlay" id="modal-overlay"></div>
   <script src="Scripts/clock.js"></script>
   <script src="Scripts/settings.js"></script>

diff --git a/styles/quick-links.css b/styles/quick-links.css
@@ -7,14 +7,16 @@
   padding: 10px 20px;
   border-radius: 25px;
   background-color: rgba(255, 255, 255, 0.1);
-  transition: background-color 0.3s ease, transform 0.3s ease;
+  transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
 }
 
 .quick-links a:hover {
   background-color: rgba(255, 255, 255, 0.3);
-  transform: scale(1.1);
+  transform: scale(1.1); 
+  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); 
 }
 
+/* Quick Links Sidebar Styling */
 .quick-links-sidebar a {
   margin: 0 15px;
   text-decoration: none;
@@ -23,12 +25,13 @@
   padding: 10px 20px;
   border-radius: 25px;
   background-color: rgba(255, 255, 255, 0.1);
-  transition: background-color 0.3s ease, transform 0.3s ease;
+  transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
 }
 
 .quick-links-sidebar a:hover {
   background-color: rgba(255, 255, 255, 0.3);
-  transform: scale(1.1);
+  transform: scale(1.06); 
+  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); 
 }
 
 
@@ -170,6 +173,7 @@
 .quicklinks-sidebar input[type="url"],
 .quicklinks-sidebar select {
   width: calc(100% - 20px);
+  font-size: 15px;
   padding: 10px;
   margin-top: 5px;
   margin-bottom: 15px;
@@ -180,6 +184,7 @@
 }
 
 .quicklinks-sidebar button {
+  font-size: 15px;
   padding: 10px;
   background-color: #00b894;
   border: none;
@@ -188,7 +193,7 @@
   margin-top: 5px;
   cursor: pointer;
   transition: background-color 0.3s ease;
-  width: calc(100% - 0px);
+  width: 100%;
 }
 
 .quicklinks-sidebar button:hover {

diff --git a/styles/search-bar.css b/styles/search-bar.css
@@ -1,21 +1,25 @@
-/* Search Bar Styling */
-input[type="text"] {
-  width: 400px; /* Default width for larger screens */
+/* Search Bar Styling (for #search-query inside .search-box) */
+.search-box #search-query {
+  width: 400px;
   padding: 12px;
   font-size: 18px;
   border: none;
   border-radius: 25px;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
-  transition: box-shadow 0.3s ease, width 0.3s ease;
-  margin-bottom: 10px; /* Adds space below the search bar */
+  transition: box-shadow 0.3s ease, width 0.3s ease, background-color 0.3s ease;
+  margin-bottom: 10px;
+  background-color: #fff;
 }
 
-input[type="text"]:focus {
+.search-box #search-query:hover,
+.search-box #search-query:focus {
   outline: none;
   box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
+  background-color: #ddd;
 }
 
-input[type="submit"] {
+/* Search Button Styling (for submit button inside .search-box) */
+.search-box input[type="submit"] {
   padding: 12px 20px;
   font-size: 18px;
   border: none;
@@ -24,39 +28,39 @@ input[type="submit"] {
   color: #333;
   margin-left: 10px;
   cursor: pointer;
-  transition: background-color 0.3s ease;
+  transition: background-color 0.3s ease, box-shadow 0.3s ease;
 }
 
-input[type="submit"]:hover {
+.search-box input[type="submit"]:hover,
+.search-box input[type="submit"]:focus {
   background-color: #ddd;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
 }
 
 /* Media Queries for Responsiveness */
 @media (max-width: 768px) {
-  /* For tablets and smaller screens */
-  input[type="text"] {
-    width: 80%; /* Adjust width for medium screens */
-    font-size: 16px; /* Slightly smaller font size */
-    padding: 10px; /* Reduce padding */
+  .search-box #search-query {
+    width: 80%;
+    font-size: 16px;
+    padding: 10px;
   }
 
-  input[type="submit"] {
-    padding: 10px 15px; /* Adjust button padding */
-    font-size: 16px; /* Adjust font size */
+  .search-box input[type="submit"] {
+    padding: 10px 15px;
+    font-size: 16px;
     margin-left: 8px;
   }
 }
 
 @media (max-width: 480px) {
-  /* For mobile devices */
-  input[type="text"] {
-    width: 100%; /* Full width for small screens */
-    font-size: 14px; /* Smaller font size */
-    padding: 8px; /* Further reduce padding */
+  .search-box #search-query {
+    width: 100%;
+    font-size: 14px;
+    padding: 8px;
   }
 
-  input[type="submit"] {
-    padding: 8px 12px; /* Smaller button padding */
+  .search-box input[type="submit"] {
+    padding: 8px 12px;
     font-size: 14px;
     margin-left: 5px;
   }

diff --git a/styles/settings.css b/styles/settings.css
@@ -51,6 +51,7 @@
 .settings-sidebar input[type="text"],
 .settings-sidebar select {
   width: calc(100% - 20px);
+  font-size: 15px;
   padding: 10px;
   margin-bottom: 15px;
   border-radius: 5px;
@@ -60,14 +61,15 @@
 }
 
 .settings-sidebar button {
+  font-size: 15px;
   padding: 10px;
   background-color: #00b894;
   border: none;
   color: white;
   border-radius: 5px;
   cursor: pointer;
   transition: background-color 0.3s ease;
-  width: calc(100% - 30px);
+  width: 100%;
 }
 
 .settings-sidebar button:hover {