resme 2.0.1 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,305 @@
1
+ /* Europass "Progress" Template Stylesheet */
2
+
3
+ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400;1,600&display=swap');
4
+
5
+ :root {
6
+ --europass-blue: #003399;
7
+ --europass-accent: #0056a1;
8
+ --europass-light-bg: #f3f6fa;
9
+ --europass-sidebar-bg: #f8fafc;
10
+ --europass-border: #d0d7de;
11
+ --text-dark: #222222;
12
+ --text-muted: #57606a;
13
+ --white: #ffffff;
14
+ }
15
+
16
+ * {
17
+ box-sizing: border-box;
18
+ margin: 0;
19
+ padding: 0;
20
+ }
21
+
22
+ body {
23
+ font-family: 'Open Sans', Arial, Helvetica, sans-serif;
24
+ font-size: 13px;
25
+ line-height: 1.5;
26
+ color: var(--text-dark);
27
+ background-color: #eaedf1;
28
+ }
29
+
30
+ /* Base Container */
31
+ .container {
32
+ display: flex;
33
+ max-width: 960px;
34
+ margin: 30px auto;
35
+ background-color: var(--white);
36
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
37
+ border-radius: 4px;
38
+ overflow: hidden;
39
+ min-height: 100vh;
40
+ }
41
+
42
+ /* Left Sidebar - Progress Style */
43
+ .contact-information {
44
+ width: 32%;
45
+ background-color: var(--europass-sidebar-bg);
46
+ padding: 30px 20px;
47
+ border-right: 1px solid var(--europass-border);
48
+ position: relative;
49
+ }
50
+
51
+ /* Embed Europass Logo above sidebar */
52
+ .contact-information::before {
53
+ content: "";
54
+ display: block;
55
+ width: 140px;
56
+ height: 35px;
57
+ margin-bottom: 30px;
58
+ background-image: url("");
59
+ background-repeat: no-repeat;
60
+ background-size: contain;
61
+ }
62
+
63
+ .contact-information .fullname-title {
64
+ display: none;
65
+ }
66
+
67
+ .contact-information h2 {
68
+ font-size: 13px;
69
+ font-weight: 700;
70
+ text-transform: uppercase;
71
+ color: var(--europass-blue);
72
+ letter-spacing: 0.6px;
73
+ border-bottom: 2px solid var(--europass-blue);
74
+ padding-bottom: 4px;
75
+ margin-bottom: 15px;
76
+ }
77
+
78
+ .contact-information .section {
79
+ margin-bottom: 22px;
80
+ }
81
+
82
+ .contact-information .item {
83
+ margin-bottom: 10px;
84
+ word-break: break-word;
85
+ }
86
+
87
+ .contact-information .label {
88
+ display: block;
89
+ font-size: 11px;
90
+ font-weight: 700;
91
+ text-transform: capitalize;
92
+ color: var(--text-muted);
93
+ }
94
+
95
+ .contact-information .value {
96
+ font-size: 12.5px;
97
+ color: var(--text-dark);
98
+ }
99
+
100
+ .contact-information .value .street,
101
+ .contact-information .value .postal-code,
102
+ .contact-information .value .city {
103
+ display: block;
104
+ }
105
+
106
+ /* Right Main Content Area */
107
+ .main {
108
+ width: 68%;
109
+ padding: 30px 35px;
110
+ background-color: var(--white);
111
+ }
112
+
113
+ .main .fullname-title {
114
+ font-size: 26px;
115
+ font-weight: 700;
116
+ color: var(--europass-blue);
117
+ letter-spacing: 0.2px;
118
+ margin-bottom: 25px;
119
+ border-bottom: 3px solid var(--europass-blue);
120
+ padding-bottom: 8px;
121
+ }
122
+
123
+ .main .section {
124
+ margin-bottom: 25px;
125
+ }
126
+
127
+ .main h2 {
128
+ font-size: 15px;
129
+ font-weight: 700;
130
+ color: var(--europass-blue);
131
+ text-transform: uppercase;
132
+ border-bottom: 1.5px solid var(--europass-border);
133
+ padding-bottom: 4px;
134
+ margin-bottom: 14px;
135
+ }
136
+
137
+ /* Items formatting */
138
+ .main .item,
139
+ .main .visit {
140
+ margin-bottom: 16px;
141
+ }
142
+
143
+ .period,
144
+ .year,
145
+ .date {
146
+ display: inline-block;
147
+ font-weight: 700;
148
+ font-size: 11.5px;
149
+ color: var(--europass-blue);
150
+ background-color: var(--europass-light-bg);
151
+ border: 1px solid #dbe3ed;
152
+ padding: 1px 8px;
153
+ border-radius: 12px;
154
+ margin-bottom: 4px;
155
+ }
156
+
157
+ .position,
158
+ .degree,
159
+ .subject {
160
+ font-size: 14px;
161
+ font-weight: 700;
162
+ color: var(--text-dark);
163
+ }
164
+
165
+ .name,
166
+ .school,
167
+ .venue,
168
+ .publisher {
169
+ font-size: 13px;
170
+ font-weight: 600;
171
+ color: var(--europass-accent);
172
+ }
173
+
174
+ .authors {
175
+ font-style: italic;
176
+ color: var(--text-muted);
177
+ }
178
+
179
+ .address {
180
+ font-size: 12px;
181
+ color: var(--text-muted);
182
+ }
183
+
184
+ .summary {
185
+ margin-top: 4px;
186
+ font-size: 12.5px;
187
+ color: var(--text-dark);
188
+ }
189
+
190
+ .summary p {
191
+ margin-bottom: 6px;
192
+ }
193
+
194
+ .summary p:last-child {
195
+ margin-bottom: 0;
196
+ }
197
+
198
+ /* Language Table Styling */
199
+ .languages .item {
200
+ margin-bottom: 10px;
201
+ }
202
+
203
+ .mother-tongue,
204
+ .foreign-language {
205
+ display: flex;
206
+ align-items: center;
207
+ justify-content: space-between;
208
+ border-bottom: 1px dashed var(--europass-border);
209
+ padding: 4px 0;
210
+ }
211
+
212
+ .language {
213
+ font-weight: 600;
214
+ text-transform: capitalize;
215
+ }
216
+
217
+ .level {
218
+ font-size: 11px;
219
+ font-weight: 700;
220
+ text-transform: uppercase;
221
+ color: var(--europass-blue);
222
+ background-color: var(--europass-light-bg);
223
+ border: 1px solid #dbe3ed;
224
+ padding: 1px 8px;
225
+ border-radius: 10px;
226
+ }
227
+
228
+ .level:empty {
229
+ display: none;
230
+ }
231
+
232
+ /* Committees section */
233
+ .committee.item {
234
+ display: flex;
235
+ justify-content: space-between;
236
+ align-items: center;
237
+ border-bottom: 1px dashed var(--europass-border);
238
+ padding-bottom: 4px;
239
+ }
240
+
241
+ .committee .editions {
242
+ font-size: 12px;
243
+ font-weight: 600;
244
+ color: var(--europass-blue);
245
+ }
246
+
247
+ /* Print Optimization with White Sidebar */
248
+ @media print {
249
+ @page {
250
+ size: A4;
251
+ margin: 12mm 15mm;
252
+ }
253
+
254
+ body {
255
+ background-color: var(--white);
256
+ font-size: 11px;
257
+ -webkit-print-color-adjust: exact;
258
+ print-color-adjust: exact;
259
+ }
260
+
261
+ .container {
262
+ max-width: 100%;
263
+ margin: 0;
264
+ box-shadow: none;
265
+ border: none;
266
+ border-radius: 0;
267
+ min-height: auto;
268
+ }
269
+
270
+ .contact-information {
271
+ width: 30%;
272
+ padding: 0 15px 0 0;
273
+ background-color: var(--white) !important;
274
+ border-right: 1px solid var(--europass-border);
275
+ }
276
+
277
+ .main {
278
+ width: 70%;
279
+ padding: 0 0 0 20px;
280
+ }
281
+
282
+ .main .fullname-title {
283
+ font-size: 21px;
284
+ margin-bottom: 15px;
285
+ }
286
+
287
+ .main .section {
288
+ margin-bottom: 14px;
289
+ page-break-inside: avoid;
290
+ }
291
+
292
+ .main .item,
293
+ .main .visit {
294
+ page-break-inside: avoid;
295
+ margin-bottom: 10px;
296
+ }
297
+
298
+ .period,
299
+ .year,
300
+ .date,
301
+ .level {
302
+ background-color: var(--europass-light-bg) !important;
303
+ border: 1px solid #dbe3ed !important;
304
+ }
305
+ }
@@ -0,0 +1,306 @@
1
+ /* Europass Modern Template Stylesheet */
2
+
3
+ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');
4
+
5
+ :root {
6
+ --europass-blue: #0e2d65;
7
+ --europass-accent: #0056a1;
8
+ --europass-light-bg: #f3f5f8;
9
+ --europass-border: #dcdcdc;
10
+ --text-dark: #333333;
11
+ --text-light: #555555;
12
+ --white: #ffffff;
13
+ }
14
+
15
+ * {
16
+ box-sizing: border-box;
17
+ margin: 0;
18
+ padding: 0;
19
+ }
20
+
21
+ body {
22
+ font-family: 'Open Sans', Arial, sans-serif;
23
+ font-size: 13px;
24
+ line-height: 1.5;
25
+ color: var(--text-dark);
26
+ background-color: #e9ecef;
27
+ }
28
+
29
+ /* Base Layout Structure */
30
+ .container {
31
+ display: flex;
32
+ max-width: 960px;
33
+ margin: 20px auto;
34
+ background-color: var(--white);
35
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
36
+ min-height: 100vh;
37
+ }
38
+
39
+ /* Left Sidebar - Europass Blue Section Screen View */
40
+ .contact-information {
41
+ width: 32%;
42
+ background-color: var(--europass-blue);
43
+ color: var(--white);
44
+ padding: 30px 20px;
45
+ }
46
+
47
+ .contact-information .fullname-title {
48
+ display: none; /* Replicated in main section */
49
+ }
50
+
51
+ .contact-information h2 {
52
+ font-size: 14px;
53
+ text-transform: uppercase;
54
+ letter-spacing: 0.8px;
55
+ color: var(--white);
56
+ border-bottom: 2px solid rgba(255, 255, 255, 0.2);
57
+ padding-bottom: 5px;
58
+ margin-bottom: 15px;
59
+ }
60
+
61
+ .contact-information .section {
62
+ margin-bottom: 25px;
63
+ }
64
+
65
+ .contact-information .item {
66
+ margin-bottom: 12px;
67
+ word-break: break-word;
68
+ }
69
+
70
+ .contact-information .label {
71
+ display: block;
72
+ font-size: 10px;
73
+ text-transform: uppercase;
74
+ color: rgba(255, 255, 255, 0.65);
75
+ font-weight: 600;
76
+ margin-bottom: 2px;
77
+ }
78
+
79
+ .contact-information .value {
80
+ font-size: 12px;
81
+ color: var(--white);
82
+ }
83
+
84
+ .contact-information .value .street,
85
+ .contact-information .value .postal-code,
86
+ .contact-information .value .city {
87
+ display: block;
88
+ }
89
+
90
+ /* Right Main Section */
91
+ .main {
92
+ width: 68%;
93
+ padding: 30px 35px;
94
+ background-color: var(--white);
95
+ }
96
+
97
+ .main .fullname-title {
98
+ font-size: 24px;
99
+ font-weight: 700;
100
+ color: var(--europass-blue);
101
+ text-transform: uppercase;
102
+ letter-spacing: 0.5px;
103
+ margin-bottom: 25px;
104
+ border-bottom: 2px solid var(--europass-blue);
105
+ padding-bottom: 10px;
106
+ }
107
+
108
+ .main .section {
109
+ margin-bottom: 25px;
110
+ }
111
+
112
+ .main h2 {
113
+ font-size: 15px;
114
+ color: var(--europass-accent);
115
+ text-transform: uppercase;
116
+ font-weight: 700;
117
+ margin-bottom: 15px;
118
+ border-bottom: 1px solid var(--europass-border);
119
+ padding-bottom: 4px;
120
+ }
121
+
122
+ /* Item Content Layouts */
123
+ .main .item,
124
+ .main .visit {
125
+ margin-bottom: 16px;
126
+ position: relative;
127
+ }
128
+
129
+ /* Period / Dates Styling */
130
+ .period,
131
+ .year,
132
+ .date {
133
+ display: inline-block;
134
+ font-weight: 600;
135
+ color: var(--europass-accent);
136
+ font-size: 12px;
137
+ background-color: var(--europass-light-bg);
138
+ padding: 2px 8px;
139
+ border-radius: 3px;
140
+ margin-bottom: 4px;
141
+ }
142
+
143
+ .position,
144
+ .degree,
145
+ .subject {
146
+ font-size: 14px;
147
+ font-weight: 700;
148
+ color: var(--text-dark);
149
+ }
150
+
151
+ .name,
152
+ .school,
153
+ .venue,
154
+ .publisher {
155
+ font-size: 13px;
156
+ font-weight: 600;
157
+ color: var(--text-light);
158
+ }
159
+
160
+ .authors {
161
+ font-style: italic;
162
+ color: var(--text-light);
163
+ }
164
+
165
+ .address {
166
+ font-size: 12px;
167
+ color: var(--text-light);
168
+ }
169
+
170
+ .summary {
171
+ margin-top: 5px;
172
+ color: var(--text-dark);
173
+ }
174
+
175
+ .summary p {
176
+ margin-bottom: 6px;
177
+ }
178
+
179
+ .summary p:last-child {
180
+ margin-bottom: 0;
181
+ }
182
+
183
+ /* Language Section Specifics */
184
+ .languages .item {
185
+ margin-bottom: 10px;
186
+ }
187
+
188
+ .mother-tongue,
189
+ .foreign-language {
190
+ display: flex;
191
+ align-items: center;
192
+ justify-content: space-between;
193
+ background-color: var(--europass-light-bg);
194
+ padding: 6px 12px;
195
+ border-radius: 4px;
196
+ margin-top: 5px;
197
+ }
198
+
199
+ .language {
200
+ font-weight: 600;
201
+ text-transform: capitalize;
202
+ }
203
+
204
+ .level {
205
+ font-size: 11px;
206
+ text-transform: uppercase;
207
+ background-color: var(--europass-accent);
208
+ color: var(--white);
209
+ padding: 1px 6px;
210
+ border-radius: 3px;
211
+ }
212
+
213
+ .level:empty {
214
+ display: none;
215
+ }
216
+
217
+ /* Committee Section */
218
+ .committee.item {
219
+ display: flex;
220
+ justify-content: space-between;
221
+ align-items: center;
222
+ border-bottom: 1px dashed var(--europass-border);
223
+ padding-bottom: 6px;
224
+ }
225
+
226
+ .committee .editions {
227
+ font-size: 12px;
228
+ color: var(--europass-accent);
229
+ font-weight: 600;
230
+ }
231
+
232
+ /* Print Styles with White Sidebar */
233
+ @media print {
234
+ @page {
235
+ size: A4;
236
+ margin: 12mm 15mm;
237
+ }
238
+
239
+ body {
240
+ background-color: var(--white);
241
+ font-size: 11px;
242
+ -webkit-print-color-adjust: exact;
243
+ print-color-adjust: exact;
244
+ }
245
+
246
+ .container {
247
+ max-width: 100%;
248
+ margin: 0;
249
+ box-shadow: none;
250
+ min-height: auto;
251
+ }
252
+
253
+ /* Sidebar styling for print */
254
+ .contact-information {
255
+ width: 30%;
256
+ padding: 15px 15px 15px 0;
257
+ background-color: var(--white) !important;
258
+ color: var(--text-dark) !important;
259
+ border-right: 1px solid var(--europass-border);
260
+ }
261
+
262
+ .contact-information h2 {
263
+ color: var(--europass-blue) !important;
264
+ border-bottom: 2px solid var(--europass-blue) !important;
265
+ }
266
+
267
+ .contact-information .label {
268
+ color: var(--text-light) !important;
269
+ }
270
+
271
+ .contact-information .value {
272
+ color: var(--text-dark) !important;
273
+ }
274
+
275
+ .main {
276
+ width: 70%;
277
+ padding: 15px 0 15px 20px;
278
+ }
279
+
280
+ .main .fullname-title {
281
+ font-size: 20px;
282
+ margin-bottom: 15px;
283
+ }
284
+
285
+ .main .section {
286
+ margin-bottom: 15px;
287
+ page-break-inside: avoid;
288
+ }
289
+
290
+ .main .item,
291
+ .main .visit {
292
+ page-break-inside: avoid;
293
+ margin-bottom: 10px;
294
+ }
295
+
296
+ .period,
297
+ .year,
298
+ .date {
299
+ background-color: var(--europass-light-bg) !important;
300
+ }
301
+
302
+ .level {
303
+ background-color: var(--europass-accent) !important;
304
+ color: var(--white) !important;
305
+ }
306
+ }