JavaScript Practice

\n This is a simple demonstration page for you to see and try various ways\n that JavaScript can be used to change the contents of a web page. Remember\n that HTML, CSS and JavaScript all work together to create the contests,\n style, and actions that are present on a web page. Look at each of the\n files in the project to see how it contributes to the whole.\n

\n\n \n

Click the button to show the current time and date

\n\n

\n Move this slider to change the date's text size.\n \n

\n\n ⚙️\n \n","deleted","label","children",[],[166],{"_106":184,"_99":185,"_167":119,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":186,"_103":33,"_174":187,"_176":188,"_178":22,"_179":-5,"_180":189,"_102":190},"051f8a5c-26ea-11f1-aab9-42dde27851f2","main.ts",["D",1774292197432],"http","import { staticHTTPServer } from \"https://esm.town/v/std/utils/index.ts\";\nexport default staticHTTPServer(import.meta.url);",[],[185],{"_106":192,"_99":193,"_167":194,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":195,"_103":33,"_174":196,"_176":197,"_178":22,"_179":-5,"_180":198,"_102":199},"051f8eda-26ea-11f1-aab9-42dde27851f2","script.js","019d1c0e-6090-77a1-a9f3-e7c0b3dee89d",["D",1774292197432],"script","//alert(\"Hi!\");\nloadSettings();\n\nfunction _click() {\n document.getElementById(\"date\").innerHTML = Date();\n document.getElementById(\"date\").style.color = \"red\";\n}\n\nfunction _changeSize(size) {\n //console.log(\"Size is: \" + size);\n document.getElementById(\"date\").style.fontSize = size + \"px\";\n}\n\nfunction _saveSettings() {\n console.log(\"Saving settings\");\n // add lines to store data here, like this:\n localStorage.setItem(\"username\", \"John Doe\");\n localStorage.setItem(\"bgcolor\", \"#e0e0ee\");\n localStorage.setItem(\"darkmode\", \"true\");\n location.replace(\"index.html\");\n}\n\nfunction loadSettings() {\n // add lines to read data and set style here, like this\n const username = localStorage.getItem(\"username\");\n const bgcolor = localStorage.getItem(\"bgcolor\");\n const darkmode = localStorage.getItem(\"darkmode\");\n\n console.log(\"Name=\" + username);\n console.log(\"BG Color=\" + bgcolor);\n console.log(\"Dark?\" + darkmode);\n\n if (darkmode == \"true\") {\n document.documentElement.style.setProperty(\"--bg-color\", \"#222222\");\n document.documentElement.style.setProperty(\"--text-color\", \"#eeeeee\");\n } else {\n document.documentElement.style.setProperty(\"--bg-color\", bgcolor);\n document.documentElement.style.setProperty(\"--text-color\", \"#000000\");\n }\n}",[],[193],{"_106":201,"_99":202,"_167":203,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":204,"_103":33,"_174":175,"_176":205,"_178":22,"_179":-5,"_180":206,"_102":207},"051f9682-26ea-11f1-aab9-42dde27851f2","settings.html","019d1c0e-6090-77a1-a9f3-ebce05715156",["D",1774292197432],"\n\n \n JS Practice\n \n \n \n \n \n \n

Settings

\n\n Background Color \n
\n Dark Mode\n
\n Username\n
\n \n \n",[],[202],{"_106":209,"_99":210,"_167":211,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":212,"_103":33,"_174":175,"_176":213,"_178":22,"_179":-5,"_180":214,"_102":215},"051f9b14-26ea-11f1-aab9-42dde27851f2","style.css","019d1c0e-6090-77a1-a9f3-ecfc9179cb2c",["D",1774292197432],":root {\n --text-color: #222222;\n --bg-color: white;\n}\n\n* {\n box-sizing: border-box;\n}\n\nbody {\n background-color: var(--bg-color);\n color: var(--text-color);\n max-width: 600px;\n margin: auto;\n}\n\n.settings {\n text-decoration: none;\n font-size: 3vw;\n position: absolute;\n top: 1vw;\n right: 1vw;\n}",[],[210],"files",[164,183,191,200,208],"counts",{"_220":33,"_221":148,"_222":33,"_223":224,"_227":228},"pulls","branches","forks","envVars",{"_225":33,"_226":33},"count","emptyCount","connections",{"_225":33,"_229":33},"unfilledCount","contents",[232,235,238,241,244],{"_106":165,"_99":166,"_167":168,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":233,"_103":33,"_174":175,"_176":177,"_178":22,"_179":-5,"_102":234},["D",1774292197432],[166],{"_106":184,"_99":185,"_167":119,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":236,"_103":33,"_174":187,"_176":188,"_178":22,"_179":-5,"_102":237},["D",1774292197432],[185],{"_106":192,"_99":193,"_167":194,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":239,"_103":33,"_174":196,"_176":197,"_178":22,"_179":-5,"_102":240},["D",1774292197432],[193],{"_106":201,"_99":202,"_167":203,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":242,"_103":33,"_174":175,"_176":205,"_178":22,"_179":-5,"_102":243},["D",1774292197432],[202],{"_106":209,"_99":210,"_167":211,"_169":-5,"_170":149,"_171":148,"_172":121,"_108":245,"_103":33,"_174":175,"_176":213,"_178":22,"_179":-5,"_102":246},["D",1774292197432],[210],"upstreamProject",{"_106":157,"_99":249,"_114":115,"_116":-5,"_112":113,"_23":250},"cookie-practice",{"_97":98,"_139":140},"upstreamBranch",{"_106":152,"_108":253,"_254":255,"_99":45,"_150":157,"_103":154,"_151":256,"_153":257,"_258":259,"_110":-5,"_161":22,"_112":113,"_160":98,"_16":125,"_159":249},["D",1774277511218],"updatedAt",["D",1774292187735],"fc3864dc-22d3-11f1-87e2-42dde27851f2",114,"lockfileKey","1774328023233-esm.town_v_Collin08_cookie-practice@20-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.compare.$branch",{"_97":98,"_99":100,"_101":45,"_104":266,"_271":33,"_272":33,"_273":274,"_280":22,"_281":270,"_282":283,"_286":-5},{"_106":107,"_99":100,"_108":267,"_110":-5,"_111":22,"_112":113,"_114":115,"_116":-5,"_14":117,"_118":119,"_120":121,"_122":-5,"_123":-5,"_124":33,"_16":125,"_126":-5,"_127":-5,"_128":-5,"_129":130,"_131":130,"_132":133,"_134":133,"_135":133,"_136":130,"_137":130,"_23":268,"_141":269,"_146":270,"_161":22},["D",1774292197432],{"_97":98,"_139":140},{"_97":98,"_143":140,"_14":117,"_144":145},{"_103":148,"_99":45,"_106":149,"_150":107,"_151":152,"_153":154,"_155":113,"_156":157,"_158":125,"_159":100,"_160":98},"ahead","behind","diff",{"_275":276,"_178":277,"_278":279},"added",[],[],"modified",[],"hasChanges","sourceBranch","targetBranch",{"_106":152,"_108":284,"_254":285,"_99":45,"_150":157,"_103":154,"_151":256,"_153":257,"_258":259,"_110":-5,"_161":22,"_112":113,"_160":98,"_16":125,"_159":249},["D",1774277511218],["D",1774292187735],"pull","actionData","errors"]

Collin08

cookie-practice2

Mergecookie-practice2/mainintocookie-practice/main