tbs093a
/
curriculum.vitae
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(cv): parameterize border sizes and add missing branchBorderColors 

Extract borderSize and borderRadius into variables passed to branch/merge
components for consistent, easily adjustable styling. Add branchBorderColor
to segments that were missing it (Sii, Sembot, UR, ZSE, Skills DevOps,
Skills Databases). Color segment titles to match their branch color.

Made-with: Cursor
master
sii42400 2026-04-16 14:49:22 +02:00
parent 5707a42744
commit 53492a17cb
2 changed files with 44 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/content/kamil.js
View File

@ -50,6 +50,7 @@ export const content_pl = [
title: "Sii Sp. z o. o. - od 10.11.2022", title: "Sii Sp. z o. o. - od 10.11.2022",
firstElement: true, firstElement: true,
image: WorkSiiLogo, image: WorkSiiLogo,
branchBorderColor: "#0464a8",
content: [] content: []
}, },
{ {
@ -224,6 +225,7 @@ export const content_pl = [
tabs: 0, tabs: 0,
title: "Sembot Sp. z o. o. - od 01.11.2020 do 30.10.2022", title: "Sembot Sp. z o. o. - od 01.11.2020 do 30.10.2022",
image: WorkSembotLogo, image: WorkSembotLogo,
branchBorderColor: "#f5c314",
content: [] content: []
}, },
{ {
@ -261,6 +263,7 @@ export const content_pl = [
tabs: 0, tabs: 0,
title: "Uniwersytet Rzeszowski - Studia inżynierskie - Informatyka - od 2017 do 2021", title: "Uniwersytet Rzeszowski - Studia inżynierskie - Informatyka - od 2017 do 2021",
image: WorkURLogo, image: WorkURLogo,
branchBorderColor: "#015198",
content: [] content: []
}, },
{ {
@ -300,7 +303,7 @@ export const content_pl = [
tabs: 0, tabs: 0,
title: "Zespół Szkół Elektronicznych w Rzeszowie / Technikum nr 6 - Technik Informatyk - od 2013 do 2017", title: "Zespół Szkół Elektronicznych w Rzeszowie / Technikum nr 6 - Technik Informatyk - od 2013 do 2017",
image: WorkZSELogo, image: WorkZSELogo,
mainBorderColor: null, branchBorderColor: "#2e8cb1",
firstElement: true, firstElement: true,
noElements: true, noElements: true,
content: [], content: [],
@ -315,7 +318,6 @@ export const content_pl = [
title: "DevOps", title: "DevOps",
image: "", image: "",
branchBorderColor: "#04009b", branchBorderColor: "#04009b",
mainBorderColor: null,
firstElement: true, firstElement: true,
content: [], content: [],
}, },
@ -544,7 +546,7 @@ export const content_pl = [
tabs: 0, tabs: 0,
title: "DevOps", title: "DevOps",
image: "", //SkillsDevOpsLogo, image: "", //SkillsDevOpsLogo,
mainBorderColor: null, branchBorderColor: "#2e8cb1",
content: [], content: [],
}, },
{ {
@ -752,6 +754,7 @@ export const content_en = [
title: "Sii Sp. z o. o. - from 10.11.2022", title: "Sii Sp. z o. o. - from 10.11.2022",
firstElement: true, firstElement: true,
image: WorkSiiLogo, image: WorkSiiLogo,
branchBorderColor: "#0464a8",
content: [] content: []
}, },
// { // {
@ -933,6 +936,7 @@ export const content_en = [
tabs: 0, tabs: 0,
title: "Sembot Sp. z o. o. - from 01.11.2020 to 30.10.2022", title: "Sembot Sp. z o. o. - from 01.11.2020 to 30.10.2022",
image: WorkSembotLogo, image: WorkSembotLogo,
branchBorderColor: "#f5c314",
content: [] content: []
}, },
{ {
@ -971,6 +975,7 @@ export const content_en = [
tabs: 0, tabs: 0,
title: "University of Rzeszów - Engineer Studying - IT - from 2017 to 2021", title: "University of Rzeszów - Engineer Studying - IT - from 2017 to 2021",
image: WorkURLogo, image: WorkURLogo,
branchBorderColor: "#015198",
content: [] content: []
}, },
{ {
@ -1011,6 +1016,7 @@ export const content_en = [
tabs: 0, tabs: 0,
title: "ZSE in Rzeszów / Technical School - Information Technology - from 2013 to 2017", title: "ZSE in Rzeszów / Technical School - Information Technology - from 2013 to 2017",
image: WorkZSELogo, image: WorkZSELogo,
branchBorderColor: "#2e8cb1",
noElements: true, noElements: true,
content: [], content: [],
}, },
@ -1156,7 +1162,6 @@ export const content_en = [
title: "DevOps", title: "DevOps",
image: "", image: "",
branchBorderColor: "#04009b", branchBorderColor: "#04009b",
mainBorderColor: null,
firstElement: true, firstElement: true,
content: [], content: [],
}, },
@ -1252,7 +1257,7 @@ export const content_en = [
tabs: 0, tabs: 0,
title: "DevOps", title: "DevOps",
image: "", //SkillsDevOpsLogo, image: "", //SkillsDevOpsLogo,
mainBorderColor: null, branchBorderColor: "#2e8cb1",
content: [], content: [],
}, },
{ {
@ -1345,7 +1350,7 @@ export const content_en = [
tabs: 0, tabs: 0,
title: "Databases Configuration & Administration", title: "Databases Configuration & Administration",
image: "", //SkillsDatabasesLogo, image: "", //SkillsDatabasesLogo,
mainBorderColor: null, branchBorderColor: "#1038a7",
content: [], content: [],
}, },
{ {

54
src/pages/index.js
View File

@ -169,7 +169,7 @@ const SegmentListNormal = ({ segment, tabs }) => {
) )
} }
const SegmentListWork = ({ segment, tabs }) => { const SegmentListWork = ({ segment, tabs, borderSize }) => {
return ( return (
<div <div
style={{ style={{
@ -178,7 +178,7 @@ const SegmentListWork = ({ segment, tabs }) => {
> >
<div <div
style={{ style={{
borderLeft: segment.mainBorderColor === null ? "" : "3.5px dotted " + segment.mainBorderColor, borderLeft: segment.mainBorderColor === null ? "" : borderSize + " dotted " + segment.mainBorderColor,
paddingLeft: tabs * 2.5 + "%", paddingLeft: tabs * 2.5 + "%",
marginLeft: tabs * 2.5 + "%", marginLeft: tabs * 2.5 + "%",
marginTop: segment.firstElement === true ? "15px" : "", marginTop: segment.firstElement === true ? "15px" : "",
@ -196,6 +196,9 @@ const SegmentListWork = ({ segment, tabs }) => {
} }
<div <div
className="segment_content_title" className="segment_content_title"
style={{
color: segment.branchBorderColor === undefined ? segment.mainBorderColor : segment.branchBorderColor,
}}
> >
{ {
segment.content.length > 0 ? segment.content.length > 0 ?
@ -219,7 +222,7 @@ const SegmentListWork = ({ segment, tabs }) => {
segment.content.length > 0 ? segment.content.length > 0 ?
<ul <ul
style={{ style={{
borderLeft: segment.branchBorderColor === null ? "" : "3.5px dotted " + segment.branchBorderColor, borderLeft: segment.branchBorderColor === null ? "" : borderSize + " dotted " + segment.branchBorderColor,
marginBottom: segment.lastSubElement === true ? "30px" : "", marginBottom: segment.lastSubElement === true ? "30px" : "",
paddingBottom: segment.haveOneElement === true ? "30px" : "", paddingBottom: segment.haveOneElement === true ? "30px" : "",
}} }}
@ -245,7 +248,7 @@ const SegmentListWork = ({ segment, tabs }) => {
} }
const SegmentCreateBranch = ({ segment, tabs }) => { const SegmentCreateBranch = ({ segment, tabs, borderSize, borderRadius }) => {
return ( return (
<div <div
style={{ style={{
@ -265,7 +268,7 @@ const SegmentCreateBranch = ({ segment, tabs }) => {
</div> </div>
<div <div
style={{ style={{
borderLeft: "3.5px dotted " + segment.mainBorderColor, borderLeft: borderSize + " dotted " + segment.mainBorderColor,
marginLeft: tabs * 2.5 + "%", marginLeft: tabs * 2.5 + "%",
}} }}
className="segment_content_work" className="segment_content_work"
@ -274,10 +277,11 @@ const SegmentCreateBranch = ({ segment, tabs }) => {
style={{ style={{
width: tabs * 2.5 + "%", width: tabs * 2.5 + "%",
height: "20px", height: "20px",
marginLeft: "-3.5px", marginLeft: "-" + borderSize,
borderRadius: "0 0 0 100%", marginBottom: "-" + borderSize,
borderBottom: "3.5px dotted " + segment.branchBorderColor, borderRadius: "0 0 0 " + borderRadius,
borderLeft: "3.5px dotted " + segment.branchBorderColor, borderBottom: borderSize + " dotted " + segment.branchBorderColor,
borderLeft: borderSize + " dotted " + segment.branchBorderColor,
}} }}
> >
</div> </div>
@ -286,9 +290,9 @@ const SegmentCreateBranch = ({ segment, tabs }) => {
width: "18px", width: "18px",
height: "20px", height: "20px",
marginLeft: tabs * 2.5 + "%", marginLeft: tabs * 2.5 + "%",
borderRadius: "0 100% 0 0", borderRadius: "0 " + borderRadius + " 0 0",
borderTop: "3.5px dotted " + segment.branchBorderColor, borderTop: borderSize + " dotted " + segment.branchBorderColor,
borderRight: "3.5px dotted " + segment.branchBorderColor, borderRight: borderSize + " dotted " + segment.branchBorderColor,
}} }}
> >
</div> </div>
@ -298,7 +302,7 @@ const SegmentCreateBranch = ({ segment, tabs }) => {
} }
const SegmentMergeBranch = ({ segment, tabs }) => { const SegmentMergeBranch = ({ segment, tabs, borderSize, borderRadius }) => {
return ( return (
<div <div
style={{ style={{
@ -307,7 +311,7 @@ const SegmentMergeBranch = ({ segment, tabs }) => {
> >
<div <div
style={{ style={{
borderLeft: "3.5px dotted " + segment.mainBorderColor, borderLeft: borderSize + " dotted " + segment.mainBorderColor,
marginLeft: tabs * 2.5 + "%", marginLeft: tabs * 2.5 + "%",
}} }}
className="segment_content_work" className="segment_content_work"
@ -317,9 +321,10 @@ const SegmentMergeBranch = ({ segment, tabs }) => {
width: "18px", width: "18px",
height: "20px", height: "20px",
marginLeft: tabs * 2.5 + "%", marginLeft: tabs * 2.5 + "%",
borderRadius: "0 0 100% 0", marginBottom: "-" + borderSize,
borderBottom: "3.5px dotted " + segment.branchBorderColor, borderRadius: "0 0 " + borderRadius + " 0",
borderRight: "3.5px dotted " + segment.branchBorderColor, borderBottom: borderSize + " dotted " + segment.branchBorderColor,
borderRight: borderSize + " dotted " + segment.branchBorderColor,
}} }}
> >
</div> </div>
@ -327,10 +332,10 @@ const SegmentMergeBranch = ({ segment, tabs }) => {
style={{ style={{
width: tabs * 2.5 + "%", width: tabs * 2.5 + "%",
height: "20px", height: "20px",
marginLeft: "-3.5px", marginLeft: "-" + borderSize,
borderRadius: "100% 0 0 0", borderRadius: borderRadius + " 0 0 0",
borderTop: "3.5px dotted " + segment.branchBorderColor, borderTop: borderSize + " dotted " + segment.branchBorderColor,
borderLeft: "3.5px dotted " + segment.branchBorderColor, borderLeft: borderSize + " dotted " + segment.branchBorderColor,
}} }}
> >
</div> </div>
@ -420,6 +425,8 @@ const SegmentRODO = ({ segment }) => {
const Segment = ({ index, segment }) => { const Segment = ({ index, segment }) => {
const segment_index = "segment_" + index; const segment_index = "segment_" + index;
let borderSize = "2px";
let borderRadius = "75%";
return ( return (
<div <div
@ -451,6 +458,7 @@ const Segment = ({ index, segment }) => {
key={`work_${index}`} key={`work_${index}`}
segment={segment} segment={segment}
tabs={segment.tabs} tabs={segment.tabs}
borderSize={borderSize}
/> />
: :
segment.type === "createBranchSegment" ? segment.type === "createBranchSegment" ?
@ -458,6 +466,8 @@ const Segment = ({ index, segment }) => {
key={`create_${index}`} key={`create_${index}`}
segment={segment} segment={segment}
tabs={segment.tabs} tabs={segment.tabs}
borderSize={borderSize}
borderRadius={borderRadius}
/> />
: :
segment.type === "mergeBranchSegment" ? segment.type === "mergeBranchSegment" ?
@ -465,6 +475,8 @@ const Segment = ({ index, segment }) => {
key={`merge_${index}`} key={`merge_${index}`}
segment={segment} segment={segment}
tabs={segment.tabs} tabs={segment.tabs}
borderSize={borderSize}
borderRadius={borderRadius}
/> />
: :
segment.type === "RODOSegment" ? segment.type === "RODOSegment" ?