From ff8207ab9063e4223e3ba8232d138081c9189adb Mon Sep 17 00:00:00 2001 From: angien90 Date: Sun, 9 Feb 2025 17:41:53 +0100 Subject: [PATCH 1/4] =?UTF-8?q?Fixade=20till=20m=C3=B6rk/ljus=20l=C3=A4ge?= =?UTF-8?q?=20p=C3=A5=20CV?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/_mobileDesignCv.scss | 180 ++++++++++++++++-- css/_tabletDesignCv.scss | 97 ++-------- css/main.css | 2 +- css/main.css.map | 2 +- ..._000000_FILL0_wght400_GRAD0_opsz24 (1).svg | 1 + ...24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg | 1 + index.html | 36 +++- ...24dp_000000_FILL0_wght400_GRAD0_opsz24.svg | 1 + ...24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg | 1 + personligt_brev.html | 1 - script.js | 27 +++ 11 files changed, 233 insertions(+), 116 deletions(-) create mode 100644 dark_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24 (1).svg create mode 100644 dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 light_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg create mode 100644 script.js diff --git a/css/_mobileDesignCv.scss b/css/_mobileDesignCv.scss index 34598dd..e373c2f 100644 --- a/css/_mobileDesignCv.scss +++ b/css/_mobileDesignCv.scss @@ -3,9 +3,111 @@ body { display: flex; flex-direction: column; min-height: 100vh; - margin: 0; + margin: 0; + transition: background-color 0.5s, color 0.5s; + } + + /* Mörkt läge */ + body.light-mode aside { + background-color: #f4f4f4; + color: black; + } + + body.light-mode main { + background-color: #e0e0e0; + color: black; + } + + + body.dark-mode aside { + background-color: #333; + color: white; + } + + body.dark-mode main { + background: #333; + color: white; + } + + body.dark-mode footer { + background: #333; + color: white; + } + + body.light-mode a img { + filter: invert(0%) sepia(100%) hue-rotate(180deg); /* Exempel: normal färg */ +} + +body.dark-mode a img { + filter: invert(100%); /* Exempel: vit ikon i mörkt läge */ +} + + .theme-switch-wrapper { + position: absolute; + top: 20px; + right: 20px; + z-index: 10; +} + + .theme-switch { + position: relative; + display: inline-block; + width: 80px; + height: 44px; + } + + .theme-switch input { + opacity: 0; + width: 0; + height: 0; + } + + .slider { + position: absolute; + cursor: pointer; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: gray; + transition: 0.4s; + border-radius: 44px; + width: 80px; + height: 44px; + } + + .slider:hover { + box-shadow: 0 0 20px gray; } + .slider:before { + position: absolute; + content: ""; + height: 36px; + width: 36px; + left: 4px; + bottom: 4px; + background-image: url('/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg') !important; + transition: 0.4s; + border-radius: 50%; + background-size: cover; + } + + input:checked + .slider { + background-color: gray; + } + + input:checked + .slider:hover { + box-shadow: 0 0 20px rgb(255, 255, 255); + } + + input:checked + .slider:before { + transform: translateX(36px); + background-image: url('/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg') !important; + background-size: cover; + } + + /* --- */ aside { background-color: #f4f4f4; padding: 10px; @@ -13,15 +115,19 @@ body { border-left: 4px solid white; border-top: 4px solid white; border-bottom: 10px double white; + margin-bottom: 60px; + flex: 1; } aside img { - width: 35%; + width: 50%; + max-width: 200px; border-radius: 50%; - display: block; - margin: 0 auto; - margin-top: 10px; - } + display: block; + margin: 20px auto; + border: 4px solid #ddd; +} + aside h2 { text-align: center; @@ -43,6 +149,7 @@ body { padding: 0; margin: 0; text-align: center; + line-height: 1.6; } ul li { @@ -52,13 +159,12 @@ body { } .reference { - color: black; width: 100%; text-align: center; margin-bottom: 10px; font-weight: bold; margin-bottom: 5px; - font-size: 1.2em;; + font-size: 1.2em; } aside a { @@ -88,11 +194,19 @@ body { .buttons { display: flex; flex-direction: row; - justify-content: center; - padding-left: 10%; - padding-right: 10%; - gap: 10px; - } + gap: 5px; + justify-content: center; + margin-bottom: 30px; + margin-top: 20px; +} + + .buttons button { + margin: 0 30px; +} + +button { + width: 150px; +} main { flex-grow: 1; @@ -104,8 +218,9 @@ body { border-right: 4px solid white; border-left: 4px solid white; margin-bottom: 60px; + flex: 1; } - + main h1 { margin-bottom: 10px; font-size: 2.5em; @@ -133,6 +248,7 @@ body { } footer { + position: relative; display: flex; justify-content: space-evenly; align-items: flex-end; @@ -147,25 +263,51 @@ body { display: block; text-align: center; padding-top: 10px; - border-bottom: 4px solid white; - border-left: 4px solid white; - border-right: 4px solid white; + border-bottom: 4px solid white; } footer a { + position: relative; color: white; text-decoration: none; font-size: 1.5em; display: inline-block; margin: 5px; } + + footer a:hover { + transform: scale(1.2); +} /* Kontaktikoner */ footer img { width: 30px; height: 30px; - margin: 0 10px; + margin: 0 10px; + transition: transform 0.3s ease, filter 0.3s ease; } - + /* Tooltip-stil */ +.tooltip { + position: absolute; + bottom: 60px; /* Justera så att texten visas ovanför ikonen */ + left: 50%; + transform: translateX(-50%); + background-color: rgba(0, 0, 0, 0.8); + color: white; + padding: 5px 10px; + border-radius: 5px; + font-size: 14px; + white-space: nowrap; + opacity: 0; + visibility: hidden; + transition: opacity 0.3s ease, transform 0.3s ease; +} + +/* Visa tooltip vid hover */ +footer a:hover .tooltip { + opacity: 1; + visibility: visible; + transform: translateX(-50%) translateY(-5px); /* Lätt animation */ +} \ No newline at end of file diff --git a/css/_tabletDesignCv.scss b/css/_tabletDesignCv.scss index 9ed82f7..3c13acf 100644 --- a/css/_tabletDesignCv.scss +++ b/css/_tabletDesignCv.scss @@ -1,85 +1,39 @@ body { - font-family: 'El Messiri', sans-serif; - display: flex; flex-direction: row; - min-height: 100vh; - margin: 0; } aside { - width: 30%; - background-color: #f4f4f4; - padding: 10px; + width: 30%; border-right: 10px double white; box-sizing: border-box; - border-left: 4px solid white; - border-top: 4px solid white; - } - - aside img { - width: 35%; - border-radius: 50%; - display: block; - margin: 0 auto; } aside h2 { - text-align: center; - margin-bottom: 0px; margin-top: 50px; font-size: 2em; } aside p { - text-align: center; - margin-top: 5px; padding-left: 20px; padding-right: 20px; font-size: 1.2em; } - ul { - list-style-type: none; - padding: 0; - margin: 0; - text-align: center; - } - ul li { - display: block; - margin: 10px; - margin-top: 5px; font-size: 1.2em; } - - aside button { - display: block; - margin: 20px auto; - padding: 10px 20px; - background-color: #e0e0e0; - border: none; - border-radius: 5px; - color: #333; - font-size: 1.2em; - font-weight: bold; - cursor: pointer; - margin-top: 20px; - transition: background-color 0.3s ease; + + .reference { + font-size: 1.5em; } - - aside button:hover { - background-color: #ccc; + + aside button { + font-size: 1.1em; + width: 200px; } - - main { - flex-grow: 1; - background-color: #e0e0e0; - padding: 10px; - padding-left: 40px; - padding-right: 40px; - box-sizing: border-box; + + main { width: 400px; - border-right: 4px solid white; border-top: 4px solid white; margin-bottom: 70px; border-left: 0px; @@ -88,61 +42,32 @@ body { main h1 { margin-bottom: 0px; font-size: 3em; - text-align: center; } main h2 { margin-top: 5px; font-size: 2.5em; - text-align: center; } main h3 { - margin-bottom: -10px; font-size: 2em; } main h4 { - margin-bottom: -10px; font-size: 1.2em; } main p { - margin-top: 10px; font-size: 1.2em; } footer { - display: flex; align-items: flex-end; - padding: 0px; - background-color: #f4f4f4; - color: white; - position: fixed; - bottom: 0; - width: 100vw; - height: 50px; - display: block; - text-align: center; - padding-top: 10px; - border-bottom: 4px solid white; - border-left: 4px solid white; - border-right: 4px solid white; - } - - footer a { - color: white; - text-decoration: none; - font-size: 1.5em; - display: inline-block; - margin: 5px; + height: 50px; } /* Kontaktikoner */ footer img { - width: 30px; - height: 30px; - margin: 0 10px; margin-left: 40px; margin-right: 40px; } diff --git a/css/main.css b/css/main.css index 6e727ac..9d280d2 100644 --- a/css/main.css +++ b/css/main.css @@ -1 +1 @@ -/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}body{font-family:"El Messiri",sans-serif;display:flex;flex-direction:column;min-height:100vh;margin:0}aside{background-color:#f4f4f4;padding:10px;border-right:4px solid #fff;border-left:4px solid #fff;border-top:4px solid #fff;border-bottom:10px double #fff}aside img{width:35%;border-radius:50%;display:block;margin:0 auto;margin-top:10px}aside h2{text-align:center;margin-bottom:0px;margin-top:30px;font-size:1.5em}aside p{text-align:center;margin-top:5px;padding-left:10px;padding-right:10px;font-size:1em}ul{list-style-type:none;padding:0;margin:0;text-align:center}ul li{display:block;margin:10px;margin-top:5px}.reference{color:#000;width:100%;text-align:center;margin-bottom:10px;font-weight:bold;margin-bottom:5px;font-size:1.2em}aside a{text-decoration:none}aside button{display:block;margin:20px auto;padding:10px 20px;background-color:#e0e0e0;border:none;border-radius:5px;color:#333;font-size:14px;font-weight:bold;cursor:pointer;margin-top:30px;margin-bottom:30px;transition:background-color .3s ease}aside button:hover{background-color:#ccc}.buttons{display:flex;flex-direction:row;justify-content:center;padding-left:10%;padding-right:10%;gap:10px}main{flex-grow:1;background-color:#e0e0e0;padding:10px;padding-left:40px;padding-right:40px;box-sizing:border-box;border-right:4px solid #fff;border-left:4px solid #fff;margin-bottom:60px}main h1{margin-bottom:10px;font-size:2.5em;text-align:center}main h2{margin-top:0px;font-size:2em;text-align:center}main h3{margin-bottom:-10px;font-size:1.5em}main h4{margin-bottom:-10px;font-size:1em}main p{margin-top:10px}footer{display:flex;justify-content:space-evenly;align-items:flex-end;padding:0px;background-color:#f4f4f4;color:#fff;position:fixed;bottom:0;width:100%;border-top:10px double #fff;height:50px;display:block;text-align:center;padding-top:10px;border-bottom:4px solid #fff;border-left:4px solid #fff;border-right:4px solid #fff}footer a{color:#fff;text-decoration:none;font-size:1.5em;display:inline-block;margin:5px}footer img{width:30px;height:30px;margin:0 10px}@media screen and (min-width: 1024px){body{font-family:"El Messiri",sans-serif;display:flex;flex-direction:row;min-height:100vh;margin:0}aside{width:30%;background-color:#f4f4f4;padding:10px;border-right:10px double #fff;box-sizing:border-box;border-left:4px solid #fff;border-top:4px solid #fff}aside img{width:35%;border-radius:50%;display:block;margin:0 auto}aside h2{text-align:center;margin-bottom:0px;margin-top:50px;font-size:2em}aside p{text-align:center;margin-top:5px;padding-left:20px;padding-right:20px;font-size:1.2em}ul{list-style-type:none;padding:0;margin:0;text-align:center}ul li{display:block;margin:10px;margin-top:5px;font-size:1.2em}aside button{display:block;margin:20px auto;padding:10px 20px;background-color:#e0e0e0;border:none;border-radius:5px;color:#333;font-size:1.2em;font-weight:bold;cursor:pointer;margin-top:20px;transition:background-color .3s ease}aside button:hover{background-color:#ccc}main{flex-grow:1;background-color:#e0e0e0;padding:10px;padding-left:40px;padding-right:40px;box-sizing:border-box;width:400px;border-right:4px solid #fff;border-top:4px solid #fff;margin-bottom:70px;border-left:0px}main h1{margin-bottom:0px;font-size:3em;text-align:center}main h2{margin-top:5px;font-size:2.5em;text-align:center}main h3{margin-bottom:-10px;font-size:2em}main h4{margin-bottom:-10px;font-size:1.2em}main p{margin-top:10px;font-size:1.2em}footer{display:flex;align-items:flex-end;padding:0px;background-color:#f4f4f4;color:#fff;position:fixed;bottom:0;width:100vw;height:50px;display:block;text-align:center;padding-top:10px;border-bottom:4px solid #fff;border-left:4px solid #fff;border-right:4px solid #fff}footer a{color:#fff;text-decoration:none;font-size:1.5em;display:inline-block;margin:5px}footer img{width:30px;height:30px;margin:0 10px;margin-left:40px;margin-right:40px}}/*# sourceMappingURL=main.css.map */ \ No newline at end of file +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}body{font-family:"El Messiri",sans-serif;display:flex;flex-direction:column;min-height:100vh;margin:0;transition:background-color .5s,color .5s}body.light-mode aside{background-color:#f4f4f4;color:#000}body.light-mode main{background-color:#e0e0e0;color:#000}body.dark-mode aside{background-color:#333;color:#fff}body.dark-mode main{background:#333;color:#fff}body.dark-mode footer{background:#333;color:#fff}body.light-mode a img{filter:invert(0%) sepia(100%) hue-rotate(180deg)}body.dark-mode a img{filter:invert(100%)}.theme-switch-wrapper{position:absolute;top:20px;right:20px;z-index:10}.theme-switch{position:relative;display:inline-block;width:80px;height:44px}.theme-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:gray;transition:.4s;border-radius:44px;width:80px;height:44px}.slider:hover{box-shadow:0 0 20px gray}.slider:before{position:absolute;content:"";height:36px;width:36px;left:4px;bottom:4px;background-image:url("/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;transition:.4s;border-radius:50%;background-size:cover}input:checked+.slider{background-color:gray}input:checked+.slider:hover{box-shadow:0 0 20px #fff}input:checked+.slider:before{transform:translateX(36px);background-image:url("/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;background-size:cover}aside{background-color:#f4f4f4;padding:10px;border-right:4px solid #fff;border-left:4px solid #fff;border-top:4px solid #fff;border-bottom:10px double #fff;margin-bottom:60px;flex:1}aside img{width:50%;max-width:200px;border-radius:50%;display:block;margin:20px auto;border:4px solid #ddd}aside h2{text-align:center;margin-bottom:0px;margin-top:30px;font-size:1.5em}aside p{text-align:center;margin-top:5px;padding-left:10px;padding-right:10px;font-size:1em}ul{list-style-type:none;padding:0;margin:0;text-align:center;line-height:1.6}ul li{display:block;margin:10px;margin-top:5px}.reference{width:100%;text-align:center;margin-bottom:10px;font-weight:bold;margin-bottom:5px;font-size:1.2em}aside a{text-decoration:none}aside button{display:block;margin:20px auto;padding:10px 20px;background-color:#e0e0e0;border:none;border-radius:5px;color:#333;font-size:14px;font-weight:bold;cursor:pointer;margin-top:30px;margin-bottom:30px;transition:background-color .3s ease}aside button:hover{background-color:#ccc}.buttons{display:flex;flex-direction:row;gap:5px;justify-content:center;margin-bottom:30px;margin-top:20px}.buttons button{margin:0 30px}button{width:150px}main{flex-grow:1;background-color:#e0e0e0;padding:10px;padding-left:40px;padding-right:40px;box-sizing:border-box;border-right:4px solid #fff;border-left:4px solid #fff;margin-bottom:60px;flex:1}main h1{margin-bottom:10px;font-size:2.5em;text-align:center}main h2{margin-top:0px;font-size:2em;text-align:center}main h3{margin-bottom:-10px;font-size:1.5em}main h4{margin-bottom:-10px;font-size:1em}main p{margin-top:10px}footer{position:relative;display:flex;justify-content:space-evenly;align-items:flex-end;padding:0px;background-color:#f4f4f4;color:#fff;position:fixed;bottom:0;width:100%;border-top:10px double #fff;height:50px;display:block;text-align:center;padding-top:10px;border-bottom:4px solid #fff}footer a{position:relative;color:#fff;text-decoration:none;font-size:1.5em;display:inline-block;margin:5px}footer a:hover{transform:scale(1.2)}footer img{width:30px;height:30px;margin:0 10px;transition:transform .3s ease,filter .3s ease}.tooltip{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.8);color:#fff;padding:5px 10px;border-radius:5px;font-size:14px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,transform .3s ease}footer a:hover .tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(-5px)}@media screen and (min-width: 1024px){body{flex-direction:row}aside{width:30%;border-right:10px double #fff;box-sizing:border-box}aside h2{margin-top:50px;font-size:2em}aside p{padding-left:20px;padding-right:20px;font-size:1.2em}ul li{font-size:1.2em}.reference{font-size:1.5em}aside button{font-size:1.1em;width:200px}main{width:400px;border-top:4px solid #fff;margin-bottom:70px;border-left:0px}main h1{margin-bottom:0px;font-size:3em}main h2{margin-top:5px;font-size:2.5em}main h3{font-size:2em}main h4{font-size:1.2em}main p{font-size:1.2em}footer{align-items:flex-end;height:50px}footer img{margin-left:40px;margin-right:40px}}/*# sourceMappingURL=main.css.map */ \ No newline at end of file diff --git a/css/main.css.map b/css/main.css.map index 46f92d0..e166343 100644 --- a/css/main.css.map +++ b/css/main.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignCv.scss","main.scss","_tabletDesignCv.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACE,oCACA,aACA,sBACA,iBACA,SAGA,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BAGF,UACE,UACA,kBACA,cACA,cACA,gBAGF,SACE,kBACA,kBACA,gBACA,gBAGF,QACE,kBACA,eACA,kBACA,mBACA,cAGF,GACE,qBACA,UACA,SACA,kBAGF,MACE,cACA,YACA,eAGF,WACE,WACA,WACA,kBACA,mBACA,iBACA,kBACA,gBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,uBACA,iBACA,kBACA,SAGF,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBAGF,QACE,mBACA,gBACA,kBAGF,QACE,eACA,cACA,kBAGF,QACE,oBACA,gBAGF,QACE,oBACA,cAGF,OACE,gBAGF,OACE,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,WACA,4BACA,YACA,cACA,kBACA,iBACA,6BACA,2BACA,4BAGF,SACE,WACA,qBACA,gBACA,qBACA,WAIF,WACE,WACA,YACA,cClKJ,sCCJA,KACI,oCACA,aACA,mBACA,iBACA,SAGF,MACE,UACA,yBACA,aACA,8BACA,sBACA,2BACA,0BAGF,UACE,UACA,kBACA,cACA,cAGF,SACE,kBACA,kBACA,gBACA,cAGF,QACE,kBACA,eACA,kBACA,mBACA,gBAGF,GACE,qBACA,UACA,SACA,kBAGF,MACE,cACA,YACA,eACA,gBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,gBACA,iBACA,eACA,gBACA,qCAGF,mBACE,sBAGF,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,YACA,4BACA,0BACA,mBACA,gBAGF,QACE,kBACA,cACA,kBAGF,QACE,eACA,gBACA,kBAGF,QACE,oBACA,cAGF,QACE,oBACA,gBAGF,OACE,gBACA,gBAGF,OACE,aACA,qBACA,YACA,yBACA,WACA,eACA,SACA,YACA,YACA,cACA,kBACA,iBACA,6BACA,2BACA,4BAGF,SACE,WACA,qBACA,gBACA,qBACA,WAIF,WACE,WACA,YACA,cACA,iBACA","file":"main.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignCv.scss","main.scss","_tabletDesignCv.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACE,oCACA,aACA,sBACA,iBACA,SACA,0CAIA,sBACE,yBACA,WAGF,qBACE,yBACA,WAIF,qBACE,sBACA,WAGF,oBACI,gBACA,WAGJ,sBACE,gBACE,WAGJ,sBACE,iDAGJ,qBACI,oBAGF,sBACE,kBACA,SACA,WACA,WAGF,cACE,kBACA,qBACA,WACA,YAGF,oBACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,eACA,mBACA,WACA,YAGF,cACE,yBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,yFACA,eACA,kBACA,sBAGF,sBACE,sBAGF,4BACE,yBAGF,6BACE,2BACA,0FACA,sBAIF,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BACA,mBACA,OAGF,UACE,UACA,gBACA,kBACA,cACA,iBACA,sBAIF,SACE,kBACA,kBACA,gBACA,gBAGF,QACE,kBACA,eACA,kBACA,mBACA,cAGF,GACE,qBACA,UACA,SACA,kBACA,gBAGF,MACE,cACA,YACA,eAGF,WACE,WACA,kBACA,mBACA,iBACA,kBACA,gBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,QACA,uBACA,mBACA,gBAGF,gBACE,cAGJ,OACE,YAGA,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBACA,OAGF,QACE,mBACA,gBACA,kBAGF,QACE,eACA,cACA,kBAGF,QACE,oBACA,gBAGF,QACE,oBACA,cAGF,OACE,gBAGF,OACE,kBACA,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,WACA,4BACA,YACA,cACA,kBACA,iBACA,6BAGF,SACE,kBACA,WACA,qBACA,gBACA,qBACA,WAGF,eACE,qBAIF,WACE,WACA,YACA,cACA,8CAIJ,SACE,kBACA,YACA,SACA,2BACA,gCACA,WACA,iBACA,kBACA,eACA,mBACA,UACA,kBACA,+CAIF,wBACE,UACA,mBACA,4CClTF,sCCJA,KACI,mBAGF,MACE,UACA,8BACA,sBAGF,SACE,gBACA,cAGF,QACE,kBACA,mBACA,gBAGF,MACE,gBAGF,WACE,gBAGF,aACE,gBACA,YAGF,KACE,YACA,0BACA,mBACA,gBAGF,QACE,kBACA,cAGF,QACE,eACA,gBAGF,QACE,cAGF,QACE,gBAGF,OACE,gBAGF,OACE,qBACA,YAIF,WACE,iBACA","file":"main.css"} \ No newline at end of file diff --git a/dark_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24 (1).svg b/dark_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24 (1).svg new file mode 100644 index 0000000..adb37d3 --- /dev/null +++ b/dark_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24 (1).svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg b/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..b1b4708 --- /dev/null +++ b/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/index.html b/index.html index eca11d1..5050c8f 100644 --- a/index.html +++ b/index.html @@ -7,19 +7,19 @@ - + + - \ No newline at end of file diff --git a/light_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg b/light_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..50d7cc1 --- /dev/null +++ b/light_mode_24dp_000000_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg b/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..a90b97e --- /dev/null +++ b/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/personligt_brev.html b/personligt_brev.html index d747149..636634d 100644 --- a/personligt_brev.html +++ b/personligt_brev.html @@ -19,7 +19,6 @@ - \ No newline at end of file From 4cfea44061c817a32e6eb2b1dcb3e0aaf9a4e757 Mon Sep 17 00:00:00 2001 From: angien90 Date: Mon, 10 Feb 2025 15:52:49 +0100 Subject: [PATCH 3/4] =?UTF-8?q?=C3=84ndrade=20inneh=C3=A5ll=20p=C3=A5=20pe?= =?UTF-8?q?rsonligt=20brev=20till=20lite=20mer=20generellt=20inneh=C3=A5ll?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/_mobileDesignCv.scss | 2 -- css/_mobileDesignPersonligtBrev.scss | 8 +++++--- css/main.css.map | 2 +- css/personligt_brev.css | 2 +- css/personligt_brev.css.map | 2 +- personligt_brev.html | 9 +++++---- 6 files changed, 13 insertions(+), 12 deletions(-) diff --git a/css/_mobileDesignCv.scss b/css/_mobileDesignCv.scss index b41398c..857483a 100644 --- a/css/_mobileDesignCv.scss +++ b/css/_mobileDesignCv.scss @@ -107,13 +107,11 @@ input:checked + .slider:before { background-size: cover; } -/* Tooltip för ljust läge */ body.light-mode .tooltip { background-color: rgba(0, 0, 0, 0.8); color: white; } -/* Tooltip för mörkt läge */ body.dark-mode .tooltip { background-color: rgba(255, 255, 255, 0.9); color: black; diff --git a/css/_mobileDesignPersonligtBrev.scss b/css/_mobileDesignPersonligtBrev.scss index 811aaf8..94ad519 100644 --- a/css/_mobileDesignPersonligtBrev.scss +++ b/css/_mobileDesignPersonligtBrev.scss @@ -33,6 +33,10 @@ body.dark-mode footer { color: white; } +body.dark-mode main a { + color: white; +} + body.light-mode a img { filter: invert(0%) sepia(100%) hue-rotate(180deg); } @@ -106,13 +110,11 @@ input:checked + .slider:before { background-size: cover; } -/* Tooltip för ljust läge */ body.light-mode .tooltip { background-color: rgba(0, 0, 0, 0.8); color: white; } -/* Tooltip för mörkt läge */ body.dark-mode .tooltip { background-color: rgba(255, 255, 255, 0.9); color: black; @@ -264,7 +266,7 @@ footer { color: white; position: fixed; bottom: 0; - width: 100%; + width: 100vw; border-top: 10px double white; height: 50px; display: block; diff --git a/css/main.css.map b/css/main.css.map index 466d40d..8794390 100644 --- a/css/main.css.map +++ b/css/main.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignCv.scss","main.scss","_tabletDesignCv.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACA,oCACA,aACA,sBACA,iBACA,SACA,0CAIA,sBACE,yBACA,WAGF,qBACE,yBACA,WAIF,qBACE,sBACA,WAGF,oBACI,gBACA,WAGJ,sBACE,gBACE,WAGJ,sBACE,iDAGF,qBACE,oBAGF,sBACE,kBACA,SACA,WACA,WAGF,cACE,kBACA,qBACA,WACA,YAGF,oBACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,eACA,mBACA,WACA,YAGF,cACE,yBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,yFACA,eACA,kBACA,sBAGF,sBACE,sBAGF,4BACE,yBAGF,6BACE,2BACA,0FACA,sBAIF,yBACE,gCACA,WAIF,wBACE,sCACA,WACA,gCAIF,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BACA,OAGF,UACE,UACA,gBACA,kBACA,cACA,iBACA,sBAGF,SACE,kBACA,kBACA,gBACA,gBAGF,QACE,kBACA,eACA,kBACA,mBACA,cAGF,GACE,qBACA,UACA,SACA,kBACA,gBAGF,MACE,cACA,YACA,eAGF,WACE,WACA,kBACA,mBACA,iBACA,kBACA,gBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,QACA,uBACA,mBACA,gBAGF,gBACE,cAGF,OACA,YAIA,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBACA,OAGF,QACE,gBACA,mBACA,gBACA,kBAGF,QACE,eACA,cACA,kBAGF,QACE,oBACA,gBAGF,QACE,oBACA,cAGF,OACE,gBAIF,OACE,kBACA,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,WACA,4BACA,YACA,cACA,kBACA,iBACA,6BAGF,SACE,kBACA,WACA,qBACA,gBACA,qBACA,WAGF,eACE,qBAGF,WACE,WACA,YACA,cACA,8CAIF,SACE,kBACA,YACA,SACA,2BACA,gCACA,WACA,iBACA,kBACA,eACA,mBACA,UACA,kBACA,+CAIF,wBACE,UACA,mBACA,4CC/TF,sCCJA,KACI,mBAGF,MACE,UACA,8BACA,sBACA,mBAGF,SACE,gBACA,cAGF,QACE,kBACA,mBACA,gBAGF,MACE,gBAGF,WACE,gBAGF,aACE,gBACA,YAGF,KACE,YACA,0BACA,mBACA,gBAGF,QACE,kBACA,cAGF,QACE,eACA,gBAGF,QACE,cAGF,QACE,gBAGF,OACE,gBAGF,OACE,qBACA,YAGF,WACE,iBACA","file":"main.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignCv.scss","main.scss","_tabletDesignCv.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACA,oCACA,aACA,sBACA,iBACA,SACA,0CAIA,sBACE,yBACA,WAGF,qBACE,yBACA,WAIF,qBACE,sBACA,WAGF,oBACI,gBACA,WAGJ,sBACE,gBACE,WAGJ,sBACE,iDAGF,qBACE,oBAGF,sBACE,kBACA,SACA,WACA,WAGF,cACE,kBACA,qBACA,WACA,YAGF,oBACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,eACA,mBACA,WACA,YAGF,cACE,yBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,yFACA,eACA,kBACA,sBAGF,sBACE,sBAGF,4BACE,yBAGF,6BACE,2BACA,0FACA,sBAGF,yBACE,gCACA,WAGF,wBACE,sCACA,WACA,gCAIF,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BACA,OAGF,UACE,UACA,gBACA,kBACA,cACA,iBACA,sBAGF,SACE,kBACA,kBACA,gBACA,gBAGF,QACE,kBACA,eACA,kBACA,mBACA,cAGF,GACE,qBACA,UACA,SACA,kBACA,gBAGF,MACE,cACA,YACA,eAGF,WACE,WACA,kBACA,mBACA,iBACA,kBACA,gBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,QACA,uBACA,mBACA,gBAGF,gBACE,cAGF,OACA,YAIA,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBACA,OAGF,QACE,gBACA,mBACA,gBACA,kBAGF,QACE,eACA,cACA,kBAGF,QACE,oBACA,gBAGF,QACE,oBACA,cAGF,OACE,gBAIF,OACE,kBACA,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,WACA,4BACA,YACA,cACA,kBACA,iBACA,6BAGF,SACE,kBACA,WACA,qBACA,gBACA,qBACA,WAGF,eACE,qBAGF,WACE,WACA,YACA,cACA,8CAIF,SACE,kBACA,YACA,SACA,2BACA,gCACA,WACA,iBACA,kBACA,eACA,mBACA,UACA,kBACA,+CAIF,wBACE,UACA,mBACA,4CC7TF,sCCJA,KACI,mBAGF,MACE,UACA,8BACA,sBACA,mBAGF,SACE,gBACA,cAGF,QACE,kBACA,mBACA,gBAGF,MACE,gBAGF,WACE,gBAGF,aACE,gBACA,YAGF,KACE,YACA,0BACA,mBACA,gBAGF,QACE,kBACA,cAGF,QACE,eACA,gBAGF,QACE,cAGF,QACE,gBAGF,OACE,gBAGF,OACE,qBACA,YAGF,WACE,iBACA","file":"main.css"} \ No newline at end of file diff --git a/css/personligt_brev.css b/css/personligt_brev.css index 2bdd0f4..0fccd44 100644 --- a/css/personligt_brev.css +++ b/css/personligt_brev.css @@ -1 +1 @@ -/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}body{font-family:"El Messiri",sans-serif;display:flex;flex-direction:column;min-height:100vh;margin:0;transition:background-color .5s,color .5s}body.light-mode aside{background-color:#f4f4f4;color:#000}body.light-mode main{background-color:#e0e0e0;color:#000}body.dark-mode aside{background-color:#333;color:#fff}body.dark-mode main{background:#333;color:#fff}body.dark-mode footer{background:#333;color:#fff}body.light-mode a img{filter:invert(0%) sepia(100%) hue-rotate(180deg)}body.dark-mode a img{filter:invert(100%)}.theme-switch-wrapper{position:absolute;top:20px;right:20px;z-index:10}.theme-switch{position:relative;display:inline-block;width:80px;height:44px}.theme-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:gray;transition:.4s;border-radius:44px;width:80px;height:44px}.slider:hover{box-shadow:0 0 20px gray}.slider:before{position:absolute;content:"";height:36px;width:36px;left:4px;bottom:4px;background-image:url("/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;transition:.4s;border-radius:50%;background-size:cover}input:checked+.slider{background-color:gray}input:checked+.slider:hover{box-shadow:0 0 20px #fff}input:checked+.slider:before{transform:translateX(36px);background-image:url("/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;background-size:cover}body.light-mode .tooltip{background-color:rgba(0,0,0,.8);color:#fff}body.dark-mode .tooltip{background-color:rgba(255,255,255,.9);color:#000;border:1px solid rgba(0,0,0,.2)}aside{background-color:#f4f4f4;padding:10px;border-right:4px solid #fff;border-left:4px solid #fff;border-top:4px solid #fff;border-bottom:10px double #fff;flex:1}aside img{width:50%;max-width:200px;border-radius:50%;display:block;margin:20px auto;border:4px solid #ddd}aside h1{margin-top:0;margin-bottom:0;font-size:2.5em;text-align:center}aside h2{margin-top:0px;margin-bottom:10px;font-size:1.7em;text-align:center}.contact-info{text-transform:uppercase;margin-top:0;font-size:1.7em}aside h3{margin-bottom:0px;margin-top:20px;font-size:1.5em;text-align:center}aside p{margin-top:0px;margin-bottom:0px;font-size:1.2em;text-align:center}aside a{text-decoration:none}aside button{display:block;margin:20px auto;padding:10px 20px;background-color:#e0e0e0;border:none;border-radius:5px;color:#333;font-size:14px;font-weight:bold;cursor:pointer;margin-top:30px;margin-bottom:30px;transition:background-color .3s ease}aside button:hover{background-color:#ccc}.buttons{display:flex;flex-direction:row;gap:5px;justify-content:center;margin-bottom:30px;margin-top:20px}.buttons button{margin:0 30px}button{width:150px}main{flex-grow:1;background-color:#e0e0e0;padding:10px;padding-left:40px;padding-right:40px;box-sizing:border-box;border-right:4px solid #fff;border-left:4px solid #fff;margin-bottom:60px;flex:1}main h2{margin-top:60px;margin-bottom:10px;font-size:2.5em;text-align:center}main h3{margin-top:0px;margin-bottom:10px;font-size:2em;text-align:center}main p{margin-bottom:30px;text-align:center;font-size:1.2em}main a{color:#000;font-weight:bold}footer{position:relative;display:flex;justify-content:space-evenly;align-items:flex-end;padding:0px;background-color:#f4f4f4;color:#fff;position:fixed;bottom:0;width:100%;border-top:10px double #fff;height:50px;display:block;text-align:center;padding-top:10px;border-bottom:4px solid #fff}footer a{position:relative;color:#fff;text-decoration:none;font-size:1.5em;display:inline-block;margin:5px}footer a:hover{transform:scale(1.2)}footer img{width:30px;height:30px;margin:0 10px;transition:transform .3s ease,filter .3s ease}.tooltip{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.8);color:#fff;padding:5px 10px;border-radius:5px;font-size:14px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,transform .3s ease}footer a:hover .tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(-5px)}@media screen and (min-width: 1024px){body{flex-direction:row}aside{width:30%;border-right:10px double #fff;box-sizing:border-box;margin-bottom:60px}aside h2{margin-top:50px;font-size:3em}aside p{padding-left:20px;padding-right:20px;font-size:1.2em}aside button{font-size:1.1em;width:200px}main{width:400px;border-top:4px solid #fff;margin-bottom:70px;border-left:0px}main h2{font-size:3em;margin-bottom:0px}main h3{margin-top:5px;font-size:2.5em}main p{font-size:1.2em}footer{align-items:flex-end;height:50px}footer img{margin-left:40px;margin-right:40px}}/*# sourceMappingURL=personligt_brev.css.map */ \ No newline at end of file +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:rgba(0,0,0,0)}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}body{font-family:"El Messiri",sans-serif;display:flex;flex-direction:column;min-height:100vh;margin:0;transition:background-color .5s,color .5s}body.light-mode aside{background-color:#f4f4f4;color:#000}body.light-mode main{background-color:#e0e0e0;color:#000}body.dark-mode aside{background-color:#333;color:#fff}body.dark-mode main{background:#333;color:#fff}body.dark-mode footer{background:#333;color:#fff}body.dark-mode main a{color:#fff}body.light-mode a img{filter:invert(0%) sepia(100%) hue-rotate(180deg)}body.dark-mode a img{filter:invert(100%)}.theme-switch-wrapper{position:absolute;top:20px;right:20px;z-index:10}.theme-switch{position:relative;display:inline-block;width:80px;height:44px}.theme-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:gray;transition:.4s;border-radius:44px;width:80px;height:44px}.slider:hover{box-shadow:0 0 20px gray}.slider:before{position:absolute;content:"";height:36px;width:36px;left:4px;bottom:4px;background-image:url("/dark_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;transition:.4s;border-radius:50%;background-size:cover}input:checked+.slider{background-color:gray}input:checked+.slider:hover{box-shadow:0 0 20px #fff}input:checked+.slider:before{transform:translateX(36px);background-image:url("/light_mode_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.svg") !important;background-size:cover}body.light-mode .tooltip{background-color:rgba(0,0,0,.8);color:#fff}body.dark-mode .tooltip{background-color:rgba(255,255,255,.9);color:#000;border:1px solid rgba(0,0,0,.2)}aside{background-color:#f4f4f4;padding:10px;border-right:4px solid #fff;border-left:4px solid #fff;border-top:4px solid #fff;border-bottom:10px double #fff;flex:1}aside img{width:50%;max-width:200px;border-radius:50%;display:block;margin:20px auto;border:4px solid #ddd}aside h1{margin-top:0;margin-bottom:0;font-size:2.5em;text-align:center}aside h2{margin-top:0px;margin-bottom:10px;font-size:1.7em;text-align:center}.contact-info{text-transform:uppercase;margin-top:0;font-size:1.7em}aside h3{margin-bottom:0px;margin-top:20px;font-size:1.5em;text-align:center}aside p{margin-top:0px;margin-bottom:0px;font-size:1.2em;text-align:center}aside a{text-decoration:none}aside button{display:block;margin:20px auto;padding:10px 20px;background-color:#e0e0e0;border:none;border-radius:5px;color:#333;font-size:14px;font-weight:bold;cursor:pointer;margin-top:30px;margin-bottom:30px;transition:background-color .3s ease}aside button:hover{background-color:#ccc}.buttons{display:flex;flex-direction:row;gap:5px;justify-content:center;margin-bottom:30px;margin-top:20px}.buttons button{margin:0 30px}button{width:150px}main{flex-grow:1;background-color:#e0e0e0;padding:10px;padding-left:40px;padding-right:40px;box-sizing:border-box;border-right:4px solid #fff;border-left:4px solid #fff;margin-bottom:60px;flex:1}main h2{margin-top:60px;margin-bottom:10px;font-size:2.5em;text-align:center}main h3{margin-top:0px;margin-bottom:10px;font-size:2em;text-align:center}main p{margin-bottom:30px;text-align:center;font-size:1.2em}main a{color:#000;font-weight:bold}footer{position:relative;display:flex;justify-content:space-evenly;align-items:flex-end;padding:0px;background-color:#f4f4f4;color:#fff;position:fixed;bottom:0;width:100vw;border-top:10px double #fff;height:50px;display:block;text-align:center;padding-top:10px;border-bottom:4px solid #fff}footer a{position:relative;color:#fff;text-decoration:none;font-size:1.5em;display:inline-block;margin:5px}footer a:hover{transform:scale(1.2)}footer img{width:30px;height:30px;margin:0 10px;transition:transform .3s ease,filter .3s ease}.tooltip{position:absolute;bottom:60px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.8);color:#fff;padding:5px 10px;border-radius:5px;font-size:14px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,transform .3s ease}footer a:hover .tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(-5px)}@media screen and (min-width: 1024px){body{flex-direction:row}aside{width:30%;border-right:10px double #fff;box-sizing:border-box;margin-bottom:60px}aside h2{margin-top:50px;font-size:3em}aside p{padding-left:20px;padding-right:20px;font-size:1.2em}aside button{font-size:1.1em;width:200px}main{width:400px;border-top:4px solid #fff;margin-bottom:70px;border-left:0px}main h2{font-size:3em;margin-bottom:0px}main h3{margin-top:5px;font-size:2.5em}main p{font-size:1.2em}footer{align-items:flex-end;height:50px}footer img{margin-left:40px;margin-right:40px}}/*# sourceMappingURL=personligt_brev.css.map */ \ No newline at end of file diff --git a/css/personligt_brev.css.map b/css/personligt_brev.css.map index fec55f2..ed06cc5 100644 --- a/css/personligt_brev.css.map +++ b/css/personligt_brev.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignPersonligtBrev.scss","personligt_brev.scss","_tabletDesignPersonligtBrev.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACE,oCACA,aACA,sBACA,iBACA,SACA,0CAIF,sBACE,yBACA,WAGF,qBACE,yBACA,WAGF,qBACE,sBACA,WAGF,oBACE,gBACA,WAGF,sBACE,gBACA,WAGF,sBACE,iDAGF,qBACE,oBAGF,sBACE,kBACA,SACA,WACA,WAGF,cACE,kBACA,qBACA,WACA,YAGF,oBACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,eACA,mBACA,WACA,YAGF,cACE,yBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,yFACA,eACA,kBACA,sBAGF,sBACE,sBAGF,4BACE,yBAGF,6BACE,2BACA,0FACA,sBAIF,yBACE,gCACA,WAIF,wBACE,sCACA,WACA,gCAIF,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BACA,OAGF,UACE,UACA,gBACA,kBACA,cACA,iBACA,sBAGF,SACE,aACA,gBACA,gBACA,kBAGF,SACE,eACA,mBACA,gBACA,kBAGF,cACE,yBACA,aACA,gBAGF,SACE,kBACA,gBACA,gBACA,kBAGF,QACE,eACA,kBACA,gBACA,kBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,QACA,uBACA,mBACA,gBAGF,gBACE,cAGF,OACA,YAIA,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBACA,OAGF,QACE,gBACA,mBACA,gBACA,kBAGF,QACE,eACA,mBACA,cACA,kBAGF,OACE,mBACA,kBACA,gBAGF,OACE,WACA,iBAIF,OACE,kBACA,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,WACA,4BACA,YACA,cACA,kBACA,iBACA,6BAGF,SACE,kBACA,WACA,qBACA,gBACA,qBACA,WAGF,eACE,qBAGF,WACE,WACA,YACA,cACA,8CAIF,SACE,kBACA,YACA,SACA,2BACA,gCACA,WACA,iBACA,kBACA,eACA,mBACA,UACA,kBACA,+CAIF,wBACE,UACA,mBACA,4CCxTF,sCCJA,KACI,mBAGF,MACE,UACA,8BACA,sBACA,mBAGF,SACE,gBACA,cAGF,QACE,kBACA,mBACA,gBAGF,aACE,gBACA,YAGF,KACE,YACA,0BACA,mBACA,gBAGF,QACE,cACA,kBAGF,QACE,eACA,gBAGF,OACE,gBAGF,OACE,qBACA,YAGF,WACE,iBACA","file":"personligt_brev.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["_resetDesign.scss","_mobileDesignPersonligtBrev.scss","personligt_brev.scss","_tabletDesignPersonligtBrev.scss"],"names":[],"mappings":"AAAA,4EAUC,KACG,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,+BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VJ,KACE,oCACA,aACA,sBACA,iBACA,SACA,0CAIF,sBACE,yBACA,WAGF,qBACE,yBACA,WAGF,qBACE,sBACA,WAGF,oBACE,gBACA,WAGF,sBACE,gBACA,WAGF,sBACE,WAGF,sBACE,iDAGF,qBACE,oBAGF,sBACE,kBACA,SACA,WACA,WAGF,cACE,kBACA,qBACA,WACA,YAGF,oBACE,UACA,QACA,SAGF,QACE,kBACA,eACA,MACA,OACA,QACA,SACA,sBACA,eACA,mBACA,WACA,YAGF,cACE,yBAGF,eACE,kBACA,WACA,YACA,WACA,SACA,WACA,yFACA,eACA,kBACA,sBAGF,sBACE,sBAGF,4BACE,yBAGF,6BACE,2BACA,0FACA,sBAGF,yBACE,gCACA,WAGF,wBACE,sCACA,WACA,gCAIF,MACE,yBACA,aACA,4BACA,2BACA,0BACA,+BACA,OAGF,UACE,UACA,gBACA,kBACA,cACA,iBACA,sBAGF,SACE,aACA,gBACA,gBACA,kBAGF,SACE,eACA,mBACA,gBACA,kBAGF,cACE,yBACA,aACA,gBAGF,SACE,kBACA,gBACA,gBACA,kBAGF,QACE,eACA,kBACA,gBACA,kBAGF,QACE,qBAGF,aACE,cACA,iBACA,kBACA,yBACA,YACA,kBACA,WACA,eACA,iBACA,eACA,gBACA,mBACA,qCAGF,mBACE,sBAGF,SACE,aACA,mBACA,QACA,uBACA,mBACA,gBAGF,gBACE,cAGF,OACA,YAIA,KACE,YACA,yBACA,aACA,kBACA,mBACA,sBACA,4BACA,2BACA,mBACA,OAGF,QACE,gBACA,mBACA,gBACA,kBAGF,QACE,eACA,mBACA,cACA,kBAGF,OACE,mBACA,kBACA,gBAGF,OACE,WACA,iBAIF,OACE,kBACA,aACA,6BACA,qBACA,YACA,yBACA,WACA,eACA,SACA,YACA,4BACA,YACA,cACA,kBACA,iBACA,6BAGF,SACE,kBACA,WACA,qBACA,gBACA,qBACA,WAGF,eACE,qBAGF,WACE,WACA,YACA,cACA,8CAIF,SACE,kBACA,YACA,SACA,2BACA,gCACA,WACA,iBACA,kBACA,eACA,mBACA,UACA,kBACA,+CAIF,wBACE,UACA,mBACA,4CC1TF,sCCJA,KACI,mBAGF,MACE,UACA,8BACA,sBACA,mBAGF,SACE,gBACA,cAGF,QACE,kBACA,mBACA,gBAGF,aACE,gBACA,YAGF,KACE,YACA,0BACA,mBACA,gBAGF,QACE,cACA,kBAGF,QACE,eACA,gBAGF,OACE,gBAGF,OACE,qBACA,YAGF,WACE,iBACA","file":"personligt_brev.css"} \ No newline at end of file diff --git a/personligt_brev.html b/personligt_brev.html index b8456fc..73fa703 100644 --- a/personligt_brev.html +++ b/personligt_brev.html @@ -67,11 +67,12 @@

Bosatt

Ansökan om praktikplats

Frontend Developer


-

Mitt namn är Angelica, och jag studerar Frontendutveckling på Medieinstitutet. I oktober går jag ut på min första LIA, en praktikperiod på 10 veckor, och jag skulle med stort engagemang vilja genomföra den hos er.

-

Jag är särskilt intresserad av ert företag då jag tror att min tidigare erfarenhet och nyvunna kunskap skulle kunna bidra positivt till ert team. Under min utbildning har jag fördjupat mig inom HTML, CSS och JavaScript, samt arbetat med agila metoder som Scrum. Jag har också studerat UX och usability, grafiska verktyg för gränssnittsdesign, API-utveckling och testning. Våra projekt har varit både individuella och i grupp, vilket har gett mig en god balans mellan självständigt arbete och samarbete. Mer om utbildningen kan ni läsa här.

+

Mitt namn är Angelica, och jag studerar Frontendutveckling på Medieinstitutet. Jag söker nu en praktikplats där jag kan omsätta mina kunskaper i praktiken och bidra med min passion för frontendutveckling. Min bakgrund inom kvalitet- och miljöledning har gett mig en förståelse för systematik, användarvänlighet och hållbara lösningar – insikter som jag gärna tillämpar i utvecklingen av moderna, tillgängliga och effektiva webblösningar. I oktober går jag ut på min första LIA, en praktikperiod på 10 veckor.

+

Min utbildning inom Frontendutveckling vid Medieinstitutet har gett mig en bred teknisk grund inom HTML, CSS och JavaScript samt fördjupade kunskaper inom moderna ramverk som React och Vue. Jag har också studerat API-utveckling, testning, UX och usability, samt arbetat med agila metoder som Scrum. Utbildningen är praktiskt inriktad med många projekt, vilket har gett mig erfarenhet av både individuellt arbete och samarbete i team. Du kan se några av mina projekt på min GitHub-profil..

+

Utöver mina studier driver jag också en egen hemsida, där jag experimenterar med ny teknik och utvecklar mina färdigheter inom design, funktionalitet och prestanda. Detta har gett mig värdefull praktisk erfarenhet och en förståelse för hur man bygger och underhåller webblösningar i verkliga scenarion.

Jag är en nyfiken och målmedveten person med en passion för att skapa användarvänliga och visuellt tilltalande webbplatser. Noggrannhet och stolthet i mina uppdrag är viktiga drivkrafter för mig. Jag trivs lika bra med att arbeta självständigt som i team och har en snabb inlärningsförmåga när det gäller nya teknologier.

-

Jag är övertygad om att mina kunskaper och mitt engagemang kan bidra till ert team. Det skulle vara en fantastisk möjlighet att få lära mig mer om er verksamhet och samtidigt bidra till er fortsatta framgång.

-

Här hittar ni mitt CV för mer information om min utbildning och erfarenhet. Tveka inte att höra av er om ni har några frågor.

+

Jag ser fram emot möjligheten att utvecklas i en professionell miljö och att bidra med mina kunskaper. Mer information om min utbildning och erfarenhet finns i mitt CV.

+

Tveka inte att höra av er om ni har några frågor!