source: CookCraft-FrontEnd/CookCraft-FrontEnd-master/cookcraft-app/src/css/ProfileCss/profileSection.module.css@ d7b7f00

Last change on this file since d7b7f00 was d7b7f00, checked in by Gorazd Biskoski <gorazdbiskoskii@…>, 4 weeks ago

Add project

  • Property mode set to 100644
File size: 2.3 KB
Line 
1.profileSection {
2 display: flex;
3 flex-direction: column;
4 width: 100%;
5}
6
7.profilePicture {
8 display: flex;
9 align-items: center;
10 margin-bottom: 20px;
11}
12
13.profilePicture img {
14 border-radius: 50%;
15 width: 60px;
16 height: 60px;
17 object-fit: cover;
18 object-position: center;
19 margin-right: 20px;
20}
21
22.changeBtn, .deleteBtn {
23 background-color: #007bff;
24 border: none;
25 padding: 8px 12px;
26 color: #fff;
27 margin-right: 10px;
28 border-radius: 4px;
29 cursor: pointer;
30}
31
32.deleteBtn {
33 background-color: #ff5b5b;
34}
35
36.formGroup {
37 margin-bottom: 15px;
38}
39
40.formGroup label {
41 display: block;
42 margin-bottom: 5px;
43 font-size: 14px;
44 color: #555;
45}
46
47.formGroup input, .formGroup textarea {
48 width: 90%;
49 padding: 8px;
50 border: 1px solid #e0e0e0;
51 border-radius: 4px;
52 font-size: 14px;
53}
54
55.formGroup input[disabled] {
56 background-color: #f7f7f7;
57}
58
59.addressDetails {
60 margin-top: 15px;
61 display: flex;
62 justify-content: space-between;
63 align-items: flex-start;
64 width: 95%;
65}
66
67.addressNumber,
68.addressFloor {
69 display: inline-block;
70 width: 48%;
71}
72
73.addressFloor {
74 padding-right: 6px;
75}
76
77.note {
78 font-size: 12px;
79 color: #888;
80 margin-top: 5px;
81}
82
83.profileForm {
84 display: flex;
85 flex-direction: column;
86 justify-content: space-between;
87 height: 59vh;
88 position: relative;
89}
90
91.buttonContainer {
92 display: flex;
93 justify-content: flex-end;
94 margin-top: auto;
95}
96
97.saveBtn {
98 padding: 10px 20px;
99 background-color: #FFA550;
100 color: #fff;
101 border: none;
102 border-radius: 7.5px;
103 cursor: pointer;
104 transition: background-color 0.3s ease;
105 margin-right: 70px;
106}
107
108.saveBtn:hover {
109 background-color: #e59400;
110}
111
112@media (max-width: 768px) {
113 .profilePicture {
114 flex-direction: column;
115 align-items: center;
116 text-align: center;
117 }
118
119 .profilePicture img {
120 margin-right: 0;
121 margin-bottom: 10px;
122 }
123
124 .addressDetails {
125 flex-direction: column;
126 width: 100%;
127 }
128
129 .addressNumber,
130 .addressFloor {
131 width: 100%;
132 padding-right: 0;
133 }
134
135 .buttonContainer {
136 justify-content: center;
137 }
138
139 .saveBtn {
140 width: 100%;
141 margin-right: 0;
142 }
143}
Note: See TracBrowser for help on using the repository browser.