/* =========================================================================== PLEVIX Životopis – rozšírená sada šablón (v73) --------------------------------------------------------------------------- Základ (modern, classic, minimal, ats) je v cv.css. Tu je 16 ďalších, spolu 20. Štruktúra dokumentu, na ktorú sa dá napojiť: .cv-paper > .cv-layout > aside.cv-side + main.cv-main .cv-photo .cv-name .cv-headline .cv-section h2 .cv-item h3 .cv-item .meta .cv-contact .cv-text .skill-tags span Farba sa berie z premennej --accent. Pozn.: .cv-layout je v základe mriežka 68mm + 1fr. Šablóny bez bočného panela ho prepínajú na display:block (rovnako ako to robí classic). =========================================================================== */ /* ---------- 5. SIDEBAR VPRAVO ---------- */ .template-sidebar-right .cv-layout{grid-template-columns:1fr 68mm} .template-sidebar-right .cv-side{order:2} .template-sidebar-right .cv-main{order:1} /* ---------- 6. SVETLÝ BOČNÝ PANEL ---------- */ .template-light-side{--accent:#4f46e5} .template-light-side .cv-side{background:#f1f4f9;color:#1d2433} .template-light-side .cv-side .cv-section h2{color:#4c5a72;border-color:#d3dae5} .template-light-side .cv-side .meta{color:#68748b} .template-light-side .cv-side .skill-tags span{background:#e2e8f4;color:#33415b} .template-light-side .cv-photo{background:#dbe2ee} /* ---------- 7. HLAVIČKOVÝ PRUH (bez bočného panela) ---------- */ .template-band .cv-layout{display:block} .template-band .cv-side{ background:var(--accent);color:#fff;padding:14mm 16mm 10mm; } .template-band .cv-main{padding:12mm 16mm 15mm} .template-band .cv-photo{ float:right;width:30mm;height:35mm;border-radius:3mm;margin:0 0 4mm 8mm; } .template-band .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .template-band .cv-side .cv-section h2{color:#e5e0ff;border-color:#ffffff40} .template-band .cv-headline{color:#ffffffcc} .template-band{--accent:#4f46e5} /* ---------- 8. ELEGANT – pätkové písmo, tenké linky ---------- */ .template-elegant{--accent:#8a6d3b;font-family:Georgia,"Times New Roman",serif} .template-elegant .cv-layout{display:block} .template-elegant .cv-side{background:#fff;color:#1d2433;padding:16mm 18mm 6mm;text-align:center} .template-elegant .cv-main{padding:0 18mm 16mm} .template-elegant .cv-photo{ width:32mm;height:32mm;border-radius:50%;margin:0 auto 6mm; } .template-elegant .cv-name{font-weight:400;letter-spacing:.06em} .template-elegant .cv-section h2{ text-align:center;font-weight:400;letter-spacing:.14em; border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:2mm 0; } .template-elegant .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .template-elegant .cv-side .cv-section h2{color:#6b6152;border-color:#ddd} .template-elegant .skill-tags span{background:transparent;border:1px solid #ddd;color:#5a5145} /* ---------- 9. TIMELINE – kariéra ako os ---------- */ .template-timeline{--accent:#0f766e} .template-timeline .cv-main .cv-item{ position:relative;padding-left:7mm;border-left:1px solid #d6dee6;padding-bottom:2mm; } .template-timeline .cv-main .cv-item:before{ content:"";position:absolute;left:-1.6mm;top:1.5mm; width:3mm;height:3mm;border-radius:50%;background:var(--accent); } .template-timeline .cv-side{background:#0f2e2b} .template-timeline .cv-section h2{color:#0f766e;border-color:#cfe0dd} .template-timeline .cv-side .cv-section h2{color:#99f6e4} /* ---------- 10. COMPACT – všetko na jednu stranu ---------- */ .template-compact .cv-side{padding:12mm 7mm} .template-compact .cv-main{padding:12mm 11mm} .template-compact .cv-name{font-size:22px} .template-compact .cv-section{margin-bottom:5mm} .template-compact .cv-section h2{font-size:10px;padding-bottom:2mm;margin-bottom:2.5mm} .template-compact .cv-item{margin-bottom:3mm} .template-compact .cv-item h3{font-size:10px} .template-compact .cv-item p,.template-compact .cv-text,.template-compact .cv-contact{font-size:10px;line-height:1.45} .template-compact .cv-photo{width:30mm;height:34mm;margin-bottom:5mm} /* ---------- 11. MONO – čiernobiely, pre tlač ---------- */ .template-mono{--accent:#111} .template-mono .cv-layout{display:block} .template-mono .cv-side{background:#fff;color:#111;padding:15mm 16mm 5mm;border-bottom:2px solid #111} .template-mono .cv-main{padding:8mm 16mm 15mm} .template-mono .cv-photo{display:none} .template-mono .cv-section h2{border-bottom:1px solid #111;color:#111} .template-mono .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .template-mono .cv-side .cv-section h2{color:#111;border-color:#111} .template-mono .skill-tags span{background:transparent;border:1px solid #111;color:#111} .template-mono .cv-item .meta{color:#444} /* ---------- 12. ACADEMIC – pre vedu a školstvo ---------- */ .template-academic{--accent:#1e3a8a;font-family:Georgia,serif} .template-academic .cv-layout{display:block} .template-academic .cv-side{background:#fff;color:#1d2433;padding:16mm 18mm 4mm} .template-academic .cv-main{padding:0 18mm 16mm} .template-academic .cv-photo{display:none} .template-academic .cv-name{font-size:24px;letter-spacing:.02em} .template-academic .cv-section h2{ font-family:Arial,sans-serif;font-size:10px;letter-spacing:.14em; border-bottom:2px solid #1e3a8a;color:#1e3a8a; } .template-academic .cv-side .cv-section{display:block;width:auto;margin:0 0 5mm} .template-academic .cv-item h3{font-size:11px} .template-academic .cv-item .meta{font-style:italic} /* ---------- 13. CREATIVE – výrazné farby pre kreatívne odbory ---------- */ .template-creative{--accent:#db2777} .template-creative .cv-side{background:linear-gradient(170deg,#831843,#db2777)} .template-creative .cv-photo{border-radius:50%;width:36mm;height:36mm} .template-creative .cv-name{letter-spacing:-.02em} .template-creative .cv-section h2{ border:0;color:var(--accent);font-size:12px;letter-spacing:.02em;text-transform:none; } .template-creative .cv-main .cv-section h2:after{ content:"";display:block;width:14mm;height:1.2mm;background:var(--accent);margin-top:1.5mm; } .template-creative .cv-side .cv-section h2{color:#fbcfe8;border:0} .template-creative .cv-main .skill-tags span{background:#fce7f3;color:#9d174d} /* ---------- 14. TECH – pre IT pozície ---------- */ .template-tech{--accent:#0ea5e9} .template-tech .cv-side{background:#0b1120} .template-tech .cv-name{font-family:"Segoe UI",Roboto,Arial,sans-serif;letter-spacing:-.02em} .template-tech .cv-section h2{ font-family:Consolas,"Courier New",monospace;font-size:10px; color:var(--accent);border-color:#cfe6f5; } .template-tech .cv-section h2:before{content:"// ";opacity:.6} .template-tech .cv-side .cv-section h2{color:#7dd3fc;border-color:#ffffff26} .template-tech .skill-tags span{border-radius:1mm;font-family:Consolas,monospace} .template-tech .cv-main .skill-tags span{background:#e0f2fe;color:#075985} /* ---------- 15. EXECUTIVE – manažérsky, striedmy ---------- */ .template-executive{--accent:#111827} .template-executive .cv-layout{display:block} .template-executive .cv-side{ background:#111827;color:#fff;padding:13mm 16mm 9mm; } .template-executive .cv-main{padding:11mm 16mm 15mm} .template-executive .cv-photo{float:right;width:28mm;height:33mm;border-radius:1mm;margin:0 0 4mm 7mm} .template-executive .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .template-executive .cv-side .cv-section h2{color:#d1d5db;border-color:#ffffff2e} .template-executive .cv-headline{color:#d1d5db} .template-executive .cv-main .cv-section h2{ border-bottom:2px solid #111827;letter-spacing:.14em; } /* ---------- 16. SOFT – oblé tvary, prívetivý ---------- */ .template-soft{--accent:#7c3aed} .template-soft .cv-side{background:#f5f3ff;color:#2e1065} .template-soft .cv-photo{border-radius:12mm} .template-soft .cv-side .cv-section h2{color:#6d28d9;border-color:#ddd6fe} .template-soft .cv-side .meta{color:#5b4b8a} .template-soft .cv-section h2{border:0;color:var(--accent)} .template-soft .cv-main .cv-item{ background:#faf9ff;border-radius:3mm;padding:3mm 4mm;margin-bottom:3.5mm; } .template-soft .skill-tags span{border-radius:4mm} .template-soft .cv-side .skill-tags span{background:#ede9fe;color:#5b21b6} .template-soft .cv-main .skill-tags span{background:#f3e8ff;color:#6b21a8} /* ---------- 17. NORDIC – pokojný, veľa priestoru ---------- */ .template-nordic{--accent:#64748b} .template-nordic .cv-layout{display:block} .template-nordic .cv-side{background:#fff;color:#1d2433;padding:20mm 20mm 6mm} .template-nordic .cv-main{padding:0 20mm 18mm} .template-nordic .cv-name{font-weight:300;font-size:30px;letter-spacing:.02em} .template-nordic .cv-photo{width:26mm;height:26mm;border-radius:50%;margin:0 0 6mm} .template-nordic .cv-section h2{ border:0;color:#94a3b8;font-size:10px;letter-spacing:.2em; } .template-nordic .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .template-nordic .cv-side .cv-section h2{color:#94a3b8;border:0} .template-nordic .skill-tags span{background:#f1f5f9;color:#475569} /* ---------- 18. CONTRAST – dvojfarebné rozdelenie ---------- */ .template-contrast{--accent:#f59e0b} .template-contrast .cv-side{background:#18181b;color:#fff} .template-contrast .cv-side .cv-section h2{color:#fbbf24;border-color:#ffffff26} .template-contrast .cv-main .cv-section h2{ background:#18181b;color:#fff;padding:1.5mm 3mm;border:0; display:inline-block;letter-spacing:.12em; } .template-contrast .cv-headline{color:#f59e0b} .template-contrast .cv-main .skill-tags span{background:#fef3c7;color:#92400e} /* ---------- 19. SIMPLE – bez farieb, iba obsah ---------- */ .template-simple{--accent:#374151} .template-simple .cv-layout{display:block} .template-simple .cv-side{background:#fff;color:#1d2433;padding:15mm 17mm 4mm} .template-simple .cv-main{padding:0 17mm 15mm} .template-simple .cv-photo{display:none} .template-simple .cv-name{font-size:24px;font-weight:700} .template-simple .cv-headline{color:#4b5563} .template-simple .cv-section h2{ font-size:10px;letter-spacing:.1em;border-bottom:1px solid #9ca3af;color:#374151; } .template-simple .cv-side .cv-section{display:block;margin:0 0 5mm} .template-simple .skill-tags span{background:#f3f4f6;color:#374151} /* ---------- 20. PORTFOLIO – dôraz na projekty ---------- */ .template-portfolio{--accent:#059669} .template-portfolio .cv-side{background:#052e26} .template-portfolio .cv-photo{border-radius:2mm;width:40mm;height:40mm} .template-portfolio .cv-side .cv-section h2{color:#6ee7b7;border-color:#ffffff26} .template-portfolio .cv-main .cv-section h2{ border:0;border-left:2mm solid var(--accent);padding:0 0 0 3mm;color:#065f46; } .template-portfolio .cv-main .cv-item{ border-bottom:1px solid #e5eeea;padding-bottom:3mm;margin-bottom:4mm; } .template-portfolio .cv-main .cv-item:last-child{border-bottom:0} .template-portfolio .cv-main .skill-tags span{background:#d1fae5;color:#065f46} /* =========================================================================== VLASTNÉ ŠABLÓNY OD VIXI --------------------------------------------------------------------------- cv.js nastavuje na .cv-paper triedy template-{layout} cvtpl-custom cvtpl-head-* cvtpl-side-* cvtpl-density-* a premenné --accent, --cv-secondary, --cv-radius. =========================================================================== */ .cv-paper.cvtpl-custom{--accent:var(--cv-accent,#4f46e5)} .cv-paper.cvtpl-custom.cvtpl-side-dark .cv-side{background:var(--cv-secondary,#17213c);color:#fff} .cv-paper.cvtpl-custom.cvtpl-side-dark .cv-side .cv-section h2{color:#ffffffd0;border-color:#ffffff34} .cv-paper.cvtpl-custom.cvtpl-side-dark .cv-side .meta{color:#cbd5e1} .cv-paper.cvtpl-custom.cvtpl-side-light .cv-side{background:#f1f4f9;color:#1d2433} .cv-paper.cvtpl-custom.cvtpl-side-light .cv-side .cv-section h2{color:#4c5a72;border-color:#d3dae5} .cv-paper.cvtpl-custom.cvtpl-side-light .cv-side .meta{color:#68748b} .cv-paper.cvtpl-custom.cvtpl-side-light .cv-side .skill-tags span{background:#e2e8f4;color:#33415b} .cv-paper.cvtpl-custom.cvtpl-side-accent .cv-side{background:var(--cv-accent,#4f46e5);color:#fff} .cv-paper.cvtpl-custom.cvtpl-side-accent .cv-side .cv-section h2{color:#ffffffdd;border-color:#ffffff45} .cv-paper.cvtpl-custom.cvtpl-side-none .cv-layout{display:block} .cv-paper.cvtpl-custom.cvtpl-side-none .cv-side{background:#fff;color:#1d2433;padding:15mm 16mm 5mm} .cv-paper.cvtpl-custom.cvtpl-side-none .cv-main{padding:0 16mm 15mm} .cv-paper.cvtpl-custom.cvtpl-side-none .cv-side .cv-section{display:inline-block;width:31%;vertical-align:top;margin-right:2%} .cv-paper.cvtpl-custom.cvtpl-side-none .cv-photo{float:right;width:30mm;height:35mm;margin:0 0 4mm 8mm} .cv-paper.cvtpl-custom.cvtpl-head-clean .cv-section h2{border-bottom:1px solid #d9dee8;letter-spacing:.09em} .cv-paper.cvtpl-custom.cvtpl-head-underline .cv-section h2{border-bottom:2px solid var(--cv-accent,#4f46e5);color:var(--cv-accent,#4f46e5)} .cv-paper.cvtpl-custom.cvtpl-head-block .cv-main .cv-section h2{ background:var(--cv-secondary,#17213c);color:#fff;border:0; display:inline-block;padding:1.5mm 3mm;border-radius:var(--cv-radius,0); } .cv-paper.cvtpl-custom.cvtpl-head-serif .cv-section h2{ font-family:Georgia,"Times New Roman",serif;font-weight:400; text-transform:none;letter-spacing:.03em;font-size:12px; } .cv-paper.cvtpl-custom.cvtpl-density-comfortable .cv-section{margin-bottom:8mm} .cv-paper.cvtpl-custom.cvtpl-density-compact .cv-side{padding:12mm 7mm} .cv-paper.cvtpl-custom.cvtpl-density-compact .cv-main{padding:12mm 11mm} .cv-paper.cvtpl-custom.cvtpl-density-compact .cv-section{margin-bottom:5mm} .cv-paper.cvtpl-custom.cvtpl-density-compact .cv-item{margin-bottom:3mm} .cv-paper.cvtpl-custom.cvtpl-density-airy .cv-side{padding:22mm 11mm} .cv-paper.cvtpl-custom.cvtpl-density-airy .cv-main{padding:21mm 18mm} .cv-paper.cvtpl-custom.cvtpl-density-airy .cv-section{margin-bottom:11mm} .cv-paper.cvtpl-custom .cv-photo{border-radius:var(--cv-radius,9mm)} .cv-paper.cvtpl-custom .skill-tags span{border-radius:var(--cv-radius,3mm)} .cv-paper.cvtpl-custom .cv-headline{color:var(--cv-accent,#4f46e5)} /* ---------- náhľady vo výbere ---------- */ .thumb.sidebar-right{border-right:9px solid #4f46e5} .thumb.light-side{border-left:9px solid #cbd5e1} .thumb.band{border-top:12px solid #4f46e5} .thumb.elegant{border:0;box-shadow:inset 0 0 0 1px #d9d2c4} .thumb.timeline{border-left:3px solid #0f766e;background:repeating-linear-gradient(#fff 0 8px,#d7e5e2 8px 9px)} .thumb.compact{background:repeating-linear-gradient(#fff 0 4px,#dde3ec 4px 5px)} .thumb.mono{border:1px solid #111} .thumb.academic{border-top:5px solid #1e3a8a;border-bottom:2px solid #1e3a8a} .thumb.creative{border-left:9px solid #db2777} .thumb.tech{border-left:9px solid #0ea5e9} .thumb.executive{border-top:12px solid #111827} .thumb.soft{border-left:9px solid #7c3aed;border-radius:9px} .thumb.nordic{border:0;box-shadow:inset 0 0 0 1px #e2e8f0} .thumb.contrast{border-left:14px solid #18181b} .thumb.simple{border:1px solid #9ca3af} .thumb.portfolio{border-left:9px solid #059669} /* ---------- rozhranie VIXI dizajnéra v bočnom paneli ---------- */ .cvdes{display:flex;flex-direction:column;gap:7px} .cvdes-empty{margin:0;color:#8b95a8;font-size:10px;line-height:1.5} .cvdes-item{display:flex;align-items:center;gap:4px} .cvdes-item>button:first-child{ flex:1;display:flex;align-items:center;gap:8px;text-align:left;padding:8px; border:1px solid transparent;border-radius:11px;background:transparent; color:#445068;cursor:pointer;min-width:0; } .cvdes-item.active>button:first-child{background:#eef2ff;border-color:#c7d2fe;color:#312e81} .cvdes-item b,.cvdes-item small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cvdes-item b{font-size:10px} .cvdes-item small{font-size:10px;color:#818a9d;margin-top:2px} .cvdes-remove{ width:24px;height:24px;flex:none;border:0;border-radius:8px; background:#fee2e2;color:#991b1b;cursor:pointer;font-size:15px;line-height:1; } .cvdes-label{margin-top:4px;color:#80899c;font-size:10px;font-weight:900;letter-spacing:.05em} .cvdes textarea{ width:100%;margin:0;padding:8px 9px;border:1px solid #ccd5e3;border-radius:9px; background:#fff;color:#202942;font-size:10px;line-height:1.45;resize:vertical; } .cvdes-create{ border:0;padding:9px;border-radius:10px;cursor:pointer;font-weight:800;font-size:10px; background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff; } .cvdes-create:disabled{opacity:.6;cursor:default} .cvdes-status{margin:0;min-height:12px;color:#4f46e5;font-size:10px;line-height:1.45} .cvdes-note{margin:0;color:#8b95a8;font-size:10px;line-height:1.5} /* Bočný panel je v tmavom prevedení (cv.css riadok 8) – prispôsobíme. */ .sidebar .cvdes-item>button:first-child{color:#d6deec} .sidebar .cvdes-item.active>button:first-child{background:#ffffff13;border-color:#ffffff26;color:#fff} .sidebar .cvdes-item small{color:#95a1b7} .sidebar .cvdes textarea{border-color:#ffffff1a;background:#ffffff0b;color:#eef2f8} .sidebar .cvdes textarea::placeholder{color:#8593aa} .sidebar .cvdes-label{color:#9aa7bc} .sidebar .cvdes-status{color:#c4b5fd} .sidebar .cvdes-note,.sidebar .cvdes-empty{color:#8593aa} .sidebar .cvdes-remove{background:#ffffff12;color:#fca5a5} /* --------------------------------------------------------------------------- akcenty-specificita V zivotopis/index.html je inline