GarGerry commited on
Commit
aa3208d
·
verified ·
1 Parent(s): 47dd878

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +24 -1
style.css CHANGED
@@ -73,6 +73,7 @@ section {
73
  animation: fadeIn 1s forwards; /* Animasi muncul */
74
  }
75
 
 
76
  .project {
77
  border: 1px solid #ccc;
78
  padding: 20px;
@@ -80,13 +81,19 @@ section {
80
  max-width: 500px;
81
  border-radius: 10px;
82
  background: #f9f9f9;
83
- transition: transform 0.3s ease;
84
  }
85
 
86
  .project:hover {
87
  transform: scale(1.05); /* Efek saat hover */
88
  }
89
 
 
 
 
 
 
 
90
  #chatbox {
91
  margin-top: 20px;
92
  padding: 10px;
@@ -96,6 +103,13 @@ section {
96
  transition: all 0.3s ease;
97
  }
98
 
 
 
 
 
 
 
 
99
  footer {
100
  text-align: center;
101
  padding: 10px;
@@ -103,6 +117,15 @@ footer {
103
  color: white;
104
  }
105
 
 
 
 
 
 
 
 
 
 
106
  /* Animasi Fade In */
107
  @keyframes fadeIn {
108
  0% { opacity: 0; }
 
73
  animation: fadeIn 1s forwards; /* Animasi muncul */
74
  }
75
 
76
+ /* Kotak Project */
77
  .project {
78
  border: 1px solid #ccc;
79
  padding: 20px;
 
81
  max-width: 500px;
82
  border-radius: 10px;
83
  background: #f9f9f9;
84
+ transition: transform 0.3s ease, background-color 0.3s ease; /* Tambahkan transisi untuk background */
85
  }
86
 
87
  .project:hover {
88
  transform: scale(1.05); /* Efek saat hover */
89
  }
90
 
91
+ /* Mode Gelap - Kotak Project */
92
+ body.dark-mode .project {
93
+ background: #444; /* Ubah latar belakang kotak saat mode gelap */
94
+ border-color: #666; /* Ubah warna border untuk mode gelap */
95
+ }
96
+
97
  #chatbox {
98
  margin-top: 20px;
99
  padding: 10px;
 
103
  transition: all 0.3s ease;
104
  }
105
 
106
+ /* Mode Gelap - Chatbox */
107
+ body.dark-mode #chatbox {
108
+ background-color: #444; /* Ubah latar belakang chatbox saat mode gelap */
109
+ color: white; /* Ubah warna teks menjadi putih */
110
+ border-color: #6200ea; /* Tetap pertahankan border berwarna ungu */
111
+ }
112
+
113
  footer {
114
  text-align: center;
115
  padding: 10px;
 
117
  color: white;
118
  }
119
 
120
+ /* Mode Gelap - Footer */
121
+ body.dark-mode footer {
122
+ background-color: #444; /* Ubah warna footer saat mode gelap */
123
+ }
124
+
125
+ footer p {
126
+ margin: 0;
127
+ }
128
+
129
  /* Animasi Fade In */
130
  @keyframes fadeIn {
131
  0% { opacity: 0; }