From: Jack Kinsey Date: Sun, 30 Apr 2017 04:23:38 +0000 (-0400) Subject: Added background color changing X-Git-Url: http://git.jkinsey.net/?a=commitdiff_plain;h=b0fbfd4fba15bb8d893a48806c30727ad4bb61d1;p=jkinsey.net.git Added background color changing --- diff --git a/Makefile b/Makefile index 9422301..5c7b64b 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,4 @@ build: - sed '/id=\"menu\"/s/middle/top/; /id=\"about\"/s/class=\".*\"/class=\"selected\"/; /data-name=\"about\"/s/class=\"\"/class=\"selected\"/' < index.html > about/index.html - sed '/id=\"menu\"/s/middle/top/; /id=\"code\"/s/class=\".*\"/class=\"selected\"/; /data-name=\"code\"/s/class=\"\"/class=\"selected\"/' < index.html > code/index.html - sed '/id=\"menu\"/s/middle/top/; /id=\"writing\"/s/class=\".*\"/class=\"selected\"/; /data-name=\"writing\"/s/class=\"\"/class=\"selected\"/' < index.html > writing/index.html + sed '/id=\"menu\"/s/middle/top/; / about/index.html + sed '/id=\"menu\"/s/middle/top/; / code/index.html + sed '/id=\"menu\"/s/middle/top/; / writing/index.html diff --git a/about/index.html b/about/index.html index 7c28f86..c8aa74e 100644 --- a/about/index.html +++ b/about/index.html @@ -7,16 +7,17 @@ Jack Kinsey - + +
-
- +
+ @@ -49,5 +50,6 @@ +
diff --git a/code/index.html b/code/index.html index 983d672..0fb29bb 100644 --- a/code/index.html +++ b/code/index.html @@ -7,16 +7,17 @@ Jack Kinsey - + +
-
- +
+ @@ -49,5 +50,6 @@ +
diff --git a/index.html b/index.html index 066cf00..71322b4 100644 --- a/index.html +++ b/index.html @@ -7,16 +7,17 @@ Jack Kinsey - + +
-
- +
+ @@ -49,5 +50,6 @@ +
diff --git a/js/script.js b/js/script.js index 6528aa3..e7ab2b6 100644 --- a/js/script.js +++ b/js/script.js @@ -3,6 +3,7 @@ window.addEventListener('load', function() { var home = document.getElementsByClassName("home"); var menu = document.getElementById("menu"); var content = document.getElementById("content"); + var body = document.getElementsByTagName("body")[0]; var menuLoc = parseInt(getComputedStyle(menu).getPropertyValue("top")); function menuOperator(position, token="") { @@ -21,6 +22,10 @@ window.addEventListener('load', function() { var article = document.getElementById(name); article.setAttribute("class", "selected"); } + var color = node.getAttribute("data-color"); + if(color) { + body.setAttribute("class", color); + } window.history.pushState("object or string", "Title", node.href); } diff --git a/res/bluestars.png b/res/bluestars.png new file mode 100644 index 0000000..c91ed65 Binary files /dev/null and b/res/bluestars.png differ diff --git a/res/greenstars.png b/res/greenstars.png new file mode 100644 index 0000000..5c5d7e2 Binary files /dev/null and b/res/greenstars.png differ diff --git a/res/pinkstars.png b/res/pinkstars.png new file mode 100644 index 0000000..eeed9e8 Binary files /dev/null and b/res/pinkstars.png differ diff --git a/res/stars.png b/res/stars.png new file mode 100644 index 0000000..dba8c02 Binary files /dev/null and b/res/stars.png differ diff --git a/res/style.css b/res/style.css index 3742294..5ba1ddf 100644 --- a/res/style.css +++ b/res/style.css @@ -1,4 +1,9 @@ @import url('https://fonts.googleapis.com/css?family=Cutive+Mono|Source+Code+Pro:300'); +/* pink:473a47 + * blue:004350 + * green:0c5b57 + * yellow:4b4432 + */ body { width:100%; @@ -6,9 +11,29 @@ body { overflow-x:hidden; font-family:'Cutive Mono', monospace; color:#FFF1FF; - #background-image:linear-gradient(to right,#00c4f4 0%,#278fba 20%,#278fba 80%,#00c4f4 100%); - #background-color:#278fba; - background:url(http://static.jkinsey.net/img/pinkishstardust.png) #323; + transition:background-color .6s cubic-bezier(0.23, 1, 0.32, 1); +} + +body.pink { + background-color:#161216; +} + +body.blue { + background-color:#001216; +} + +body.green { + background-color:#031514; +} + +body.yellow { + background-color:#191710; +} + +main { + width:100%; + height:100%; + background:url(stars.png); } menu { diff --git a/res/yellowstars.png b/res/yellowstars.png new file mode 100644 index 0000000..d41ba44 Binary files /dev/null and b/res/yellowstars.png differ diff --git a/writing/index.html b/writing/index.html index 8fc7232..8a0a76f 100644 --- a/writing/index.html +++ b/writing/index.html @@ -7,16 +7,17 @@ Jack Kinsey - + +
-
- +
+ @@ -49,5 +50,6 @@ +