commit daefcaf5673c66c898eac03752765eb8701c4ee8 Author: Lazy Hippopotamus Date: Sat Mar 9 15:07:24 2024 -0500 sitix doesn't erase huge amounts of data unless you do something dumb. but I have done dumb things before. so I'm backing this up, rather than losing it. diff --git a/README b/README new file mode 100644 index 0000000..bec3f8a --- /dev/null +++ b/README @@ -0,0 +1,5 @@ +This is the website code for Sitix documentation and stuff. site/ contains the actual Sitix scripts, and output/ contains the site. +Run `sitix site -c production` to build (`sitix site` alone will build the development version, which expects to be hosted at http://localhost:8080). +If you don't *have* sitix, go to the website (at https://swaous.asuscomm.com/sitix) for install instructions. + +This website keeps Sitix minification on at all times with [@on minify]. \ No newline at end of file diff --git a/output/index.html b/output/index.html new file mode 100644 index 0000000..9267dfb --- /dev/null +++ b/output/index.html @@ -0,0 +1,8 @@ + Sitix | Main

About

+ +

Imagine an SSG

that's FAST

that's project agnostic

that Keeps It Simple, Stupid

that Just Makes Sense

that makes no assumptions

Sitix

Sitix is a modern SSG (Static Site Generator) that allows you total control over how your project is assembled, without sacrificing ease. It uses an object/scope model with efficient file includes, conditional branching, looping, and command-line configuration to make stunning websites without the mess.

Template all the things. Any Sitix file can be a template; the [?] opening phrase indicates that (for whatever reason) the file shouldn't be rendered normally, but still may be included in other files - for configuration, templating, or even modular elements!

Sitix by Tyler Clarke

Links

More Links

Information

Site designed by Tyler Clarke and built with Sitix.

\ No newline at end of file diff --git a/output/res/default.html.png b/output/res/default.html.png new file mode 100644 index 0000000..cc2b6fa Binary files /dev/null and b/output/res/default.html.png differ diff --git a/output/res/lato/Lato-Black.ttf b/output/res/lato/Lato-Black.ttf new file mode 100644 index 0000000..6848db0 Binary files /dev/null and b/output/res/lato/Lato-Black.ttf differ diff --git a/output/res/lato/Lato-BlackItalic.ttf b/output/res/lato/Lato-BlackItalic.ttf new file mode 100644 index 0000000..5decf12 Binary files /dev/null and b/output/res/lato/Lato-BlackItalic.ttf differ diff --git a/output/res/lato/Lato-Bold.ttf b/output/res/lato/Lato-Bold.ttf new file mode 100644 index 0000000..7434369 Binary files /dev/null and b/output/res/lato/Lato-Bold.ttf differ diff --git a/output/res/lato/Lato-BoldItalic.ttf b/output/res/lato/Lato-BoldItalic.ttf new file mode 100644 index 0000000..684aacf Binary files /dev/null and b/output/res/lato/Lato-BoldItalic.ttf differ diff --git a/output/res/lato/Lato-Hairline.ttf b/output/res/lato/Lato-Hairline.ttf new file mode 100644 index 0000000..288be29 Binary files /dev/null and b/output/res/lato/Lato-Hairline.ttf differ diff --git a/output/res/lato/Lato-HairlineItalic.ttf b/output/res/lato/Lato-HairlineItalic.ttf new file mode 100644 index 0000000..c2bfd33 Binary files /dev/null and b/output/res/lato/Lato-HairlineItalic.ttf differ diff --git a/output/res/lato/Lato-Italic.ttf b/output/res/lato/Lato-Italic.ttf new file mode 100644 index 0000000..3d3b7a2 Binary files /dev/null and b/output/res/lato/Lato-Italic.ttf differ diff --git a/output/res/lato/Lato-Light.ttf b/output/res/lato/Lato-Light.ttf new file mode 100644 index 0000000..a958067 Binary files /dev/null and b/output/res/lato/Lato-Light.ttf differ diff --git a/output/res/lato/Lato-LightItalic.ttf b/output/res/lato/Lato-LightItalic.ttf new file mode 100644 index 0000000..5e45ad9 Binary files /dev/null and b/output/res/lato/Lato-LightItalic.ttf differ diff --git a/output/res/lato/Lato-Regular.ttf b/output/res/lato/Lato-Regular.ttf new file mode 100644 index 0000000..04ea8ef Binary files /dev/null and b/output/res/lato/Lato-Regular.ttf differ diff --git a/output/res/lato/OFL.txt b/output/res/lato/OFL.txt new file mode 100644 index 0000000..58d1de5 --- /dev/null +++ b/output/res/lato/OFL.txt @@ -0,0 +1,92 @@ +Copyright (c) 2010-2011 by tyPoland Lukasz Dziedzic with Reserved Font Name "Lato". +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +http://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/output/res/lato/lato.css b/output/res/lato/lato.css new file mode 100644 index 0000000..2bd502e --- /dev/null +++ b/output/res/lato/lato.css @@ -0,0 +1 @@ + /* Sitix script for the Lato font-face declarations. My editor shows numerous syntax errors; this is because it does not support Sitix scripting. */ @font-face { font-family: Lato; src: url("http://localhost:8080/res/lato/Lato-Italic.ttf"); font-weight: normal; font-style: italic, oblique; } @font-face { font-family: Lato; src: url("http://localhost:8080/res/lato/Lato-Bold.ttf"); font-weight: bold; font-style: normal; } @font-face { font-family: Lato; src: url("http://localhost:8080/res/lato/Lato-BoldItalic.ttf"); font-weight: bold; font-style: italic, oblique; } @font-face { font-family: Lato; src: url("http://localhost:8080/res/lato/Lato-Regular.ttf"); font-weight: normal; font-style: normal; } \ No newline at end of file diff --git a/output/res/lato/lato.zip b/output/res/lato/lato.zip new file mode 100644 index 0000000..4f1ec90 Binary files /dev/null and b/output/res/lato/lato.zip differ diff --git a/output/res/main.css b/output/res/main.css new file mode 100644 index 0000000..a978679 --- /dev/null +++ b/output/res/main.css @@ -0,0 +1,200 @@ +*, body, html { + margin: 0px; + padding: 0px; + font-family: Lato, Arial, Helvetica, sans-serif; +} + +img { + max-width: 100%; + max-height: 100%; +} + +#nav { + position: sticky; + top: 0px; + box-shadow: 0px 0px 5px black; + padding: 3px; + background-color: white; + z-index: 2; +} + +#nav > div { + padding-top: 0px; + padding-bottom: 0px; + transition: padding 0.5s; + text-align: center; +} + +#nav > a { + top: 0px; + position: absolute; + height: 100%; +} + +#nav:hover > div { + padding-top: 10px; + padding-bottom: 10px; +} + +div.text { + padding-top: 50px; + padding-bottom: 50px; + padding-left: 15vw; + padding-right: 15vw; +} + +#bottom { + box-shadow: 0px 0px 5px black; + padding: 50px; + display: grid; + grid-template-areas: 'top top top' + 'line1 line2 line3'; + margin-top: 50px; +} + +#bottom > div:first-child { + grid-area: top; + text-align: center; +} + +#bottom > div:first-child > a { + display: inline-block; + height: 2em; +} + +#bottom > div:first-child > span { + transform: translateY(-1em); +} + +#bottom > div:first-child > a > img { + height: 100%; +} + +#bottom > div:first-child > * { + margin: 10px; +} + +a { + text-decoration: none; + color: #666666; +} + +a:hover { + color: #999999; +} + +#main { + min-height: 100vh; +} + +.text.scrolly { + transform: translateX(-200px); + opacity: 0%; + transition: transform 0.5s, opacity 0.5s; +} + +.text.scrolly.scrolly-entered { + opacity: 100%; + transform: none; +} + +#toppybit { + display: flex; + flex-direction: row; + padding: 10%; + box-sizing: border-box; +} + +.huge { + font-size: 6em; +} + +span.big { + font-size: 4em; +} + +#imagine { + position: sticky; + top: 50vh; + transform: translateY(-50%); + display: inline-block; +} + +#switchybit > div > span { + display: inline-block; + background-color: #000044; + padding: 10px; + font-family: monospace; + color: white; + position: sticky; + top: 50vh; + transform: translateY(-50%); +} + +#switchybit > div { + height: 100vh; + opacity: 0%; + transition: opacity 0.1s; +} + +#switchybit > div.scrolly-center { + opacity: 100%; +} + +i.highlight { + color: red; + font-size: 3rem; + text-shadow: 0px 0px 2px red, 0px 0px 4px blue; +} + +#actualbottom { + background-color: black; + text-align: center; + color: white; + font-size: 0.7em; + padding: 5px; +} + +h1, h2, h3, h4, h5, h6 { + text-align: right; + padding-right: 10vw; +} + +h1 { + font-size: 6em; +} + +div.toptext { + padding-left: 35vw; + padding-right: 15vw; + font-size: 1.3em; +} + +.textimage { + display: flex; + padding-left: 10vw; + padding-right: 10vw; +} + +.textimage > .textimage-text { + flex: 2; + padding: 100px; + font-size: 1.2em; +} + +.textimage:nth-child(2n + 1) { + flex-direction: row-reverse; +} + +.textimage.scrolly { + justify-content: space-between; + width: 200vw; + transform: translate(-50vw); + overflow: hidden; + transition: width 5s, transform 5s; +} + +.textimage.scrolly.scrolly-entered { + width: auto; + transform: none; +} \ No newline at end of file diff --git a/output/res/scrolly.js b/output/res/scrolly.js new file mode 100644 index 0000000..200d849 --- /dev/null +++ b/output/res/scrolly.js @@ -0,0 +1,52 @@ +/* Scrolly.JS is an extremely simple framework that gives CSS interoperation to scroll events. */ + +var scrollyContainers = document.getElementsByClassName("scrolly-container"); + +function scrolly() { + var scrollyItems = this.getElementsByClassName("scrolly"); + var nearest = undefined; + var nearestVal = Infinity; + for (var i = 0; i < scrollyItems.length; i++) { + var position = scrollyItems[i].getBoundingClientRect(); + var scrollyMargin = 0; + if (scrollyItems[i].hasAttribute("--data-scrollyMargin")) { + scrollyMargin = scrollyItems[i].getAttribute("--data-scrollyMargin"); + } + if (position.top < window.innerHeight - scrollyMargin && position.bottom > scrollyMargin) { + scrollyItems[i].classList.add("scrolly-entered"); + scrollyItems[i].classList.add("scrolly-in"); + scrollyItems[i].classList.remove("scrolly-out"); + } + else { + scrollyItems[i].classList.add("scrolly-out"); + scrollyItems[i].classList.remove("scrolly-in"); + } + var cDisp = Math.abs(window.innerHeight / 2 - (position.top + position.bottom) / 2); + scrollyItems[i].classList.remove("scrolly-center"); + if (cDisp < nearestVal) { + if (nearest) { + nearest.classList.remove("scrolly-center"); + } + nearest = scrollyItems[i]; + scrollyItems[i].classList.add("scrolly-center"); + nearestVal = cDisp; + } + } +} + +for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly = scrolly; + scrollyContainers[i].scrolly(); +} + +window.addEventListener("scroll", () => { + for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly() + } +}); + +window.addEventListener("wheel", () => { + for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly() + } +}); \ No newline at end of file diff --git a/output/res/sitix-large.png b/output/res/sitix-large.png new file mode 100644 index 0000000..3e724b6 Binary files /dev/null and b/output/res/sitix-large.png differ diff --git a/output/res/sitix.svg b/output/res/sitix.svg new file mode 100644 index 0000000..c397627 --- /dev/null +++ b/output/res/sitix.svg @@ -0,0 +1,85 @@ + + + + diff --git a/site/config.stx b/site/config.stx new file mode 100644 index 0000000..49da82b --- /dev/null +++ b/site/config.stx @@ -0,0 +1,5 @@ +[?][@on minify] +[=baseurl http://localhost:8080] +[i config production] + [=baseurl https://swaous.asuscomm.com/sitix] +[/] \ No newline at end of file diff --git a/site/index.html b/site/index.html new file mode 100644 index 0000000..32e456a --- /dev/null +++ b/site/index.html @@ -0,0 +1,37 @@ +[!][@on minify] + +[=title Main] +[=content-] +[#modules/textimage.stx] +

Imagine an SSG

+ [=scrollyads-] + [=+ that's FAST] + [=+ that's project agnostic] + [=+ that Keeps It Simple, Stupid] + [=+ that Just Makes Sense] + [=+ that makes no assumptions] + [/] +

+ [f scrollyads ad] +

+ [^ad] +

+ [/] +

Sitix

+ Sitix is a modern SSG (Static Site Generator) that allows you total control over how your project is assembled, without sacrificing ease. It uses an object/scope + model with efficient file includes, conditional branching, looping, and command-line configuration to make stunning websites without the mess. +

+[=textimage_text-] + Template all the things. Any Sitix file can be a template; the \[?] opening phrase indicates that (for whatever reason) the file shouldn't be rendered normally, + but still may be included in other files - for configuration, templating, or even modular elements! +[/] +[=textimage_source-][^baseurl]/res/default.html.png[/] +[^textimage] +[/] +[#templates/default.html] \ No newline at end of file diff --git a/site/modules/textimage.stx b/site/modules/textimage.stx new file mode 100644 index 0000000..2435131 --- /dev/null +++ b/site/modules/textimage.stx @@ -0,0 +1,8 @@ +[?] + +[=textimage-] +

[^textimage_text]

+[/] \ No newline at end of file diff --git a/site/pages/about.html b/site/pages/about.html new file mode 100644 index 0000000..a93020d --- /dev/null +++ b/site/pages/about.html @@ -0,0 +1,7 @@ +[!] +[=isLinked] +[=title About] +[=content-] +About +[/] +[#templates/default.html] \ No newline at end of file diff --git a/site/res/default.html.png b/site/res/default.html.png new file mode 100644 index 0000000..cc2b6fa Binary files /dev/null and b/site/res/default.html.png differ diff --git a/site/res/lato/Lato-Black.ttf b/site/res/lato/Lato-Black.ttf new file mode 100644 index 0000000..6848db0 Binary files /dev/null and b/site/res/lato/Lato-Black.ttf differ diff --git a/site/res/lato/Lato-BlackItalic.ttf b/site/res/lato/Lato-BlackItalic.ttf new file mode 100644 index 0000000..5decf12 Binary files /dev/null and b/site/res/lato/Lato-BlackItalic.ttf differ diff --git a/site/res/lato/Lato-Bold.ttf b/site/res/lato/Lato-Bold.ttf new file mode 100644 index 0000000..7434369 Binary files /dev/null and b/site/res/lato/Lato-Bold.ttf differ diff --git a/site/res/lato/Lato-BoldItalic.ttf b/site/res/lato/Lato-BoldItalic.ttf new file mode 100644 index 0000000..684aacf Binary files /dev/null and b/site/res/lato/Lato-BoldItalic.ttf differ diff --git a/site/res/lato/Lato-Hairline.ttf b/site/res/lato/Lato-Hairline.ttf new file mode 100644 index 0000000..288be29 Binary files /dev/null and b/site/res/lato/Lato-Hairline.ttf differ diff --git a/site/res/lato/Lato-HairlineItalic.ttf b/site/res/lato/Lato-HairlineItalic.ttf new file mode 100644 index 0000000..c2bfd33 Binary files /dev/null and b/site/res/lato/Lato-HairlineItalic.ttf differ diff --git a/site/res/lato/Lato-Italic.ttf b/site/res/lato/Lato-Italic.ttf new file mode 100644 index 0000000..3d3b7a2 Binary files /dev/null and b/site/res/lato/Lato-Italic.ttf differ diff --git a/site/res/lato/Lato-Light.ttf b/site/res/lato/Lato-Light.ttf new file mode 100644 index 0000000..a958067 Binary files /dev/null and b/site/res/lato/Lato-Light.ttf differ diff --git a/site/res/lato/Lato-LightItalic.ttf b/site/res/lato/Lato-LightItalic.ttf new file mode 100644 index 0000000..5e45ad9 Binary files /dev/null and b/site/res/lato/Lato-LightItalic.ttf differ diff --git a/site/res/lato/Lato-Regular.ttf b/site/res/lato/Lato-Regular.ttf new file mode 100644 index 0000000..04ea8ef Binary files /dev/null and b/site/res/lato/Lato-Regular.ttf differ diff --git a/site/res/lato/OFL.txt b/site/res/lato/OFL.txt new file mode 100644 index 0000000..58d1de5 --- /dev/null +++ b/site/res/lato/OFL.txt @@ -0,0 +1,92 @@ +Copyright (c) 2010-2011 by tyPoland Lukasz Dziedzic with Reserved Font Name "Lato". +This Font Software is licensed under the SIL Open Font License, Version 1.1. +This license is copied below, and is also available with a FAQ at: +http://scripts.sil.org/OFL + + +----------------------------------------------------------- +SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 +----------------------------------------------------------- + +PREAMBLE +The goals of the Open Font License (OFL) are to stimulate worldwide +development of collaborative font projects, to support the font creation +efforts of academic and linguistic communities, and to provide a free and +open framework in which fonts may be shared and improved in partnership +with others. + +The OFL allows the licensed fonts to be used, studied, modified and +redistributed freely as long as they are not sold by themselves. The +fonts, including any derivative works, can be bundled, embedded, +redistributed and/or sold with any software provided that any reserved +names are not used by derivative works. The fonts and derivatives, +however, cannot be released under any other type of license. The +requirement for fonts to remain under this license does not apply +to any document created using the fonts or their derivatives. + +DEFINITIONS +"Font Software" refers to the set of files released by the Copyright +Holder(s) under this license and clearly marked as such. This may +include source files, build scripts and documentation. + +"Reserved Font Name" refers to any names specified as such after the +copyright statement(s). + +"Original Version" refers to the collection of Font Software components as +distributed by the Copyright Holder(s). + +"Modified Version" refers to any derivative made by adding to, deleting, +or substituting -- in part or in whole -- any of the components of the +Original Version, by changing formats or by porting the Font Software to a +new environment. + +"Author" refers to any designer, engineer, programmer, technical +writer or other person who contributed to the Font Software. + +PERMISSION & CONDITIONS +Permission is hereby granted, free of charge, to any person obtaining +a copy of the Font Software, to use, study, copy, merge, embed, modify, +redistribute, and sell modified and unmodified copies of the Font +Software, subject to the following conditions: + +1) Neither the Font Software nor any of its individual components, +in Original or Modified Versions, may be sold by itself. + +2) Original or Modified Versions of the Font Software may be bundled, +redistributed and/or sold with any software, provided that each copy +contains the above copyright notice and this license. These can be +included either as stand-alone text files, human-readable headers or +in the appropriate machine-readable metadata fields within text or +binary files as long as those fields can be easily viewed by the user. + +3) No Modified Version of the Font Software may use the Reserved Font +Name(s) unless explicit written permission is granted by the corresponding +Copyright Holder. This restriction only applies to the primary font name as +presented to the users. + +4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font +Software shall not be used to promote, endorse or advertise any +Modified Version, except to acknowledge the contribution(s) of the +Copyright Holder(s) and the Author(s) or with their explicit written +permission. + +5) The Font Software, modified or unmodified, in part or in whole, +must be distributed entirely under this license, and must not be +distributed under any other license. The requirement for fonts to +remain under this license does not apply to any document created +using the Font Software. + +TERMINATION +This license becomes null and void if any of the above conditions are +not met. + +DISCLAIMER +THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, +EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF +MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT +OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE +COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, +INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL +DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING +FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM +OTHER DEALINGS IN THE FONT SOFTWARE. diff --git a/site/res/lato/lato.css b/site/res/lato/lato.css new file mode 100644 index 0000000..1d1b312 --- /dev/null +++ b/site/res/lato/lato.css @@ -0,0 +1,30 @@ +[!][@on minify] +/* Sitix script for the Lato font-face declarations. My editor shows numerous syntax errors; this is because it does not support Sitix scripting. */ +[#config.stx] +@font-face { + font-family: Lato; + src: url("[^baseurl]/res/lato/Lato-Italic.ttf"); + font-weight: normal; + font-style: italic, oblique; +} + +@font-face { + font-family: Lato; + src: url("[^baseurl]/res/lato/Lato-Bold.ttf"); + font-weight: bold; + font-style: normal; +} + +@font-face { + font-family: Lato; + src: url("[^baseurl]/res/lato/Lato-BoldItalic.ttf"); + font-weight: bold; + font-style: italic, oblique; +} + +@font-face { + font-family: Lato; + src: url("[^baseurl]/res/lato/Lato-Regular.ttf"); + font-weight: normal; + font-style: normal; +} \ No newline at end of file diff --git a/site/res/lato/lato.zip b/site/res/lato/lato.zip new file mode 100644 index 0000000..4f1ec90 Binary files /dev/null and b/site/res/lato/lato.zip differ diff --git a/site/res/main.css b/site/res/main.css new file mode 100644 index 0000000..a978679 --- /dev/null +++ b/site/res/main.css @@ -0,0 +1,200 @@ +*, body, html { + margin: 0px; + padding: 0px; + font-family: Lato, Arial, Helvetica, sans-serif; +} + +img { + max-width: 100%; + max-height: 100%; +} + +#nav { + position: sticky; + top: 0px; + box-shadow: 0px 0px 5px black; + padding: 3px; + background-color: white; + z-index: 2; +} + +#nav > div { + padding-top: 0px; + padding-bottom: 0px; + transition: padding 0.5s; + text-align: center; +} + +#nav > a { + top: 0px; + position: absolute; + height: 100%; +} + +#nav:hover > div { + padding-top: 10px; + padding-bottom: 10px; +} + +div.text { + padding-top: 50px; + padding-bottom: 50px; + padding-left: 15vw; + padding-right: 15vw; +} + +#bottom { + box-shadow: 0px 0px 5px black; + padding: 50px; + display: grid; + grid-template-areas: 'top top top' + 'line1 line2 line3'; + margin-top: 50px; +} + +#bottom > div:first-child { + grid-area: top; + text-align: center; +} + +#bottom > div:first-child > a { + display: inline-block; + height: 2em; +} + +#bottom > div:first-child > span { + transform: translateY(-1em); +} + +#bottom > div:first-child > a > img { + height: 100%; +} + +#bottom > div:first-child > * { + margin: 10px; +} + +a { + text-decoration: none; + color: #666666; +} + +a:hover { + color: #999999; +} + +#main { + min-height: 100vh; +} + +.text.scrolly { + transform: translateX(-200px); + opacity: 0%; + transition: transform 0.5s, opacity 0.5s; +} + +.text.scrolly.scrolly-entered { + opacity: 100%; + transform: none; +} + +#toppybit { + display: flex; + flex-direction: row; + padding: 10%; + box-sizing: border-box; +} + +.huge { + font-size: 6em; +} + +span.big { + font-size: 4em; +} + +#imagine { + position: sticky; + top: 50vh; + transform: translateY(-50%); + display: inline-block; +} + +#switchybit > div > span { + display: inline-block; + background-color: #000044; + padding: 10px; + font-family: monospace; + color: white; + position: sticky; + top: 50vh; + transform: translateY(-50%); +} + +#switchybit > div { + height: 100vh; + opacity: 0%; + transition: opacity 0.1s; +} + +#switchybit > div.scrolly-center { + opacity: 100%; +} + +i.highlight { + color: red; + font-size: 3rem; + text-shadow: 0px 0px 2px red, 0px 0px 4px blue; +} + +#actualbottom { + background-color: black; + text-align: center; + color: white; + font-size: 0.7em; + padding: 5px; +} + +h1, h2, h3, h4, h5, h6 { + text-align: right; + padding-right: 10vw; +} + +h1 { + font-size: 6em; +} + +div.toptext { + padding-left: 35vw; + padding-right: 15vw; + font-size: 1.3em; +} + +.textimage { + display: flex; + padding-left: 10vw; + padding-right: 10vw; +} + +.textimage > .textimage-text { + flex: 2; + padding: 100px; + font-size: 1.2em; +} + +.textimage:nth-child(2n + 1) { + flex-direction: row-reverse; +} + +.textimage.scrolly { + justify-content: space-between; + width: 200vw; + transform: translate(-50vw); + overflow: hidden; + transition: width 5s, transform 5s; +} + +.textimage.scrolly.scrolly-entered { + width: auto; + transform: none; +} \ No newline at end of file diff --git a/site/res/main.js b/site/res/main.js new file mode 100644 index 0000000..e69de29 diff --git a/site/res/scrolly.js b/site/res/scrolly.js new file mode 100644 index 0000000..200d849 --- /dev/null +++ b/site/res/scrolly.js @@ -0,0 +1,52 @@ +/* Scrolly.JS is an extremely simple framework that gives CSS interoperation to scroll events. */ + +var scrollyContainers = document.getElementsByClassName("scrolly-container"); + +function scrolly() { + var scrollyItems = this.getElementsByClassName("scrolly"); + var nearest = undefined; + var nearestVal = Infinity; + for (var i = 0; i < scrollyItems.length; i++) { + var position = scrollyItems[i].getBoundingClientRect(); + var scrollyMargin = 0; + if (scrollyItems[i].hasAttribute("--data-scrollyMargin")) { + scrollyMargin = scrollyItems[i].getAttribute("--data-scrollyMargin"); + } + if (position.top < window.innerHeight - scrollyMargin && position.bottom > scrollyMargin) { + scrollyItems[i].classList.add("scrolly-entered"); + scrollyItems[i].classList.add("scrolly-in"); + scrollyItems[i].classList.remove("scrolly-out"); + } + else { + scrollyItems[i].classList.add("scrolly-out"); + scrollyItems[i].classList.remove("scrolly-in"); + } + var cDisp = Math.abs(window.innerHeight / 2 - (position.top + position.bottom) / 2); + scrollyItems[i].classList.remove("scrolly-center"); + if (cDisp < nearestVal) { + if (nearest) { + nearest.classList.remove("scrolly-center"); + } + nearest = scrollyItems[i]; + scrollyItems[i].classList.add("scrolly-center"); + nearestVal = cDisp; + } + } +} + +for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly = scrolly; + scrollyContainers[i].scrolly(); +} + +window.addEventListener("scroll", () => { + for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly() + } +}); + +window.addEventListener("wheel", () => { + for (var i = 0; i < scrollyContainers.length; i++) { + scrollyContainers[i].scrolly() + } +}); \ No newline at end of file diff --git a/site/res/sitix-large.png b/site/res/sitix-large.png new file mode 100644 index 0000000..3e724b6 Binary files /dev/null and b/site/res/sitix-large.png differ diff --git a/site/res/sitix.svg b/site/res/sitix.svg new file mode 100644 index 0000000..c397627 --- /dev/null +++ b/site/res/sitix.svg @@ -0,0 +1,85 @@ + + + + diff --git a/site/templates/default.html b/site/templates/default.html new file mode 100644 index 0000000..35a5f19 --- /dev/null +++ b/site/templates/default.html @@ -0,0 +1,49 @@ +[?][@on minify] +[#config.stx] + + + + + + + + Sitix | + [i exists title] + [^title] + [e] + Untitled Page + [/] + + + +

+ [f pages i] + [^i.title] + [/] +

+ [^content] +

+ Sitix by Tyler Clarke +

+ Links +

+ More Links +

+ Information +

Site designed by Tyler Clarke and built with Sitix.

+ + + + \ No newline at end of file