@prosophia/personal-cv 0.0.4 → 0.0.5

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.
package/dist/index.css DELETED
@@ -1,648 +0,0 @@
1
- /* src/styles/About.module.css */
2
- .about {
3
- scroll-margin-top: 96px;
4
- margin-bottom: 48px;
5
- }
6
- .card {
7
- display: flex;
8
- flex-direction: column;
9
- gap: 32px;
10
- align-items: flex-start;
11
- background-color: var(--card-background);
12
- padding: 24px;
13
- border-radius: 12px;
14
- box-shadow: 0 1px 3px var(--shadow-color);
15
- border: 1px solid var(--border-color);
16
- }
17
- @media (min-width: 768px) {
18
- .card {
19
- flex-direction: row;
20
- align-items: center;
21
- padding: 40px;
22
- }
23
- }
24
- .imageWrapper {
25
- flex-shrink: 0;
26
- }
27
- .profileImage {
28
- width: 128px;
29
- height: 128px;
30
- border-radius: 50%;
31
- background-size: cover;
32
- background-position: center;
33
- background-repeat: no-repeat;
34
- box-shadow: 0 4px 6px -1px var(--shadow-color);
35
- ring: 4px solid var(--background-color);
36
- }
37
- @media (min-width: 768px) {
38
- .profileImage {
39
- width: 160px;
40
- height: 160px;
41
- }
42
- }
43
- .content {
44
- display: flex;
45
- flex-direction: column;
46
- justify-content: center;
47
- gap: 12px;
48
- }
49
- .greeting {
50
- font-size: 30px;
51
- font-weight: 700;
52
- letter-spacing: -0.02em;
53
- color: var(--text-color);
54
- margin-bottom: 8px;
55
- line-height: 1.2;
56
- }
57
- @media (min-width: 768px) {
58
- .greeting {
59
- font-size: 36px;
60
- }
61
- }
62
- .title {
63
- font-size: 18px;
64
- font-weight: 500;
65
- color: var(--text-secondary);
66
- line-height: 1.4;
67
- }
68
- .bio {
69
- font-size: 16px;
70
- font-weight: 400;
71
- color: var(--text-secondary);
72
- line-height: 1.6;
73
- max-width: 672px;
74
- margin-top: 8px;
75
- }
76
- .socialLinks {
77
- display: flex;
78
- flex-wrap: wrap;
79
- gap: 16px;
80
- margin-top: 8px;
81
- }
82
- .socialLink {
83
- display: flex;
84
- align-items: center;
85
- justify-content: center;
86
- color: var(--text-secondary);
87
- transition: color 0.2s ease;
88
- }
89
- .socialLink:hover {
90
- color: var(--primary-color);
91
- }
92
- .socialLink span {
93
- font-size: 24px;
94
- }
95
-
96
- /* src/styles/CVSection.module.css */
97
- .cv {
98
- scroll-margin-top: 96px;
99
- margin-bottom: 64px;
100
- }
101
- .card {
102
- position: relative;
103
- overflow: hidden;
104
- background-color: var(--primary-color);
105
- border-radius: 12px;
106
- padding: 32px;
107
- text-align: center;
108
- color: var(--background-color);
109
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
110
- }
111
- @media (min-width: 768px) {
112
- .card {
113
- padding: 48px;
114
- }
115
- }
116
- .content {
117
- position: relative;
118
- z-index: 10;
119
- display: flex;
120
- flex-direction: column;
121
- align-items: center;
122
- gap: 24px;
123
- }
124
- .iconWrapper {
125
- position: relative;
126
- display: flex;
127
- align-items: center;
128
- justify-content: center;
129
- padding: 12px;
130
- border-radius: 50%;
131
- }
132
- .iconWrapper::before {
133
- content: "";
134
- position: absolute;
135
- inset: 0;
136
- background-color: var(--background-color);
137
- opacity: 0.2;
138
- border-radius: 50%;
139
- }
140
- .iconWrapper span {
141
- position: relative;
142
- font-size: 30px;
143
- }
144
- .textContent {
145
- display: flex;
146
- flex-direction: column;
147
- gap: 8px;
148
- }
149
- .title {
150
- font-size: 24px;
151
- font-weight: 700;
152
- margin-bottom: 8px;
153
- }
154
- @media (min-width: 768px) {
155
- .title {
156
- font-size: 30px;
157
- }
158
- }
159
- .description {
160
- color: var(--background-color);
161
- opacity: 0.8;
162
- max-width: 512px;
163
- margin: 0 auto;
164
- font-size: 14px;
165
- line-height: 1.6;
166
- }
167
- @media (min-width: 768px) {
168
- .description {
169
- font-size: 16px;
170
- }
171
- }
172
- .downloadBtn {
173
- display: inline-flex;
174
- align-items: center;
175
- gap: 8px;
176
- padding: 12px 24px;
177
- background-color: var(--background-color);
178
- color: var(--text-color);
179
- font-size: 14px;
180
- font-weight: 700;
181
- border-radius: 8px;
182
- box-shadow: 0 1px 3px var(--shadow-color);
183
- transition: background-color 0.2s ease;
184
- border: none;
185
- cursor: pointer;
186
- }
187
- @media (min-width: 768px) {
188
- .downloadBtn {
189
- font-size: 16px;
190
- }
191
- }
192
- .downloadBtn:hover {
193
- background-color: var(--hover-background);
194
- }
195
- .background {
196
- position: absolute;
197
- top: 0;
198
- left: 0;
199
- width: 100%;
200
- height: 100%;
201
- opacity: 0.1;
202
- pointer-events: none;
203
- background-image:
204
- radial-gradient(
205
- circle at 20% 50%,
206
- var(--background-color) 0%,
207
- transparent 20%),
208
- radial-gradient(
209
- circle at 80% 80%,
210
- var(--background-color) 0%,
211
- transparent 20%);
212
- }
213
-
214
- /* src/styles/Footer.module.css */
215
- .footer {
216
- background-color: var(--card-background);
217
- border-top: 1px solid var(--border-light);
218
- padding: 32px 16px;
219
- }
220
- .content {
221
- display: flex;
222
- flex-direction: column;
223
- align-items: center;
224
- gap: 16px;
225
- text-align: center;
226
- max-width: 960px;
227
- margin: 0 auto;
228
- }
229
- .copyright {
230
- font-size: 14px;
231
- color: var(--text-secondary);
232
- }
233
- .emailWrapper {
234
- display: flex;
235
- align-items: center;
236
- gap: 8px;
237
- font-size: 14px;
238
- color: var(--text-secondary);
239
- }
240
- .emailWrapper span {
241
- font-size: 16px;
242
- }
243
- .email {
244
- color: var(--text-secondary);
245
- transition: color 0.2s ease;
246
- }
247
- .email:hover {
248
- color: var(--primary-color);
249
- }
250
-
251
- /* src/styles/Header.module.css */
252
- .header {
253
- position: sticky;
254
- top: 0;
255
- z-index: 50;
256
- background-color: var(--header-bg);
257
- backdrop-filter: blur(12px);
258
- border-bottom: 1px solid var(--border-light);
259
- }
260
- .headerInner {
261
- display: flex;
262
- align-items: center;
263
- justify-content: space-between;
264
- max-width: 960px;
265
- margin: 0 auto;
266
- padding: 12px 16px;
267
- }
268
- @media (min-width: 768px) {
269
- .headerInner {
270
- padding: 12px 40px;
271
- }
272
- }
273
- .logo {
274
- display: flex;
275
- align-items: center;
276
- gap: 16px;
277
- }
278
- .logoIcon {
279
- width: 32px;
280
- height: 32px;
281
- display: flex;
282
- align-items: center;
283
- justify-content: center;
284
- color: var(--primary-color);
285
- }
286
- .logoIcon span {
287
- font-size: 30px;
288
- }
289
- .siteName {
290
- font-size: 18px;
291
- font-weight: 700;
292
- letter-spacing: -0.015em;
293
- color: var(--text-color);
294
- }
295
- .desktopNav {
296
- display: none;
297
- flex: 1;
298
- justify-content: flex-end;
299
- align-items: center;
300
- gap: 32px;
301
- }
302
- @media (min-width: 768px) {
303
- .desktopNav {
304
- display: flex;
305
- }
306
- }
307
- .navLinks {
308
- display: flex;
309
- align-items: center;
310
- gap: 24px;
311
- }
312
- .navLink {
313
- font-size: 14px;
314
- font-weight: 500;
315
- color: var(--text-color);
316
- transition: color 0.2s ease;
317
- }
318
- .navLink:hover {
319
- color: var(--primary-color);
320
- }
321
- .contactBtn {
322
- display: flex;
323
- align-items: center;
324
- justify-content: center;
325
- min-width: 84px;
326
- height: 36px;
327
- padding: 0 16px;
328
- background-color: var(--primary-color);
329
- color: var(--background-color);
330
- font-size: 14px;
331
- font-weight: 700;
332
- border-radius: 8px;
333
- box-shadow: 0 1px 2px var(--shadow-color);
334
- transition: opacity 0.2s ease;
335
- }
336
- .contactBtn:hover {
337
- opacity: 0.85;
338
- }
339
- .mobileMenuBtn {
340
- display: flex;
341
- align-items: center;
342
- justify-content: center;
343
- color: var(--text-color);
344
- background: none;
345
- border: none;
346
- cursor: pointer;
347
- padding: 8px;
348
- }
349
- @media (min-width: 768px) {
350
- .mobileMenuBtn {
351
- display: none;
352
- }
353
- }
354
- .mobileMenu {
355
- display: none;
356
- position: fixed;
357
- top: 61px;
358
- left: 0;
359
- right: 0;
360
- background-color: var(--background-color);
361
- border-bottom: 1px solid var(--border-light);
362
- padding: 16px;
363
- box-shadow: 0 4px 6px -1px var(--shadow-color);
364
- z-index: 40;
365
- }
366
- .mobileMenu.open {
367
- display: block;
368
- }
369
- @media (min-width: 768px) {
370
- .mobileMenu {
371
- display: none !important;
372
- }
373
- }
374
- .mobileNavLinks {
375
- display: flex;
376
- flex-direction: column;
377
- gap: 16px;
378
- }
379
- .mobileNavLink {
380
- font-size: 16px;
381
- font-weight: 500;
382
- color: var(--text-color);
383
- padding: 8px 0;
384
- }
385
- .mobileContactBtn {
386
- display: flex;
387
- align-items: center;
388
- justify-content: center;
389
- width: 100%;
390
- height: 44px;
391
- margin-top: 16px;
392
- background-color: var(--primary-color);
393
- color: white;
394
- font-size: 14px;
395
- font-weight: 700;
396
- border-radius: 8px;
397
- }
398
- .themeToggle {
399
- display: flex;
400
- align-items: center;
401
- justify-content: center;
402
- width: 40px;
403
- height: 40px;
404
- background: none;
405
- border: 1px solid var(--border-color);
406
- border-radius: 8px;
407
- cursor: pointer;
408
- color: var(--text-color);
409
- transition: all 0.2s ease;
410
- }
411
- .themeToggle:hover {
412
- background-color: var(--hover-background);
413
- border-color: var(--text-secondary);
414
- }
415
- .themeToggle span {
416
- font-size: 20px;
417
- }
418
- .mobileActions {
419
- display: flex;
420
- align-items: center;
421
- gap: 8px;
422
- }
423
- @media (min-width: 768px) {
424
- .mobileActions {
425
- display: none;
426
- }
427
- }
428
- .mobileThemeToggle {
429
- display: flex;
430
- align-items: center;
431
- justify-content: center;
432
- width: 40px;
433
- height: 40px;
434
- background: none;
435
- border: none;
436
- cursor: pointer;
437
- color: var(--text-color);
438
- transition: color 0.2s ease;
439
- }
440
- .mobileThemeToggle:hover {
441
- color: var(--primary-color);
442
- }
443
- .mobileThemeToggle span {
444
- font-size: 22px;
445
- }
446
-
447
- /* src/styles/Projects.module.css */
448
- .projects {
449
- scroll-margin-top: 96px;
450
- margin-bottom: 48px;
451
- }
452
- .header {
453
- display: flex;
454
- align-items: center;
455
- justify-content: space-between;
456
- margin-bottom: 24px;
457
- padding: 0 8px;
458
- }
459
- .title {
460
- font-size: 24px;
461
- font-weight: 700;
462
- letter-spacing: -0.015em;
463
- color: var(--text-color);
464
- }
465
- .viewAllLink {
466
- font-size: 14px;
467
- font-weight: 500;
468
- color: var(--primary-color);
469
- transition: text-decoration 0.2s ease;
470
- }
471
- .viewAllLink:hover {
472
- text-decoration: underline;
473
- }
474
- .grid {
475
- display: grid;
476
- grid-template-columns: 1fr;
477
- gap: 24px;
478
- }
479
- @media (min-width: 768px) {
480
- .grid {
481
- grid-template-columns: repeat(2, 1fr);
482
- }
483
- }
484
- .card {
485
- display: flex;
486
- flex-direction: column;
487
- background-color: var(--card-background);
488
- border-radius: 12px;
489
- overflow: hidden;
490
- box-shadow: 0 1px 3px var(--shadow-color);
491
- border: 1px solid var(--border-color);
492
- transition: box-shadow 0.2s ease;
493
- }
494
- .card:hover {
495
- box-shadow: 0 4px 6px -1px var(--shadow-color);
496
- }
497
- .imageWrapper {
498
- width: 100%;
499
- overflow: hidden;
500
- }
501
- .image {
502
- width: 100%;
503
- aspect-ratio: 16 / 9;
504
- background-size: cover;
505
- background-position: center;
506
- background-repeat: no-repeat;
507
- transition: transform 0.5s ease;
508
- }
509
- .card:hover .image {
510
- transform: scale(1.05);
511
- }
512
- .content {
513
- padding: 20px;
514
- display: flex;
515
- flex-direction: column;
516
- gap: 8px;
517
- }
518
- .projectTitle {
519
- font-size: 18px;
520
- font-weight: 700;
521
- color: var(--text-color);
522
- line-height: 1.3;
523
- }
524
- .description {
525
- font-size: 14px;
526
- color: var(--text-secondary);
527
- line-height: 1.6;
528
- }
529
- .caseStudyLink {
530
- display: inline-flex;
531
- align-items: center;
532
- gap: 4px;
533
- margin-top: 8px;
534
- font-size: 14px;
535
- font-weight: 700;
536
- color: var(--primary-color);
537
- transition: gap 0.2s ease;
538
- }
539
- .caseStudyLink:hover {
540
- gap: 8px;
541
- }
542
- .caseStudyLink span {
543
- font-size: 14px;
544
- }
545
-
546
- /* src/styles/Publications.module.css */
547
- .publications {
548
- scroll-margin-top: 96px;
549
- margin-bottom: 48px;
550
- }
551
- .header {
552
- display: flex;
553
- align-items: center;
554
- justify-content: space-between;
555
- margin-bottom: 24px;
556
- padding: 0 8px;
557
- }
558
- .title {
559
- font-size: 24px;
560
- font-weight: 700;
561
- letter-spacing: -0.015em;
562
- color: var(--text-color);
563
- }
564
- .list {
565
- display: flex;
566
- flex-direction: column;
567
- background-color: var(--card-background);
568
- border-radius: 12px;
569
- box-shadow: 0 1px 3px var(--shadow-color);
570
- border: 1px solid var(--border-color);
571
- overflow: hidden;
572
- }
573
- .item {
574
- padding: 24px;
575
- display: flex;
576
- flex-direction: column;
577
- gap: 8px;
578
- border-bottom: 1px solid var(--border-light);
579
- transition: background-color 0.2s ease;
580
- }
581
- .item:last-child {
582
- border-bottom: none;
583
- }
584
- .item:hover {
585
- background-color: var(--hover-background);
586
- }
587
- .itemHeader {
588
- display: flex;
589
- justify-content: space-between;
590
- align-items: flex-start;
591
- gap: 16px;
592
- }
593
- .pubTitle {
594
- font-size: 18px;
595
- font-weight: 700;
596
- color: var(--text-color);
597
- line-height: 1.3;
598
- }
599
- .year {
600
- display: none;
601
- font-size: 12px;
602
- font-weight: 700;
603
- color: var(--text-secondary);
604
- background-color: var(--border-light);
605
- padding: 4px 8px;
606
- border-radius: 4px;
607
- text-transform: uppercase;
608
- letter-spacing: 0.05em;
609
- flex-shrink: 0;
610
- }
611
- @media (min-width: 640px) {
612
- .year {
613
- display: inline-block;
614
- }
615
- }
616
- .authors {
617
- font-size: 14px;
618
- color: var(--text-color);
619
- }
620
- .venue {
621
- font-size: 14px;
622
- font-style: italic;
623
- color: var(--text-secondary);
624
- }
625
- .links {
626
- display: flex;
627
- gap: 12px;
628
- margin-top: 8px;
629
- flex-wrap: wrap;
630
- }
631
- .linkBtn {
632
- display: inline-flex;
633
- align-items: center;
634
- gap: 4px;
635
- padding: 6px 12px;
636
- background-color: var(--link-btn-bg);
637
- color: var(--primary-color);
638
- font-size: 12px;
639
- font-weight: 700;
640
- border-radius: 9999px;
641
- transition: background-color 0.2s ease;
642
- }
643
- .linkBtn:hover {
644
- background-color: var(--link-btn-hover);
645
- }
646
- .linkBtn span {
647
- font-size: 14px;
648
- }