diff --git a/css/cv.css b/css/cv.css deleted file mode 100644 index 79ddf84..0000000 --- a/css/cv.css +++ /dev/null @@ -1,220 +0,0 @@ -:root { - --bgPage: #18181b; - --teal: #006d85; - --lightTeal: #00b6d0; - - --streamYellow: #ffa044; - --streamYellow2: #ebac56; - --streamDarkestTeal: #002736; - --streamDarkTeal: #004f59; -} - -:root * { - margin: 0px; - border: 0px; - padding: 0px; - max-width: 100vw; - font-family: 'Noto Sans', sans-serif; -} - -:root *::selection { - background-color: var(--teal); -} - -body { - padding: 8px!important; - box-sizing: border-box; - background-color: var(--bgPage); -} - -nav { - display: flex; - flex-direction: column; - gap: 0.5em; - padding: 0.5em!important; - align-items: center; - background-color: var(--streamDarkTeal); -} - -.flag { - height: 1em; - width: 1.5em; - align-self: center; -} - -.logo { - height: 2em; - width: 2em; - align-self: center; - background-color: rgba(0, 0, 0, 0)!important; -} - -.mu { - height: 5em; - width: auto; - float: inline-end; -} - -ul { - list-style: inside; - line-height: 2.5em; -} - -.imgLi { - float: left; - list-style-position: inside; - width: fit-content; - clear: left; -} - -.imgLi::marker { - color: var(--lightTeal); -} - -.imgDiv { - display: flex; - float: right; - gap: 0.5em; -} - -.langOption { - display: flex; - width: 100%; - justify-content: center; - gap: 0.5em; - border-radius: 2px; - padding: 1em; - font-size: 1em; - background-color: var(--lightTeal); -} - -.langOption:hover, .langSelected { - background-color: var(--streamYellow); -} - -.undecoratedLink { - text-decoration: none; - color: black; -} - -#inspiration { - color: var(--lightTeal); -} - -#main { - display: flex; - flex-direction: column; - gap: 0.5em; - padding: 2em; - background-color: var(--streamDarkestTeal); - color: white; -} - -header { - grid-column: 1/-1; - margin-bottom: 0.5em!important; - border-left: 2px solid white!important; - padding: 0.5em!important; -} - -.card { - display: flex; - flex-direction: column; - gap: 0.5em; - border-radius: 0.25rem; - padding: 1em; - background-color: rgba(255, 255, 255, 0.05); - font-size: large; -} - -.card:hover { - box-shadow: 0px 0px 5px 1px var(--streamYellow); -} - -.card a { - border-radius: 2px; - background-color: rgba(255, 255, 255, 0.05); - color: var(--lightTeal); -} - -.card a:hover { - background-color: var(--streamYellow2); - color: black; -} - -#goals { - grid-row: 2; - grid-column: 1/3; -} - -#contact { - grid-row: 2; - grid-column: 4/6; -} - -#other { - grid-row: 3; - grid-column: 4/6; -} - -.progressBar { - display: grid; - gap: 0.5em; - float: right; - grid-template-columns: repeat(5, 1fr); - height: 1em; - width: 100%; - padding: 0.2em; - box-sizing: border-box; -} - -.progressBlock { - background-color: var(--lightTeal); -} - -.linkImg:hover { - height: 2.1em; - width: 2.1em; - background-color: var(--streamYellow)!important; - border: 2px solid var(--streamYellow); - box-shadow: 0px 0px 5px 1px var(--streamYellow); -} - -@media (min-width: 1225px) { - body { - display: grid; - grid-template-areas: - "top top" - "main main"; - grid-template-rows: min-content 1fr; - } - - nav { - grid-area: top; - flex-direction: row; - } - - #main { - grid-area: main; - display: grid; - grid-template-columns: repeat(5, 1fr); - grid-auto-rows: min-content; - } - - #competences { - grid-column: 2/4; - } - - #competences > ul { - columns: 3; - } - - .langOption { - display: flex; - width: auto; - } - - #inspiration { - margin-left: auto; - } -}