commit 920ed8a08d3fb91c7386f2be6605054e17d0e66c Author: Henrik Bygren Date: Mon Apr 4 13:17:33 2022 +0200 upload diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..1193285 --- /dev/null +++ b/css/style.css @@ -0,0 +1,106 @@ +* { + margin: 0; + padding: 0; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} + +htmll { + font-size: 62.5%; +} + +body { + font-family: Helvetica,Arial, sans-serif; +} + +header { + background-color: #222222; + color: #bababa; + padding: 1rem; +} + +header img { + float: left; + height: 3rem; + width: auto; + margin-right: 2rem; +} + +header h1 { + font-family: Arial, Helvetica, sans-serif; + font-size: 2.5rem; +} + +header nav ul { + list-style-type: none; + margin-left: 0; +} + +header nav ul li { + display: inline-block; + background-color: #d3d00c; + color: #448344; + border: 1px solid black; + margin-left: 0; + font-size: 1rem; + padding: 2px 4px 2px 4px; +} + +header nav a { + text-decoration: none; + color: black; +} + +main { + position: relative; + padding: 1rem; + display: -ms-grid; + display: grid; + -ms-grid-columns: 1fr 1fr; + grid-template-columns: 1fr 1fr; + gap: 0.4rem; +} + +main section { + border: 1px solid black; + padding: 0.4rem; + height: 18rem; +} + +main section h2 { + font-size: 1.8rem; + margin-bottom: 0.5rem; +} + +main section h2 { + font-size: 1.4rem; + margin-bottom: 0.3rem; +} + +main section p { + margin-bottom: 0.4rem; +} + +main #calc { + border: 1px solid green; + padding-left: 5px; + padding-top: 5px; + padding-bottom: 5px; +} + +main #calc input[type='number'] { + margin: 0.3rem; +} + +main #calc button { + margin-top: 0.2rem; + margin-left: 0.4rem; + margin-bottom: 0.2rem; +} + +footer { + background-color: #222222; + color: #bababa; + padding: 1rem; +} +/*# sourceMappingURL=style.css.map */ \ No newline at end of file diff --git a/css/style.css.map b/css/style.css.map new file mode 100644 index 0000000..d0f2579 --- /dev/null +++ b/css/style.css.map @@ -0,0 +1,9 @@ +{ + "version": 3, + "mappings": "AAAA,AAAA,CAAC,CAAA;EACG,MAAM,EAAE,CAAC;EACT,OAAO,EAAC,CAAC;EACT,UAAU,EAAE,UAAU;CACzB;;AAED,AAAA,KAAK,CAAA;EACD,SAAS,EAAE,KAAK;CACnB;;AACD,AAAA,IAAI,CAAA;EACA,WAAW,EAAE,2BAA2B;CAC3C;;AACD,AAAA,MAAM,CAAA;EACF,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAE,OAAO;EACd,OAAO,EAAE,IAAI;CAmChB;;AAtCD,AAKI,MALE,CAKF,GAAG,CAAA;EACC,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,IAAI;EACX,YAAY,EAAE,IAAI;CACrB;;AAVL,AAYI,MAZE,CAYF,EAAE,CAAA;EACE,WAAW,EAAE,4BAA4B;EACzC,SAAS,EAAE,MAAM;CACpB;;AAfL,AAkBQ,MAlBF,CAiBF,GAAG,CACC,EAAE,CAAA;EACE,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,CAAC;CAWjB;;AA/BT,AAsBY,MAtBN,CAiBF,GAAG,CACC,EAAE,CAIE,EAAE,CAAA;EACE,OAAO,EAAE,YAAY;EACrB,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAC,OAAO;EACb,MAAM,EAAE,eAAe;EACvB,WAAW,EAAE,CAAC;EACd,SAAS,EAAE,IAAI;EACf,OAAO,EAAE,eAAe;CAC3B;;AA9Bb,AAiCQ,MAjCF,CAiBF,GAAG,CAgBC,CAAC,CAAA;EACG,eAAe,EAAE,IAAI;EACrB,KAAK,EAAE,KAAK;CACf;;AAIT,AAAA,IAAI,CAAA;EACA,QAAQ,EAAE,QAAQ;EAClB,OAAO,EAAE,IAAI;EACb,OAAO,EAAE,IAAI;EACb,qBAAqB,EAAE,OAAO;EAC9B,GAAG,EAAE,MAAM;CAoCd;;AAzCD,AAOI,IAPA,CAOA,OAAO,CAAA;EACH,MAAM,EAAE,eAAe;EACvB,OAAO,EAAE,MAAM;EACf,MAAM,EAAE,KAAK;CAchB;;AAxBL,AAWQ,IAXJ,CAOA,OAAO,CAIH,EAAE,CAAA;EACE,SAAS,EAAE,MAAM;EACjB,aAAa,EAAE,MAAM;CACxB;;AAdT,AAgBQ,IAhBJ,CAOA,OAAO,CASH,EAAE,CAAA;EACE,SAAS,EAAE,MAAM;EACjB,aAAa,EAAE,MAAM;CACxB;;AAnBT,AAqBQ,IArBJ,CAOA,OAAO,CAcH,CAAC,CAAA;EACG,aAAa,EAAE,MAAM;CACxB;;AAvBT,AA0BI,IA1BA,CA0BA,KAAK,CAAA;EACD,MAAM,EAAE,eAAe;EACvB,YAAY,EAAE,GAAG;EACjB,WAAW,EAAE,GAAG;EAChB,cAAc,EAAE,GAAG;CAUtB;;AAxCL,AAgCQ,IAhCJ,CA0BA,KAAK,CAMD,KAAK,CAAA,AAAA,IAAC,CAAK,QAAQ,AAAb,EAAc;EAChB,MAAM,EAAE,MAAM;CACjB;;AAlCT,AAmCQ,IAnCJ,CA0BA,KAAK,CASD,MAAM,CAAA;EACF,UAAU,EAAE,MAAM;EAClB,WAAW,EAAE,MAAM;EACnB,aAAa,EAAE,MAAM;CACxB;;AAIT,AAAA,MAAM,CAAA;EACF,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAE,OAAO;EACd,OAAO,EAAE,IAAI;CAChB", + "sources": [ + "style.scss" + ], + "names": [], + "file": "style.css" +} \ No newline at end of file diff --git a/css/style.scss b/css/style.scss new file mode 100644 index 0000000..e844c14 --- /dev/null +++ b/css/style.scss @@ -0,0 +1,100 @@ +*{ + margin: 0; + padding:0; + box-sizing: border-box; +} + +htmll{ + font-size: 62.5%; +} +body{ + font-family: Helvetica,Arial, sans-serif; +} +header{ + background-color: #222222; + color: #bababa; + padding: 1rem; + + img{ + float: left; + height: 3rem; + width: auto; + margin-right: 2rem; + } + + h1{ + font-family: Arial, Helvetica, sans-serif; + font-size: 2.5rem; + } + + nav{ + ul{ + list-style-type: none; + margin-left: 0; + + li{ + display: inline-block; + background-color: #d3d00c; + color:#448344; + border: 1px solid black; + margin-left: 0; + font-size: 1rem; + padding: 2px 4px 2px 4px; + } + } + + a{ + text-decoration: none; + color: black; + } + } +} + +main{ + position: relative; + padding: 1rem; + display: grid; + grid-template-columns: 1fr 1fr; + gap: 0.4rem; + + section{ + border: 1px solid black; + padding: 0.4rem; + height: 18rem; + h2{ + font-size: 1.8rem; + margin-bottom: 0.5rem; + } + + h2{ + font-size: 1.4rem; + margin-bottom: 0.3rem; + } + + p{ + margin-bottom: 0.4rem; + } + } + + #calc{ + border: 1px solid green; + padding-left: 5px; + padding-top: 5px; + padding-bottom: 5px; + + input[type='number']{ + margin: 0.3rem; + } + button{ + margin-top: 0.2rem; + margin-left: 0.4rem; + margin-bottom: 0.2rem; + } + } +} + +footer{ + background-color: #222222; + color: #bababa; + padding: 1rem; +} diff --git a/img/henrik.png b/img/henrik.png new file mode 100755 index 0000000..56dfcdb Binary files /dev/null and b/img/henrik.png differ diff --git a/img/js-logo.svg b/img/js-logo.svg new file mode 100644 index 0000000..b1428d6 --- /dev/null +++ b/img/js-logo.svg @@ -0,0 +1,54 @@ + + + Slice 1 + + + + image/svg+xml + + Slice 1 + + + + + + + + + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..9d133fa --- /dev/null +++ b/index.html @@ -0,0 +1,66 @@ + + + + + + + JavaScript Prov WU-2 + + + + +
+ js logo +

Prov i JavasScript

+ +
+
+
+

Detta om detta

+

Ta bort

+

Lorem ipsum dolor sit amet, mea denique iudicabit ne. Quo ipsum errem torquatos te, + nominavi accusata erroribus sit in. Idque facilisis no eam

+ +

sea labore fuisset accusamus in.Quo an latine deserunt recteque.

+ +

Pro at ponderum consetetur reformidans. Ut nam iudico decore scripta, + per sint delicata te, ne sit modo etiam.

+ +

Quo ipsum errem torquatos te, nominavi accusata erroribus sit in. Idque facilisis no eam, + sea labore fuisset accusamus in.

+
+
+

Mer om detta

+ Bild på Henrik Bygren + +

Gå till DN och titta.

+
+
+

Klassen

+ +
+
+
+ Multiplication + x =
+ +
+
+
+ + + \ No newline at end of file diff --git a/js/script.js b/js/script.js new file mode 100644 index 0000000..36f1f36 --- /dev/null +++ b/js/script.js @@ -0,0 +1,7 @@ +const names = ['Otto', 'Johan','Axel', 'Theodor', 'Alvin', 'saleh', 'isak', 'Henrik', 'Jonathan', 'Omar', 'Joel']; + +function init() { + alert("Funktionen init() körs nu. Kommentera bort raden i js-filen när det fungerar."); +} + +window.addEventListener('load', init); \ No newline at end of file