source: jobvista-frontend/src/App.css@ b248810

main
Last change on this file since b248810 was 28b3398, checked in by 223021 <daniel.ilievski.2@…>, 3 weeks ago

Implemented job application functionality, added job advertisement filtering and replaced text areas with editors

  • Property mode set to 100644
File size: 3.7 KB
Line 
1@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;500;600;700;800&display=swap');
2@import url('https://fonts.googleapis.com/css2?family=Cabin:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
3
4.App {
5 background-color: rgb(243, 242, 241);
6 //background-color: #EBF2FC;
7 height: 100vh;
8 overflow-y: auto;
9}
10
11.or-thing {
12 border-top: 1px solid rgb(213, 213, 213);
13 display: flex;
14 -webkit-box-pack: center;
15 justify-content: center;
16margin-bottom: 20px;
17 margin-top: 20px;
18}
19
20.or-thing span {
21 margin-top: -13px;
22 background-color: rgb(255, 255, 255);
23 padding: 0px 8px;
24}
25
26.form-container {
27 background-color: white;
28 border-radius: 10px;
29 padding: 15px 30px;
30 margin-top: 80px;
31}
32
33.container {
34 width: 80% !important;
35 max-width: 1500px !important;
36}
37
38
39/*font-family: 'Ubuntu', sans-serif;*/
40/*font-family: 'Cairo', sans-serif;*/
41
42.react-responsive-modal-overlay {
43 backdrop-filter: blur(3px);
44}
45
46/*CARDS*/
47
48.col {
49 height: 280px !important;
50}
51
52.add-new-card {
53 border-radius: 8px;
54 background-color: transparent;
55 border: 3px dashed grey;
56 transition: all 0.3s ease;
57 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
58 transform: translate(0, 0);
59 height: 260px;
60 width: 100%;
61 color: grey;
62 font-family: Ubuntu;
63 text-transform: uppercase;
64}
65.add-new-card h3 {
66 font-size: 25px;
67}
68.add-new-card:hover {
69 /*transform: translate(0, 8px);*/
70 /*box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);*/
71 color: black;
72 border: 3px dashed black;
73}
74
75.custom-card {
76 //border: 1px solid lightgray;
77 border-radius: 8px;
78 background-color: white;
79 transition: all 0.3s ease;
80 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
81 transform: translate(0, 0);
82 height: 260px;
83}
84
85.custom-card:hover {
86 transform: translate(0, 8px);
87 box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
88}
89
90.custom-card .card-head {
91 padding: 25px;
92 padding-bottom: 0 !important;
93}
94
95.custom-card .card-head .job-type {
96 font-size: 12px !important;
97 margin-left: 6px !important;
98 position: relative;
99 bottom: 3px;
100}
101
102.custom-card .card-head .expired {
103 font-size: 12px !important;
104 margin-left: 8px !important;
105 position: relative;
106 bottom: 3px;
107}
108
109.custom-card .card-head .card-management-btns {
110 float: right;
111 scale: 130%;
112 display: flex;
113 gap: 5px;
114 transition: 0.2s;
115}
116.custom-card .card-head .card-management-btns i:hover {
117 opacity: 0.5;
118 cursor: pointer;
119}
120
121.custom-card .card-body {
122 padding: 25px;
123 padding-top: 15px !important;
124 height: 100%;
125}
126.custom-card .card-body span{
127 font-size: 15px;
128}
129
130.custom-card .card-body .card-title {
131 margin-top: 10px;
132}
133
134
135.custom-card .card-body .card-title h5 {
136 display: inline;
137}
138
139
140.custom-card .card-body .hourly-salary {
141 margin-bottom: 30px;
142 display: inline;
143}
144
145.custom-card .card-body .card-info {
146 color: gray;
147 margin: 13px 0;
148}
149
150.custom-card .card-body .aligned {
151 display: flex;
152 justify-content: center;
153 gap: 8px;
154 text-align: center;
155 margin-top: 25px;
156 position: relative;
157
158}
159
160.custom-card .card-body .aligned a {
161 text-decoration: none;
162}
163
164
165.card-button {
166 border: 0;
167 border-radius: 8px;
168 width: 45%;
169 background-color: rgba(207, 235, 255, 1);
170 //background-size: 200% auto;
171 //background-image: linear-gradient(to right, #a1c4fd 0%, aliceblue 61%, #a1c4fd 100%);
172 color: black;
173 font-weight: bold;
174 padding: 5px 10px;
175 transition: 0.2s;
176}
177
178.card-button:only-child {
179 width: 70%;
180}
181.card-button:not(.disabled):hover{
182 background-color: rgb(187, 215, 235);
183 //background-position: right center;
184 color: black;
185}
186
187.disabled {
188 cursor: default !important;
189 opacity: 0.6;
190}
191
192
193
Note: See TracBrowser for help on using the repository browser.