Hugging Face's logo

Spaces:
nagasurendra
/
DynamicMenuApp3
Sleeping

App Files Community
4
nagasurendra commited on
Commit
8ac09ad
·
verified ·
1 Parent(s): 92b51ea

Update static/styles.css

Browse files
Files changed (1) hide show
  1. static/styles.css +25 -41
static/styles.css CHANGED
@@ -1,8 +1,7 @@
1
- /* Main Page Styles */
2
  body {
3
  font-family: Arial, sans-serif;
4
  background-color: #f9f9f9;
5
- margin: 20px;
6
  }
7
 
8
  .menu-card {
@@ -10,64 +9,51 @@ body {
10
  justify-content: space-between;
11
  align-items: center;
12
  border: 1px solid #ddd;
13
- padding: 10px;
14
  margin-bottom: 10px;
15
- border-radius: 5px;
 
16
  background-color: white;
17
  }
18
 
19
- .menu-card-content {
20
  flex: 1;
 
21
  }
22
 
23
- .menu-card-image {
24
- width: 80px;
25
- height: 80px;
26
- object-fit: cover;
27
- border-radius: 5px;
28
  }
29
 
30
- .add-button {
31
- background-color: #28a745;
32
- color: white;
33
- border: none;
34
- padding: 5px 10px;
35
- border-radius: 5px;
36
- cursor: pointer;
37
- }
38
- /* Main Page Styles */
39
- .menu-card {
40
- display: flex;
41
- justify-content: space-between;
42
- align-items: center;
43
- border: 1px solid #ddd;
44
- padding: 10px;
45
- margin-bottom: 10px;
46
- border-radius: 5px;
47
- background-color: white;
48
  }
49
 
50
- .menu-card-content {
51
- flex: 1;
52
  }
53
 
54
  .menu-card-image {
55
- width: 80px;
56
- height: 80px;
57
  object-fit: cover;
58
- border-radius: 5px;
 
59
  }
60
 
61
  .add-button {
62
  background-color: #28a745;
63
  color: white;
64
  border: none;
65
- padding: 5px 10px;
 
66
  border-radius: 5px;
67
  cursor: pointer;
68
  }
69
 
70
- /* Modal Styles */
71
  .modal {
72
  display: none;
73
  position: fixed;
@@ -76,10 +62,10 @@ body {
76
  transform: translate(-50%, -50%);
77
  z-index: 1000;
78
  width: 50%;
79
- background: white;
80
- padding: 20px;
81
- border-radius: 10px;
82
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
 
83
  }
84
 
85
  .modal-content {
@@ -96,8 +82,6 @@ body {
96
  position: absolute;
97
  top: 10px;
98
  right: 10px;
99
- font-size: 20px;
100
  cursor: pointer;
101
  }
102
-
103
-
 
1
+ /* Main Page Styling */
2
  body {
3
  font-family: Arial, sans-serif;
4
  background-color: #f9f9f9;
 
5
  }
6
 
7
  .menu-card {
 
9
  justify-content: space-between;
10
  align-items: center;
11
  border: 1px solid #ddd;
12
+ padding: 15px;
13
  margin-bottom: 10px;
14
+ border-radius: 8px;
15
+ box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
16
  background-color: white;
17
  }
18
 
19
+ .menu-card-details {
20
  flex: 1;
21
+ margin-right: 15px;
22
  }
23
 
24
+ .menu-card-details h3 {
25
+ margin: 0;
26
+ font-size: 18px;
 
 
27
  }
28
 
29
+ .menu-card-details p {
30
+ margin: 5px 0;
31
+ font-size: 14px;
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32
  }
33
 
34
+ .menu-card-actions {
35
+ text-align: center;
36
  }
37
 
38
  .menu-card-image {
39
+ width: 100px;
40
+ height: 100px;
41
  object-fit: cover;
42
+ border-radius: 8px;
43
+ margin-bottom: 10px;
44
  }
45
 
46
  .add-button {
47
  background-color: #28a745;
48
  color: white;
49
  border: none;
50
+ padding: 8px 15px;
51
+ font-size: 14px;
52
  border-radius: 5px;
53
  cursor: pointer;
54
  }
55
 
56
+ /* Modal Window Styling */
57
  .modal {
58
  display: none;
59
  position: fixed;
 
62
  transform: translate(-50%, -50%);
63
  z-index: 1000;
64
  width: 50%;
65
+ background-color: white;
66
+ border-radius: 8px;
 
67
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
68
+ padding: 20px;
69
  }
70
 
71
  .modal-content {
 
82
  position: absolute;
83
  top: 10px;
84
  right: 10px;
85
+ font-size: 18px;
86
  cursor: pointer;
87
  }