Update: Enhanced App Features

hoangsonww · May 20, 2024 · 5a3c616 · 5a3c616
1 parent acefbc3
commit 5a3c616
Show file tree

Hide file tree

Showing 9 changed files with 57 additions and 4 deletions.
diff --git a/src/css/converter.css b/src/css/converter.css
@@ -22,6 +22,7 @@
 
 #message {
     color: #c60000;
+    text-align: center;
 }
 
 #formats {
@@ -85,3 +86,10 @@ canvas {
         max-width: 100%;
     }
 }
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/css/cropper.css b/src/css/cropper.css
@@ -40,4 +40,11 @@ canvas {
     #crop-container {
         width: 95%;
     }
+
+}
+
+body.dark-mode #crop-container {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
 }
diff --git a/src/css/filter.css b/src/css/filter.css
@@ -89,4 +89,11 @@ canvas {
         width: 95%;
         max-width: 100%;
     }
-}
+}
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/css/resizer.css b/src/css/resizer.css
@@ -22,6 +22,7 @@ body.dark-mode #inputSection,
 body.dark-mode #previewSection {
     background-color: #333;
     box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
 }
 
 body.dark-mode .instructions {

diff --git a/src/css/rotator.css b/src/css/rotator.css
@@ -60,6 +60,7 @@ button:hover {
 #message {
     margin-top: 20px;
     color: red;
+    text-align: center;
 }
 
 @media (max-width: 768px) {
@@ -82,3 +83,10 @@ button:hover {
         width: auto;
     }
 }
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/css/sound-remover.css b/src/css/sound-remover.css
@@ -124,3 +124,10 @@ button {
         max-width: 100%;
     }
 }
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/css/thumbnail-generator.css b/src/css/thumbnail-generator.css
@@ -54,7 +54,7 @@ button {
 }
 
 .thumbnail.selected {
-    border-color: #007bff;
+    border: 5px solid #007bff;
 }
 
 #upload {
@@ -118,3 +118,10 @@ input[type="number"] {
         max-width: 100%;
     }
 }
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/css/watermarker.css b/src/css/watermarker.css
@@ -36,6 +36,7 @@ button {
     align-items: center;
     max-width: 70%;
     border-radius: 8px;
+    padding: 10px;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
 }
 
@@ -85,3 +86,10 @@ canvas {
         width: auto;
     }
 }
+
+body.dark-mode #controls,
+body.dark-mode #preview {
+    background-color: #333;
+    box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
+    transition: background-color 0.3s ease, box-shadow 0.3s ease;
+}
diff --git a/src/python/image_tools.py b/src/python/image_tools.py
@@ -59,8 +59,8 @@ def main():
             height = int(input("Enter the new height: "))
             resize_image(input_path, output_path, width, height)
         elif choice == '2':
-            format = input("Enter the new image format (e.g., JPEG, PNG): ")
-            convert_image_format(input_path, output_path, format)
+            new_format = input("Enter the new image format (e.g., JPEG, PNG): ")
+            convert_image_format(input_path, output_path, new_format)
         elif choice == '3':
             degrees = float(input("Enter the number of degrees to rotate the image: "))
             rotate_image(input_path, output_path, degrees)