source: jobvista-frontend/src/views/shared_css/Modal.css@ befb988

main
Last change on this file since befb988 was befb988, checked in by 223021 <daniel.ilievski.2@…>, 3 months ago

Added an edit profile page for both job seekers and recruiters, where they can upload profile pictures/company logos and edit their profile data. Added profile page specifically for recruiters. Refactored existing code.

  • Property mode set to 100644
File size: 3.6 KB
RevLine 
[19398ad]1
2.modal-wrap {
3 display: inline;
4}
5
6.btn-close-modal {
7 position: absolute;
8 top: 15px;
9 right: 15px;
10 padding: 5px 7px;
11 cursor: pointer;
12}
13
14.react-responsive-modal-modal {
15 background: #f1f1f1;
16 border-radius: 10px;
[befb988]17 min-width: 1000px !important;
18 max-width: 1000px !important;
[19398ad]19 height: auto;
20 padding: 0 !important;
21 overflow-y: hidden;
22}
23
24.react-responsive-modal-closeButton {
25 display: none !important;
26}
27
28.react-responsive-modal-modal .head-modal {
29 border-top-left-radius: 10px;
30 border-top-right-radius: 10px;
31 background-color: rgba(1,38,90,0.9);
[befb988]32 /*background-color: white;*/
[19398ad]33 background-size: cover;
34 padding: 14px 48px;
[befb988]35 /*color: #3A3B3C;*/
[19398ad]36 color: white;
[befb988]37 border-bottom: 1px solid #E5E4E7;
38 display: flex;
39 justify-content: left;
[19398ad]40}
41
42.react-responsive-modal-modal .head-modal h3 {
43 text-transform: uppercase;
44 font-weight: bold;
45 display: inline;
[befb988]46 margin: 0;
[19398ad]47}
48
49
50.react-responsive-modal-modal .modal-content {
51 /*line-height: 1.4;*/
52 padding: 30px 48px;
53 /*height: 100%;*/
54 border: 0;
55}
56
[befb988]57.react-responsive-modal-modal .modal-content form .modal-buttons{
58 display: flex;
59 justify-content: end;
60 gap: 10px;
61 margin-right: 10px;
[19398ad]62}
63
64
65.react-responsive-modal-modal .modal-content form .label {
66 display: block;
67}
68
[befb988]69.react-responsive-modal-modal .modal-content form input {
[19398ad]70 display: block;
71 padding: 5px 10px;
72 width: 100%;
73 border-radius: 3px;
74 border: 1px solid lightgrey;
75}
76
[befb988]77.react-responsive-modal-modal .modal-content form textarea {
[19398ad]78 width: 100%;
79 resize: none;
80 border-radius: 3px;
81 border: 1px solid lightgrey;
82 padding: 5px 10px;
83}
84
85.description-textarea {
86 height: 285px;
[28b3398]87}
[19398ad]88
[befb988]89.application-textarea {
[28b3398]90 height: 100px;
91}
92
93.resume-link {
94 display: block;
95 padding: 5px 10px;
96 width: 100%;
97 border-radius: 3px;
98 border: 1px solid lightgrey;
99}
100.custom {
101 margin-top: 10px;
[19398ad]102}
103
104input:focus, textarea:focus {
105 outline-color: cornflowerblue;
106}
107
[befb988]108.modal-buttons button, .modal-buttons div {
[19398ad]109 position: relative;
110 padding: 5px 20px;
111 border-radius: 5px;
112 border: none;
113 color: white;
[befb988]114 /*text-transform: uppercase;*/
115 font-weight: 500;
[19398ad]116 margin-top: 15px;
[befb988]117 cursor: pointer
118}
119
120.modal-buttons .submit-btn {
121 background: #06367a;
122 transition: background-color 0.3s ease, color 0.3s ease;
123}
124
125.modal-buttons .submit-btn:hover {
126 background-color: #2e579b;
127}
128
129.modal-buttons .cancel-btn {
130 color: #858B96;
131 background-color: #F0F0F0;
132 transition: background-color 0.3s ease, color 0.3s ease;
133}
134.modal-buttons .cancel-btn:hover {
135 background-color: #e0e0e0;
136 color: #555;
[19398ad]137}
138
139.category-option {
140 display: flex;
141 align-items: center;
142 gap: 10px;
143}
144
145/* DELETE MODAL */
146
147.modal-delete-buttons {
148 display: flex;
149 justify-content: flex-end;
150 gap: 10px;
151 margin-top: 25px;
152}
153
154.modal-delete-content {
155 padding: 20px 25px;
156}
157
158.modal-delete-content-inside {
159 display: flex;
160 align-items: center;
161}
162
163.modal-delete-text {
164 padding-left: 35px;
165
166}
167
168.modal-delete-text p {
169 margin: 0;
170}
171
172
[befb988]173.modal-delete-buttons .cancel-btn, .modal-delete-buttons .delete-btn {
[19398ad]174 display: inline;
175 border: none;
176 padding: 5px 25px 5px 25px;
177 border-radius: 7px;
178}
179
[befb988]180.modal-delete-buttons .delete-btn {
[19398ad]181 background-color: red;
182 color: white;
183}
184
185.x-icon {
186 transform: scale(3.3) !important;
187 color: #D93936 !important;
188 padding: 0 15px !important;
189 /*margin-top: 20px !important;*/
190}
191
[28b3398]192.ql-snow .ql-picker.ql-font {
193 display: none;
194}
195.ql-toolbar.ql-snow .ql-picker-options {
196 background-color: white;
197}
198.ql-snow .ql-tooltip {
199 transform: translateX(100px) !important;
200}
201
[19398ad]202
203
204
205
Note: See TracBrowser for help on using the repository browser.