From 7534c5e7010555dbea2513fa6bf5277f7276ec57 Mon Sep 17 00:00:00 2001
From: Son Nguyen Hoang <hoangson091104@gmail.com>
Date: Tue, 12 Mar 2024 19:16:28 -0400
Subject: [PATCH] Fix: Updated scss (#82)

---
 .idea/watcherTasks.xml               |  2 +-
 MovieVerse-Frontend/css/profile.scss | 87 ++++++++++++++++++++++++++++
 2 files changed, 88 insertions(+), 1 deletion(-)
 create mode 100644 MovieVerse-Frontend/css/profile.scss

diff --git a/.idea/watcherTasks.xml b/.idea/watcherTasks.xml
index c70980f4..42014037 100644
--- a/.idea/watcherTasks.xml
+++ b/.idea/watcherTasks.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="ProjectTasksOptions">
-    <TaskOptions isEnabled="true">
+    <TaskOptions isEnabled="false">
       <option name="arguments" value="$FileName$:$FileNameWithoutExtension$.css" />
       <option name="checkSyntaxErrors" value="true" />
       <option name="description" />
diff --git a/MovieVerse-Frontend/css/profile.scss b/MovieVerse-Frontend/css/profile.scss
new file mode 100644
index 00000000..4a3fd046
--- /dev/null
+++ b/MovieVerse-Frontend/css/profile.scss
@@ -0,0 +1,87 @@
+// Theme colors and spacing variables
+$primary-color: #4A90E2;
+$secondary-color: #50E3C2;
+$text-color: #4A4A4A;
+$background-color: #F5F7FA;
+$padding-standard: 15px;
+$border-radius-standard: 5px;
+
+// Mixins for common patterns
+@mixin flex-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+@mixin card-style {
+  background-color: white;
+  border-radius: $border-radius-standard;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+  padding: $padding-standard;
+}
+
+// Base styles
+body {
+  font-family: 'Poppins', sans-serif;
+  color: $text-color;
+  background-color: $background-color;
+}
+
+a {
+  color: $primary-color;
+  text-decoration: none;
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+// Profile page specific styles
+.profile-container {
+  @include flex-center;
+  flex-direction: column;
+}
+
+.profile-header {
+  @include flex-center;
+  flex-direction: column;
+  margin-bottom: 20px;
+
+  .profile-image {
+    border-radius: 50%;
+    width: 100px;
+    height: 100px;
+    margin-bottom: $padding-standard;
+  }
+
+  .profile-name {
+    font-size: 20px;
+    font-weight: bold;
+  }
+
+  .profile-bio {
+    text-align: center;
+    margin-top: $padding-standard;
+  }
+}
+
+.profile-content {
+  @include card-style;
+  margin: 20px auto;
+  width: 90%;
+  max-width: 600px;
+
+  .section {
+    &:not(:last-child) {
+      margin-bottom: 20px;
+    }
+
+    h2 {
+      border-bottom: 2px solid $primary-color;
+      padding-bottom: $padding-standard / 2;
+    }
+
+    p, ul {
+      margin-top: $padding-standard / 2;
+    }
+  }
+}