All files / src/styles addProduct.css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
/* 
  Styles for Add Product Page 
  This file defines styles for the product form container, input fields, and labels. 
  It also ensures proper dark mode support.
*/
 
/* Product Form Container 
   - Provides spacing, background color, and a border for the form.
   - Includes a subtle shadow for a clean UI appearance.
*/
.product-form-container {
  padding: 2rem;
  background-color: var(--card-bg); /* Uses global variable for consistency */
  border-radius: 8px; /* Smooth rounded corners */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Soft shadow for depth */
  border: 1px solid var(--border-color); /* Consistent border styling */
}
 
/* Dark Mode Support 
   - Ensures the form background and text adapt to dark mode settings.
*/
.dark .product-form-container {
  background-color: var(--card-bg);
  color: var(--text-color);
}
 
/* Label Styles 
   - Makes labels bold for better readability.
   - Adds spacing for a structured form layout.
*/
.product-form label {
  font-weight: bold;
  margin-bottom: 0.5rem;
}
 
/* Input Field Styles 
   - Adds padding for better usability.
   - Uses a border with rounded corners for a clean design.
*/
.product-form input {
  margin-bottom: 1rem; /* Adds spacing between inputs */
  padding: 0.5rem;
  border: 1px solid #ccc; /* Neutral gray border for clarity */
  border-radius: 4px; /* Slightly rounded corners */
}