commit f139cfa350e9731f9d6ab728201e83efe80eabe0 Author: Manos Pitsidianakis Date: Thu Jul 30 11:25:40 2020 +0300 Initial commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..fc4b5c4 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +/target +**/*.rs.bk +_site/ diff --git a/Cargo.lock b/Cargo.lock new file mode 100644 index 0000000..732d75a --- /dev/null +++ b/Cargo.lock @@ -0,0 +1,564 @@ +# This file is automatically @generated by Cargo. +# It is not intended for manual editing. +[[package]] +name = "aho-corasick" +version = "0.7.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "memchr 2.3.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "autocfg" +version = "1.0.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "block-buffer" +version = "0.7.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "block-padding 0.1.5 (registry+https://github.com/rust-lang/crates.io-index)", + "byte-tools 0.3.1 (registry+https://github.com/rust-lang/crates.io-index)", + "byteorder 1.3.4 (registry+https://github.com/rust-lang/crates.io-index)", + "generic-array 0.12.3 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "block-padding" +version = "0.1.5" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "byte-tools 0.3.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "byte-tools" +version = "0.3.1" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "byteorder" +version = "1.3.4" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "cfg-if" +version = "0.1.10" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "chrono" +version = "0.4.11" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "num-integer 0.1.42 (registry+https://github.com/rust-lang/crates.io-index)", + "num-traits 0.2.11 (registry+https://github.com/rust-lang/crates.io-index)", + "serde 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)", + "time 0.1.42 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "darling" +version = "0.10.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "darling_core 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)", + "darling_macro 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "darling_core" +version = "0.10.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "fnv 1.0.7 (registry+https://github.com/rust-lang/crates.io-index)", + "ident_case 1.0.1 (registry+https://github.com/rust-lang/crates.io-index)", + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "strsim 0.9.3 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "darling_macro" +version = "0.10.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "darling_core 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "derive_builder" +version = "0.9.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "darling 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)", + "derive_builder_core 0.9.0 (registry+https://github.com/rust-lang/crates.io-index)", + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "derive_builder_core" +version = "0.9.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "darling 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)", + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "digest" +version = "0.8.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "generic-array 0.12.3 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "encoding_rs" +version = "0.8.23" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "cfg-if 0.1.10 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "fake-simd" +version = "0.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "fnv" +version = "1.0.7" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "generic-array" +version = "0.12.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "typenum 1.11.2 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "handlebars" +version = "3.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "log 0.4.8 (registry+https://github.com/rust-lang/crates.io-index)", + "pest 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "pest_derive 2.1.0 (registry+https://github.com/rust-lang/crates.io-index)", + "quick-error 1.2.3 (registry+https://github.com/rust-lang/crates.io-index)", + "serde 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)", + "serde_json 1.0.47 (registry+https://github.com/rust-lang/crates.io-index)", + "walkdir 2.3.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "ident_case" +version = "1.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "itoa" +version = "0.4.5" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "lazy_static" +version = "1.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "libc" +version = "0.2.67" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "libssg" +version = "0.1.1" +dependencies = [ + "chrono 0.4.11 (registry+https://github.com/rust-lang/crates.io-index)", + "handlebars 3.0.1 (registry+https://github.com/rust-lang/crates.io-index)", + "regex 1.3.4 (registry+https://github.com/rust-lang/crates.io-index)", + "serde 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)", + "serde_json 1.0.47 (registry+https://github.com/rust-lang/crates.io-index)", + "uuid 0.8.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "libssg-site" +version = "0.1.0" +dependencies = [ + "libssg 0.1.1", + "linkify 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)", + "rss 1.9.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "linkify" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "memchr 2.3.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "log" +version = "0.4.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "cfg-if 0.1.10 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "maplit" +version = "1.0.2" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "md5" +version = "0.6.1" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "memchr" +version = "2.3.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "num-integer" +version = "0.1.42" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "autocfg 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)", + "num-traits 0.2.11 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "num-traits" +version = "0.2.11" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "autocfg 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "opaque-debug" +version = "0.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "pest" +version = "2.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "ucd-trie 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "pest_derive" +version = "2.1.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "pest 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "pest_generator 2.1.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "pest_generator" +version = "2.1.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "pest 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "pest_meta 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "pest_meta" +version = "2.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "maplit 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "pest 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "sha-1 0.8.2 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "proc-macro2" +version = "1.0.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "unicode-xid 0.2.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "quick-error" +version = "1.2.3" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "quick-xml" +version = "0.17.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "encoding_rs 0.8.23 (registry+https://github.com/rust-lang/crates.io-index)", + "memchr 2.3.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "quote" +version = "1.0.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "redox_syscall" +version = "0.1.56" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "regex" +version = "1.3.4" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "aho-corasick 0.7.8 (registry+https://github.com/rust-lang/crates.io-index)", + "memchr 2.3.0 (registry+https://github.com/rust-lang/crates.io-index)", + "regex-syntax 0.6.14 (registry+https://github.com/rust-lang/crates.io-index)", + "thread_local 1.0.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "regex-syntax" +version = "0.6.14" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "rss" +version = "1.9.0" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "derive_builder 0.9.0 (registry+https://github.com/rust-lang/crates.io-index)", + "quick-xml 0.17.2 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "ryu" +version = "1.0.2" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "same-file" +version = "1.0.6" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "winapi-util 0.1.3 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "serde" +version = "1.0.104" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "serde_derive 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "serde_derive" +version = "1.0.104" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "serde_json" +version = "1.0.47" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "itoa 0.4.5 (registry+https://github.com/rust-lang/crates.io-index)", + "ryu 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "serde 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "sha-1" +version = "0.8.2" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "block-buffer 0.7.3 (registry+https://github.com/rust-lang/crates.io-index)", + "digest 0.8.1 (registry+https://github.com/rust-lang/crates.io-index)", + "fake-simd 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)", + "opaque-debug 0.2.3 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "strsim" +version = "0.9.3" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "syn" +version = "1.0.14" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)", + "quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)", + "unicode-xid 0.2.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "thread_local" +version = "1.0.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "lazy_static 1.4.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "time" +version = "0.1.42" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "libc 0.2.67 (registry+https://github.com/rust-lang/crates.io-index)", + "redox_syscall 0.1.56 (registry+https://github.com/rust-lang/crates.io-index)", + "winapi 0.3.8 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "typenum" +version = "1.11.2" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "ucd-trie" +version = "0.1.2" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "unicode-xid" +version = "0.2.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "uuid" +version = "0.8.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "md5 0.6.1 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "walkdir" +version = "2.3.1" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "same-file 1.0.6 (registry+https://github.com/rust-lang/crates.io-index)", + "winapi 0.3.8 (registry+https://github.com/rust-lang/crates.io-index)", + "winapi-util 0.1.3 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "winapi" +version = "0.3.8" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "winapi-i686-pc-windows-gnu 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)", + "winapi-x86_64-pc-windows-gnu 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "winapi-i686-pc-windows-gnu" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[[package]] +name = "winapi-util" +version = "0.1.3" +source = "registry+https://github.com/rust-lang/crates.io-index" +dependencies = [ + "winapi 0.3.8 (registry+https://github.com/rust-lang/crates.io-index)", +] + +[[package]] +name = "winapi-x86_64-pc-windows-gnu" +version = "0.4.0" +source = "registry+https://github.com/rust-lang/crates.io-index" + +[metadata] +"checksum aho-corasick 0.7.8 (registry+https://github.com/rust-lang/crates.io-index)" = "743ad5a418686aad3b87fd14c43badd828cf26e214a00f92a384291cf22e1811" +"checksum autocfg 1.0.0 (registry+https://github.com/rust-lang/crates.io-index)" = "f8aac770f1885fd7e387acedd76065302551364496e46b3dd00860b2f8359b9d" +"checksum block-buffer 0.7.3 (registry+https://github.com/rust-lang/crates.io-index)" = "c0940dc441f31689269e10ac70eb1002a3a1d3ad1390e030043662eb7fe4688b" +"checksum block-padding 0.1.5 (registry+https://github.com/rust-lang/crates.io-index)" = "fa79dedbb091f449f1f39e53edf88d5dbe95f895dae6135a8d7b881fb5af73f5" +"checksum byte-tools 0.3.1 (registry+https://github.com/rust-lang/crates.io-index)" = "e3b5ca7a04898ad4bcd41c90c5285445ff5b791899bb1b0abdd2a2aa791211d7" +"checksum byteorder 1.3.4 (registry+https://github.com/rust-lang/crates.io-index)" = "08c48aae112d48ed9f069b33538ea9e3e90aa263cfa3d1c24309612b1f7472de" +"checksum cfg-if 0.1.10 (registry+https://github.com/rust-lang/crates.io-index)" = "4785bdd1c96b2a846b2bd7cc02e86b6b3dbf14e7e53446c4f54c92a361040822" +"checksum chrono 0.4.11 (registry+https://github.com/rust-lang/crates.io-index)" = "80094f509cf8b5ae86a4966a39b3ff66cd7e2a3e594accec3743ff3fabeab5b2" +"checksum darling 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)" = "0d706e75d87e35569db781a9b5e2416cff1236a47ed380831f959382ccd5f858" +"checksum darling_core 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)" = "f0c960ae2da4de88a91b2d920c2a7233b400bc33cb28453a2987822d8392519b" +"checksum darling_macro 0.10.2 (registry+https://github.com/rust-lang/crates.io-index)" = "d9b5a2f4ac4969822c62224815d069952656cadc7084fdca9751e6d959189b72" +"checksum derive_builder 0.9.0 (registry+https://github.com/rust-lang/crates.io-index)" = "a2658621297f2cf68762a6f7dc0bb7e1ff2cfd6583daef8ee0fed6f7ec468ec0" +"checksum derive_builder_core 0.9.0 (registry+https://github.com/rust-lang/crates.io-index)" = "2791ea3e372c8495c0bc2033991d76b512cd799d07491fbd6890124db9458bef" +"checksum digest 0.8.1 (registry+https://github.com/rust-lang/crates.io-index)" = "f3d0c8c8752312f9713efd397ff63acb9f85585afbf179282e720e7704954dd5" +"checksum encoding_rs 0.8.23 (registry+https://github.com/rust-lang/crates.io-index)" = "e8ac63f94732332f44fe654443c46f6375d1939684c17b0afb6cb56b0456e171" +"checksum fake-simd 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)" = "e88a8acf291dafb59c2d96e8f59828f3838bb1a70398823ade51a84de6a6deed" +"checksum fnv 1.0.7 (registry+https://github.com/rust-lang/crates.io-index)" = "3f9eec918d3f24069decb9af1554cad7c880e2da24a9afd88aca000531ab82c1" +"checksum generic-array 0.12.3 (registry+https://github.com/rust-lang/crates.io-index)" = "c68f0274ae0e023facc3c97b2e00f076be70e254bc851d972503b328db79b2ec" +"checksum handlebars 3.0.1 (registry+https://github.com/rust-lang/crates.io-index)" = "ba758d094d31274eb49d15da6f326b96bf3185239a6359bf684f3d5321148900" +"checksum ident_case 1.0.1 (registry+https://github.com/rust-lang/crates.io-index)" = "b9e0384b61958566e926dc50660321d12159025e767c18e043daf26b70104c39" +"checksum itoa 0.4.5 (registry+https://github.com/rust-lang/crates.io-index)" = "b8b7a7c0c47db5545ed3fef7468ee7bb5b74691498139e4b3f6a20685dc6dd8e" +"checksum lazy_static 1.4.0 (registry+https://github.com/rust-lang/crates.io-index)" = "e2abad23fbc42b3700f2f279844dc832adb2b2eb069b2df918f455c4e18cc646" +"checksum libc 0.2.67 (registry+https://github.com/rust-lang/crates.io-index)" = "eb147597cdf94ed43ab7a9038716637d2d1bf2bc571da995d0028dec06bd3018" +"checksum linkify 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)" = "03951527dd24d2c59f407502e7d88e0948ef06fac23335b556a4c2bc03c22096" +"checksum log 0.4.8 (registry+https://github.com/rust-lang/crates.io-index)" = "14b6052be84e6b71ab17edffc2eeabf5c2c3ae1fdb464aae35ac50c67a44e1f7" +"checksum maplit 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)" = "3e2e65a1a2e43cfcb47a895c4c8b10d1f4a61097f9f254f183aee60cad9c651d" +"checksum md5 0.6.1 (registry+https://github.com/rust-lang/crates.io-index)" = "7e6bcd6433cff03a4bfc3d9834d504467db1f1cf6d0ea765d37d330249ed629d" +"checksum memchr 2.3.0 (registry+https://github.com/rust-lang/crates.io-index)" = "3197e20c7edb283f87c071ddfc7a2cca8f8e0b888c242959846a6fce03c72223" +"checksum num-integer 0.1.42 (registry+https://github.com/rust-lang/crates.io-index)" = "3f6ea62e9d81a77cd3ee9a2a5b9b609447857f3d358704331e4ef39eb247fcba" +"checksum num-traits 0.2.11 (registry+https://github.com/rust-lang/crates.io-index)" = "c62be47e61d1842b9170f0fdeec8eba98e60e90e5446449a0545e5152acd7096" +"checksum opaque-debug 0.2.3 (registry+https://github.com/rust-lang/crates.io-index)" = "2839e79665f131bdb5782e51f2c6c9599c133c6098982a54c794358bf432529c" +"checksum pest 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)" = "7e4fb201c5c22a55d8b24fef95f78be52738e5e1361129be1b5e862ecdb6894a" +"checksum pest_derive 2.1.0 (registry+https://github.com/rust-lang/crates.io-index)" = "833d1ae558dc601e9a60366421196a8d94bc0ac980476d0b67e1d0988d72b2d0" +"checksum pest_generator 2.1.1 (registry+https://github.com/rust-lang/crates.io-index)" = "7b9fcf299b5712d06ee128a556c94709aaa04512c4dffb8ead07c5c998447fc0" +"checksum pest_meta 2.1.2 (registry+https://github.com/rust-lang/crates.io-index)" = "df43fd99896fd72c485fe47542c7b500e4ac1e8700bf995544d1317a60ded547" +"checksum proc-macro2 1.0.8 (registry+https://github.com/rust-lang/crates.io-index)" = "3acb317c6ff86a4e579dfa00fc5e6cca91ecbb4e7eb2df0468805b674eb88548" +"checksum quick-error 1.2.3 (registry+https://github.com/rust-lang/crates.io-index)" = "a1d01941d82fa2ab50be1e79e6714289dd7cde78eba4c074bc5a4374f650dfe0" +"checksum quick-xml 0.17.2 (registry+https://github.com/rust-lang/crates.io-index)" = "fe1e430bdcf30c9fdc25053b9c459bb1a4672af4617b6c783d7d91dc17c6bbb0" +"checksum quote 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)" = "053a8c8bcc71fcce321828dc897a98ab9760bef03a4fc36693c231e5b3216cfe" +"checksum redox_syscall 0.1.56 (registry+https://github.com/rust-lang/crates.io-index)" = "2439c63f3f6139d1b57529d16bc3b8bb855230c8efcc5d3a896c8bea7c3b1e84" +"checksum regex 1.3.4 (registry+https://github.com/rust-lang/crates.io-index)" = "322cf97724bea3ee221b78fe25ac9c46114ebb51747ad5babd51a2fc6a8235a8" +"checksum regex-syntax 0.6.14 (registry+https://github.com/rust-lang/crates.io-index)" = "b28dfe3fe9badec5dbf0a79a9cccad2cfc2ab5484bdb3e44cbd1ae8b3ba2be06" +"checksum rss 1.9.0 (registry+https://github.com/rust-lang/crates.io-index)" = "99979205510c60f80a119dedbabd0b8426517384edf205322f8bcd51796bcef9" +"checksum ryu 1.0.2 (registry+https://github.com/rust-lang/crates.io-index)" = "bfa8506c1de11c9c4e4c38863ccbe02a305c8188e85a05a784c9e11e1c3910c8" +"checksum same-file 1.0.6 (registry+https://github.com/rust-lang/crates.io-index)" = "93fc1dc3aaa9bfed95e02e6eadabb4baf7e3078b0bd1b4d7b6b0b68378900502" +"checksum serde 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)" = "414115f25f818d7dfccec8ee535d76949ae78584fc4f79a6f45a904bf8ab4449" +"checksum serde_derive 1.0.104 (registry+https://github.com/rust-lang/crates.io-index)" = "128f9e303a5a29922045a830221b8f78ec74a5f544944f3d5984f8ec3895ef64" +"checksum serde_json 1.0.47 (registry+https://github.com/rust-lang/crates.io-index)" = "15913895b61e0be854afd32fd4163fcd2a3df34142cf2cb961b310ce694cbf90" +"checksum sha-1 0.8.2 (registry+https://github.com/rust-lang/crates.io-index)" = "f7d94d0bede923b3cea61f3f1ff57ff8cdfd77b400fb8f9998949e0cf04163df" +"checksum strsim 0.9.3 (registry+https://github.com/rust-lang/crates.io-index)" = "6446ced80d6c486436db5c078dde11a9f73d42b57fb273121e160b84f63d894c" +"checksum syn 1.0.14 (registry+https://github.com/rust-lang/crates.io-index)" = "af6f3550d8dff9ef7dc34d384ac6f107e5d31c8f57d9f28e0081503f547ac8f5" +"checksum thread_local 1.0.1 (registry+https://github.com/rust-lang/crates.io-index)" = "d40c6d1b69745a6ec6fb1ca717914848da4b44ae29d9b3080cbee91d72a69b14" +"checksum time 0.1.42 (registry+https://github.com/rust-lang/crates.io-index)" = "db8dcfca086c1143c9270ac42a2bbd8a7ee477b78ac8e45b19abfb0cbede4b6f" +"checksum typenum 1.11.2 (registry+https://github.com/rust-lang/crates.io-index)" = "6d2783fe2d6b8c1101136184eb41be8b1ad379e4657050b8aaff0c79ee7575f9" +"checksum ucd-trie 0.1.2 (registry+https://github.com/rust-lang/crates.io-index)" = "8f00ed7be0c1ff1e24f46c3d2af4859f7e863672ba3a6e92e7cff702bf9f06c2" +"checksum unicode-xid 0.2.0 (registry+https://github.com/rust-lang/crates.io-index)" = "826e7639553986605ec5979c7dd957c7895e93eabed50ab2ffa7f6128a75097c" +"checksum uuid 0.8.1 (registry+https://github.com/rust-lang/crates.io-index)" = "9fde2f6a4bea1d6e007c4ad38c6839fa71cbb63b6dbf5b595aa38dc9b1093c11" +"checksum walkdir 2.3.1 (registry+https://github.com/rust-lang/crates.io-index)" = "777182bc735b6424e1a57516d35ed72cb8019d85c8c9bf536dccb3445c1a2f7d" +"checksum winapi 0.3.8 (registry+https://github.com/rust-lang/crates.io-index)" = "8093091eeb260906a183e6ae1abdba2ef5ef2257a21801128899c3fc699229c6" +"checksum winapi-i686-pc-windows-gnu 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)" = "ac3b87c63620426dd9b991e5ce0329eff545bccbbb34f3be09ff6fb6ab51b7b6" +"checksum winapi-util 0.1.3 (registry+https://github.com/rust-lang/crates.io-index)" = "4ccfbf554c6ad11084fb7517daca16cfdcaccbdadba4fc336f032a8b12c2ad80" +"checksum winapi-x86_64-pc-windows-gnu 0.4.0 (registry+https://github.com/rust-lang/crates.io-index)" = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f" diff --git a/Cargo.toml b/Cargo.toml new file mode 100644 index 0000000..83e26e0 --- /dev/null +++ b/Cargo.toml @@ -0,0 +1,12 @@ +[package] +name = "libssg-site" +version = "0.1.0" +authors = ["Manos Pitsidianakis "] +edition = "2018" + +# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html + +[dependencies] +linkify = "0.4.0" +rss = "1.9.0" +libssg = { path = "../../libssg/libssg" } diff --git a/README.md b/README.md new file mode 100644 index 0000000..2f07bb4 --- /dev/null +++ b/README.md @@ -0,0 +1,15 @@ +## Build +```sh +FORCE=1 cargo run +``` + +Check for dead links: +```sh +CHECK=1 cargo run +``` + +## Run +``` +cd _site/ +python3 -m http.server 8000 +``` diff --git a/css/IBMPlexMono-Regular.woff b/css/IBMPlexMono-Regular.woff new file mode 100644 index 0000000..a3d3f8c Binary files /dev/null and b/css/IBMPlexMono-Regular.woff differ diff --git a/css/IBMPlexMono-Regular.woff2 b/css/IBMPlexMono-Regular.woff2 new file mode 100644 index 0000000..e6853af Binary files /dev/null and b/css/IBMPlexMono-Regular.woff2 differ diff --git a/css/IBMPlexSerif-Regular.woff b/css/IBMPlexSerif-Regular.woff new file mode 100644 index 0000000..83e9071 Binary files /dev/null and b/css/IBMPlexSerif-Regular.woff differ diff --git a/css/IBMPlexSerif-Regular.woff2 b/css/IBMPlexSerif-Regular.woff2 new file mode 100644 index 0000000..92d1588 Binary files /dev/null and b/css/IBMPlexSerif-Regular.woff2 differ diff --git a/css/default.css b/css/default.css new file mode 100644 index 0000000..9849e8c --- /dev/null +++ b/css/default.css @@ -0,0 +1,1501 @@ +:root { + --border-radius: 5px; + --box-shadow: 2px 2px 10px; + --color: #118bee; + --color-accent: #bcdde3; + --color-bg: #fff; + --color-bg-secondary: #f8f8f8; + --color-secondary: #920de9; + --color-secondary-accent: #555; + --color-shadow: #f4f4f4; + --color-text: #151515; + --color-hyperlink: #133c8a; + --logo-color: #131516; + --color-petrol: #014446; + --color-text-secondary: #999; + --hover-brightness: 1.2; + --justify-important: center; + --justify-normal: left; + --line-height: 150%; + --width-card: 285px; + --width-card-medium: 460px; + --width-card-wide: 800px; + --width-content: 1080px; + --font-sans-serif: "IBM Plex Sans Serif", "DejaVu Sans", "Liberation Sans", sans-serif; + --font-monospace: "IBM Plex Mono", "dejavu_sans_monobook", monospace; + --bee-emoji-svg: url('data:image/svg+xml,%3Csvg enable-background="new 0 0 47.5 47.5" version="1.1" viewBox="0 0 47.5 47.5" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="c"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3CclipPath id="b"%3E%3Cpath d="m8.719 17c0-6.133 4.603-13 10.281-13 5.679 0 10.281 6.867 10.281 13s-4.602 8.923-10.281 8.923c-5.678 0-10.281-2.79-10.281-8.923"/%3E%3C/clipPath%3E%3CclipPath id="a"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform="matrix(1.25,0,0,-1.25,0,47.5)"%3E%3Cg clip-path="url(%23c)"%3E%3Cg transform="translate(20,4)"%3E%3Cpath d="m0 0c0-1.657-0.447-3-1-3-0.552 0-1 1.343-1 3s0.448 3 1 3c0.553 0 1-1.343 1-3" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(26.753 35.753)"%3E%3Cpath d="m0 0c-0.586 0.586-1.693 0.428-2.475-0.354-0.611-0.611-1.948-2.53-2.222-3.619-0.884 0.195-1.93 0.22-3.056 0.22-1.125 0-2.172-0.025-3.055-0.219-0.275 1.089-1.611 3.007-2.223 3.618-0.781 0.782-1.888 0.94-2.474 0.354s-0.428-1.693 0.353-2.475c0.511-0.51 1.937-1.529 3.027-2.011-0.82-0.533-1.315-1.451-1.315-3.032 0-3.589 2.546-7.312 5.687-7.312 3.142 0 5.688 3.723 5.688 7.312 0 1.581-0.496 2.499-1.316 3.032 1.091 0.482 2.517 1.5 3.027 2.011 0.782 0.782 0.94 1.889 0.354 2.475" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(29.281 17)"%3E%3Cpath d="m0 0c0-6.134-4.603-13-10.281-13s-10.281 6.866-10.281 13c0 6.133 4.603 8.923 10.281 8.923s10.281-2.79 10.281-8.923" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23b)"%3E%3Cpath d="m30 18h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 10h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 2h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647-7.858-10-12-10s-6 5.354-6 8 1.858 1.584 6 1.584c4.143 0 12 3.061 12 0.416" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647 7.857-10 12-10s6 5.354 6 8-1.857 1.584-6 1.584-12 3.061-12 0.416" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23a)"%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647-7.858-8.584-12-8.584s-6 2.443-6 5.089 1.858 4.495 6 4.495c4.143 0 12 1.645 12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647 7.857-8.584 12-8.584s6 2.443 6 5.089-1.857 4.495-6 4.495-12 1.645-12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(3,18)"%3E%3Cpath d="m0 0c-0.552 0-1 0.447-1 1 0 0.551 0.446 0.999 0.998 1 0.048 0 4.948 0.07 13.596 3.914 0.505 0.227 1.095-2e-3 1.32-0.508 0.224-0.505-3e-3 -1.095-0.508-1.32-9.089-4.039-14.193-4.086-14.406-4.086" fill="%2399aab5"/%3E%3C/g%3E%3Cg transform="translate(35,18)"%3E%3Cpath d="m 0,0 c -0.213,0 -5.316,0.047 -14.406,4.086 -0.505,0.225 -0.732,0.815 -0.508,1.32 0.225,0.505 0.817,0.732 1.32,0.508 C -4.946,2.07 -0.046,2 0.003,2 0.554,1.997 1,1.548 0.999,0.997 0.997,0.446 0.551,0 0,0" fill="%2399aab5"/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A'); +} + +@media (prefers-color-scheme: dark) { + :root { + --color-accent: #424242; + --color-bg: #333333; + --color-bg-secondary: #424242; + --color-secondary: #6df216; + --color-secondary-accent: #f4f4f4; + --color-shadow: #bbbbbb20; + --color-text: #fff; + --color-text-secondary: #666; + --color-hyperlink: #6c98ff; + --logo-color: white; + --color-petrol: #0b3435; + } +} + +@font-face { + font-family: 'IBM Plex Mono'; + src: local("IBM Plex Mono"), + url('/css/IBMPlexMono-Regular.woff2') format('woff2'), + url('/css/IBMPlexMono-Regular.woff') format('woff'); + font-weight: normal; +} + +@font-face { + font-family: 'IBM Plex Serif'; + src: local("IBM Plex Serif"), + url('/css/IBMPlexSerif-Regular.woff2') format('woff2'), + url('/css/IBMPlexSerif-Regular.woff') format('woff'); + font-weight: normal; +} + + +@font-face { + font-family: 'dejavu_sans_monobook'; + src: local("DejaVu Sans Mono"), + url('/css/dejavusansmono-webfont.woff2') format('woff2'), + url('/css/dejavusansmono-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + +* { + box-sizing: border-box; +} + +html { + font-size:100%; + font-family:"IBM Plex Mono", "dejavu_sans_monobook", monospace; + height: 100%; +} + +body { + font-size:.8rem; + color: var(--color-text); +/* color: #202020; */ +/* color: #404040;*/ + background: radial-gradient(circle farthest-side at 0% 50%,var(--color-bg) 23.5%,rgba(240,166,17,0) 0)21px 30px, radial-gradient(circle farthest-side at 0% 50%,var(--color-bg-secondary) 24%,rgba(240,166,17,0) 0)19px 30px, linear-gradient(var(--color-bg) 14%,rgba(240,166,17,0) 0, rgba(240,166,17,0) 85%,var(--color-bg) 0)0 0, linear-gradient(150deg,var(--color-bg) 24%,var(--color-bg-secondary) 0,var(--color-bg-secondary) 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,var(--color-bg-secondary) 0,var(--color-bg-secondary) 76%,var(--color-bg) 0)0 0, linear-gradient(30deg,var(--color-bg) 24%,var(--color-bg-secondary) 0,var(--color-bg-secondary) 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,var(--color-bg-secondary) 0,var(--color-bg-secondary) 76%,var(--color-bg) 0)0 0, linear-gradient(90deg,var(--color-bg-secondary) 2%,var(--color-bg) 0,var(--color-bg) 98%,var(--color-bg-secondary) 0%)0 0 var(--color-bg); + background-size: 40px 60px; + margin: 0; + display: grid; + grid-template-rows: auto 1fr auto; + height: 100%; +} + +a { + color: var(--color-hyperlink); +} + +a:visited { + color: var(--color-hyperlink); +} +em { + letter-spacing:0.011em; +} + +header { + border-bottom:1px solid #969595; + display: flex; + justify-content: space-between; +} +header nav { + margin: auto 0 0 auto; + text-align:right; + display: flex; + flex-wrap: wrap; + flex-direction: row; + justify-content: flex-end; +} +header nav a { + font-size:1.1rem; + font-family: var(--font-sans-serif); + font-weight:bold; + text-transform:uppercase; + text-decoration:none; +} + +header nav a::after { + border: 1px solid var(--color-bg-secondary); + filter: invert(10%); + content: " "; + width: 100%; + height: 0 !important; + display: block; + margin-top: -2px; +} + +@media (prefers-color-scheme: dark) { + header nav a:first-child::after, header nav a + a:not(:last-child)::after { + filter: invert(20%); + } +} + +footer { + margin-top:1rem; + padding:.5rem 0 1.2rem 0; + border-top:1px solid #969595; + font-size:.8rem; + color: var(--color-secondary-accent); +} + +h1, h2, h3, h4 { + font-variant-caps: small-caps; + } +h5, h6 { + color: var(--color-text-secondary); + text-transform: lowercase; +} +h1, h2, h3, h4, h5, h6 { + font-family: var(--font-sans-serif); + max-width: max-content; + padding-right: .5rem; + background: var(--color-bg); + /*border-bottom: 1px solid #9f9f9f;*/ +} +h1 { font-size:1.3rem; } +h2 { font-size:1.15rem; } +h3 { font-size:1rem; } +h4 { font-size:.9rem; } +h5 { font-size:.8rem; } +h6 { font-size:.7rem; } + + + +h3 { + margin-top:0; + margin-bottom:0; + } + +h1.title{ + margin-bottom: 4px; + padding: .7rem; + max-width: 41rem; +} + +ul { + list-style: square; + padding-left: 0px; + list-style-position: inside; +} + +li ul { + padding-left: 1.2rem; +} + +li::marker { + color: #2A9; +} + +.subtitle { + /* Add extra padding to align with the title above */ + padding-left:.7rem; +} + +/* Article/posts styling */ +main.article { + display: flex; + flex-direction: column; + width: 100%; + margin:0 0; +} + +main.article article > :first-child { + /* header div already has padding-bottom */ + margin-top: 0; + padding-top: 0; +} + +main.article article p { + overflow-x: hidden; +} + +main.article article p:hover { + overflow-x: revert; +} + +main.article .title { + border-bottom: double 3px #d5d5d5; + border-left: double 3px #d5d5d5; + border-radius: 6px; + background-color: var(--color-bg-secondary); + +} + +@media (min-width: 1280px) { + #bee-emoji-svg, #bee-emoji-svg::before { + display: inline-block !important; + } + .logo:hover, .logo:hover::after { + display: inline !important; + } + main { + z-index: 1; + margin:0 auto; + padding:0; + } + header { + margin:2.0rem 0 3.5rem 3rem; + padding:0.2rem 0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .logo { + text-align:left; + } + .logo a { + font-size:6rem; + } + img.fit { + width: 100%; + height: auto; + object-fit: cover; + } + main.article { + display: grid; + grid-template-columns: 2fr minmax(50em, 1fr) 2fr; + grid-column-gap: 10px; + grid-row-gap: 3px; + grid-auto-rows: minmax(auto, 0fr); + } + + main.article article { + padding-right: 4rem; + } +} + +main.article div.left { + grid-column: 1/ span 1; + grid-row: 2 / 3; + min-width:180px; + order: 2; + padding-left: 2em; + padding-right: 2em; +} + +main.article article { + line-height: 1.7; + text-decoration-color: #0000001a; + grid-column: 1 / span 3; + grid-row: 2 / 3; + order:1; + background: var(--color-bg); + display: grid; + grid-template-columns: minmax(5vw, 1fr) minmax(auto, 65ch) minmax(5vw, 1fr); +} + +article > * + * { + margin-bottom: 1rem; + margin-top: 0; +} + +main.article div.right { + grid-column: 3/ span 1; + grid-row: 2 / 3; + min-width:180px; + order:3; + padding-left: 2em; + padding-right: 2em; +} + +main.article article > figure,video,div.sourceCode { +grid-column: 1/ span 3; +margin: 0 auto 1rem auto; +max-width: max-content; +width: 100%; +overflow-x: auto; +} +main.article article > p,hr,blockquote,dl,ul,ol,h1,h2,h3,h4,h5,h6,table,div.manual-text{ +grid-column: 2/ span 1; +} +main section { + background: var(--color-bg); +} +main section.header { + color: var(--color-secondary-accent); + font-size:0.8rem; + grid-column: 2 / 3; + grid-row: 1 / 2; + width: 100%; + padding-bottom: .5rem; + place-self: center; +} + +main.article article p:first-child { + margin-top: 0; +} + +main.article article > p:first-child::first-letter { + float: left; + font-size: 500%; +/* font-style: italic;*/ + height: 1rem; + line-height: 1rem; + margin: 0px; + padding: 0 .05em 0 0; + text-shadow: #d9d4d4 .05em .05em; +} + +.logo a { + font-size: 3.5rem; + color: var(--logo-color); + font-weight:bold; + text-decoration:none; +} +/* +.sidenote-left, .sidenote-right { + display: inline-block; + width: 48%; + margin-top: 0; + margin-bottom: 0; + font-size: 7pt; + line-height: 1.3; + vertical-align: baseline; +} +*/ + +/* Typography */ +code { + vertical-align: baseline; + display: inline-block; + padding: 2px 3px 4px 3px; + font-weight: 800; + color: #006266; + line-height: 1; + font-family: var(--font-monospace); +} + +code, +samp { + background-color: #dbdbdb; + color: black; + border-radius: var(--border-radius); + text-align: var(--justify-normal); + vertical-align: text-top; + padding:.15rem .3em .15rem .3rem; +} +code:not(.sourceCode) +{ + display: inline-flex; +} + +p { + text-align: justify; + text-align-last: left; + text-justify: inter-character; + hyphens: auto; +} + +kbd.□.▭ { + width: auto; + font-weight: 800; + padding: 13px 5px; + /* box-shadow: 2px 3px #8e897a; */ + box-shadow: 3px 5px #8e897a, 2px 0px 2px -1px inset #bbb, -1px 0px 2px -1px inset #bbb, -2px 3px #8e897a, -3px 5px #8e897a, 3px 5px #8e897a, -2px 3px #8e897a, 2px 3px #8e897a, 2px 3px #8e897a; + margin: .5rem .5rem .6rem .25rem; +} + +kbd.□.▭:active { + box-shadow: 1px 0px 1px #c1c0c0 inset,-1px 0px 1px #c1c0c0 inset, -3px 3px #a29b9b, 3px 3px #a29b9b, -2px 2px #a29b9b, 2px 2px #a29b9b, -1px 1px #a29b9b, 1px 1px #a29b9b; + top: 3px; + position: relative; +} + +kbd.□:active { + color: black; + box-shadow: 1px 1px 0px #ddd inset; + top: 1px; + position: relative; +} + +kbd.□ { + font-weight: 800; + border: 1px solid #cecece; + background: #f7f7e7; + color: #151515; + /* box-shadow: 2px 1px #8e897a;*/ + box-shadow: 1px 3px darkgray, -1px 3px darkgray, 1px 2px darkgray, -1px 2px darkgray; + border-radius: 3px; + display: inline-block; + font-size: .85em; + line-height: 1; + padding: 2px 4px; + white-space: nowrap; + user-select: none; + cursor:pointer; + transform: translateY(-0.1rem); + vertical-align: text-bottom; +} + +/* for keys that aren't entirely square */ +.thin-kbd.□.▭ { + padding-right: 7px; + padding-left: 8px; +} + +.sourceCode code { + font-weight: 600; +} + +@media (min-width:320px) { + #bee-emoji-svg, #bee-emoji-svg::before, .logo:hover::after { + display: none; + } + body { + padding:0 5%; + } + header { + margin:.5rem 0 2.0rem 0; + } + footer { + text-align:center; + } + .logo a { + font-size:3.5rem; + } + header nav { + padding-bottom: .7rem; + } + header nav a { + display:inline; + margin:0 0.6rem; + font-size:1.1rem; + width: min-content; + } + .screenshots { + flex-direction: column; + } +} +@media (min-width:1140px) { + main { + z-index: 1; + padding:0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + white-space: nowrap; + } + footer { + text-align:right; + } + .screenshots { + flex-direction: row; + } +} + + + +img.fit { + width: 100%; + height: auto; + object-fit: cover; +} + +img.full-width { + width: 100%; + max-width: max-content; + height: auto; + object-fit: cover; +} + +.fit-right { + margin-left: 10%; +} +.fit-left { + margin-right: 10%; +} + +.logo { + margin: auto auto 0 0; +} + +.logo-img { + width: 100%; + height: auto; + object-fit: cover; +} + +figure { + margin: 0 1.2rem 1.2rem 0; +} + + +.bold { + font-weight: 800; +} + +figcaption { + font-size: 8pt; + font-weight:bolder; + color: var(--color-text); + background: var(--color-bg-secondary); + border: 1px outset var(--color-bg-secondary); + border-radius: 0 0 2px 2px; + margin-top: -3px; + padding-bottom: 7px; + padding-left: 2%; + padding-top: 5px; + min-width: 100% +} + +figcaption a { + text-decoration: inherit; + color: inherit; +} + +figcaption a:visited { + color: inherit; +} + +/* Index styling */ +.wrapper { + display: grid; + grid-auto-columns: minmax(100px, auto); + grid-gap: 10px; + grid-auto-rows: minmax(100px, auto); +} + + h1, h2, h3, h4, h5, h6 { + /*border-bottom: 2px inset #000; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + border-top: 1px solid #c8c8c8; + border-style: outset; + border-radius: 3px;*/ + background: var(--color-bg); + margin-top: 0; + max-width: inherit; +} +h1 span, h2 span, h3 span, h4 span, h5 span, h6 span { + background: var(--color-bg); +} +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + background: var(--color-bg); + color: var(--color-text); +} + +@media (max-width:1280px) { +/*.wrapper > *:first-child { + display: flex; + flex-wrap: wrap; + grid-column: 1; + grid-row: 1 / 1; +}*/ +section.index-intro { + width: 100%; +} + +section.index-intro, section.index-why, section.index-install, section.index-build, section.index-features, section-announcements { + /*border-bottom: 2px solid #6c6e6f;*/ + min-width: 100%; + margin-bottom: 10px; +} +} + +@media (min-width:1280px) { +.wrapper > *:first-child { + display: grid; + grid-column: 1; + grid-row: 1 / 1; + grid-template-areas: + "term term install install build" + "term term why why why" + "screenshots screenshots features features announcements" + "screenshots screenshots features features announcements"; + grid-column-gap: 3rem; + grid-row-gap: 1rem; + grid-template-columns: repeat(2, min-content) repeat(2, auto); + grid-template-rows: repeat(2, min-content) repeat(2, auto); +} +section.index-why > div { + display: grid; + grid-template-columns: 11fr 8fr; + box-sizing: border-box; + grid-column-gap: 3rem; + padding: 0 1rem 0 0; +} +section.index-why > div > * + * { + margin-bottom: .5rem; + margin-top: 0; +} + + +section.index-install ol { + margin-bottom: 0px; +} + +section.index-install ol > li + li { + margin-bottom: .2rem; + margin-top: 0; +} + +section.index-install, section.index-build { + margin-bottom: 20px; +} + +section.index-intro { + width: 37vw; +} +} + +section h1 { + font-size: 1.21rem; + margin-top: 0px; +} + +h1 { +/* border-bottom: 2px inset #000;*/ + max-width: max-content; +/*border-left: 1px solid #b2b2b2;*/ + /* border-radius: 2px;*/ + background: var(--color-bg); +} + +section.index-intro { + grid-area:term; +} + +section.index-why { + grid-area: why; +} + +section.index-features { + grid-area: features; +} + +section.index-install { + grid-area: install; +} + +section.index-build { + grid-area: build; +} + +section.index-announcements { + grid-area: announcements; +} + +ul.index-announcement-list { + margin-bottom: 0; + height: 100%; +} + +section.index-install > h2 { + margin-bottom: 0; + +} + +section.index-install details > summary { + display: inline-block; +} + +section.index-install details > summary::after { + content: " (help) "; + color: var(--color-hyperlink); + font-size: .6rem; + cursor: pointer; +} + +section.index-install details > summary > code { + color: var(--color-petrol); + font-size: 119%; +} + +.index-screenshots { + grid-area: screenshots; + + display: grid; + grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); + grid-template-rows: repeat(auto-fill, minmax(80px, 1fr)); + grid-gap: 5px; + align-items: stretch; + margin: 0; +} + +.index-screenshots > * { + flex: initial; + flex: 0 22%; + flex-shrink: -1; +} + +.index-screenshots a { + height: 100%; +} + +.index-screenshots img { + object-fit: contain; + width: 100%; + height:inherit; + background: #444; +} + +.xterm-title { + margin: initial; + background: #22AA99; + color: var(--color-bg); + font-size: .8rem; + padding: 0.4em 0rem; + width: auto; + min-width: inherit; + font-weight:800; + word-break: keep-all; + padding-left: .5rem; + font-family: var(--font-sans-serif); + text-shadow: 0px 1px var(--color-secondary-accent); +} +h1.xterm { + font-family: revert; + font-variant-caps: initial; + max-width: initial; + width: initial; + border: initial; + padding: initial; + overflow: hidden; + font-size: 12px; + direction: ltr; + text-align: left; + background: #22AA99; + padding: 0px; + border: 1px solid black; + width: inherit; + padding-top: .3rem; + padding-bottom: .3rem; +} + +#main_svg { + width: inherit; + border: 1px solid black; + display: block; +} +/* Index styling end */ + + + + + + + +/* lightbox */ + + + + +/*Eliminates padding, centers the thumbnail */ + +/* Styles the lightbox, removes it from sight and adds the fade-in transition */ + +figure:not(.lightbox-target) { + display: flex; + flex-direction: column; + max-width: max-content; + background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23b9b9b9' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E"); + background-color: #ccc; +} +figure:not(.lightbox-target) > * { + align-self: center; +} +.lightbox-target { + z-index:5; + pointer-events: none; + position: absolute; + top: 0; + left:0; + right:0; + bottom: 0; + width: 100%; + height: 100%; + opacity: 0; + /* overflow: hidden; */ + overflow-x: scroll; + + padding: 0; + text-align: center; + margin:0; +} + + +/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */ + +.lightbox-target img { + margin: auto; + max-height: 0%; + max-width: 0%; + border: 3px solid white; + box-shadow: 0px 0px 8px rgba(0,0,0,.3); + box-sizing: border-box; + z-index: 2; +} + +.lightbox-target figcaption { + margin: auto; + padding: 18px; + color: #5b5e60; + background: #f6f6f6; + border: 3px solid #ededed; + z-index: 3; + font-size: 2rem; + pointer-events: none; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + width: auto; + height: min-content; +} + +/* Styles the close link, adds the slide down transition */ + +a.lightbox-close { + width:50px; + height:50px; + color: white; + opacity: 1; + text-decoration: none; + pointer-events: auto; + z-index: 4; + font-size: 2.5rem; +} + +/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */ + +.lightbox-target:target { + opacity: 1; + top: 0; + bottom: 0; +} + +.lightbox-target:target img { + max-height: 80vh; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + height: auto; + width: auto; +} + +.lightbox-target:target a.lightbox-close { +top: 0px; +} + + +/* IBM's colorblind safe palette */ + +.cornflower-blue { + color: #648FFF; +} + +.purple { + color: #785EF0; +} + +.cerise { + color: #DC267F; +} + +.blaze-orange { + color: #FE6100; +} + +.amber { + color: #FFB000; +} + + +.dull-red { + color: #CC6677; +} + +.cyan { + color: #44AA99; +} + +.green { + color: #117733; +} + +.float_left_img { + max-width: 25%; + min-width: 5vw; + float:left; + padding: .4em; +} + + +div.mandoc { + max-width: 100vw; + min-width: 100vw; +} + +nav.nav-doc { + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + border: 1px solid black; + padding: .4rem 1rem .4rem 2rem; + background: var(--color-bg); + box-shadow: 5px 5px darkgrey; + margin-bottom: 1rem; +} + +nav.nav-doc ul { +list-style: square; +} + +main.article-doc { + display: grid; + grid-template-columns: minmax(auto, 50em); + grid-auto-rows: minmax(auto, 0fr); + width: 100%; + place-content: center; +} + +main.article-doc > * { + grid-column: 1 / span 1; + width: 100%; + max-width: 100%; +} + +article.article-doc { + max-width: 50em; + background: var(--color-bg); +} + +article.article-doc2 { + margin: 0 auto; + background: var(--color-bg); +} + +.screenshots-page { + display: flex; + flex-wrap: wrap; +} + +.screenshots-page > * { + flex: 1 0 30%; + min-width: 200px; +} + +.screenshots-page > figure > a { + height: 100%; + background: #1c1c1c; +} +.screenshots-page > figure > a > img { + height: inherit; + width: 100%; + object-fit: contain; + background: #444; +} + +.screenshots-page > figure:not(.lightbox-target):nth-child(odd) > a > img { + background-color: #cccccc; + background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23b9b9b9' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E"); +} + +code.Nm::after { + /*content: " 🐝";*/ + content: " "; + background-image: var(--bee-emoji-svg); + background-repeat: no-repeat; + height: .9rem; + width: .9rem; + filter: hue-rotate(170deg) grayscale(42%); + transform: translate(1px, -1px); + margin-bottom: -2px; +} + + +/* Documentation */ + +span.notice-info { + padding: .5rem; + border: 2px dashed grey; + margin-bottom: 15px; + background: var(--color-bg); + display: inline-block; +} + + + +/*! * * * * * * * * * * * * * * * * * * * *\ + CSShake :: shake-little + v1.5.0 + CSS classes to move your DOM + (c) 2015 @elrumordelaluz + http://elrumordelaluz.github.io/csshake/ + Licensed under MIT +\* * * * * * * * * * * * * * * * * * * * */ +code.Nm::after { + display: inline-block; + transform-origin: center center; } + +.shake-freeze, +.shake-constant.shake-constant--hover:hover, +.shake-trigger:hover .shake-constant.shake-constant--hover { + animation-play-state: paused; } + +.shake-freeze:hover, +.shake-trigger:hover .shake-freeze, code.Nm:hover::after, +.shake-trigger:hover code.Nm::after { + animation-play-state: running; } + +@keyframes shake-little { + 2% { + transform: translate(0px, 1px) rotate(0.5deg); } + 4% { + transform: translate(0px, 1px) rotate(0.5deg); } + 6% { + transform: translate(1px, 1px) rotate(0.5deg); } + 8% { + transform: translate(0px, 0px) rotate(0.5deg); } + 10% { + transform: translate(1px, 0px) rotate(0.5deg); } + 12% { + transform: translate(1px, 1px) rotate(0.5deg); } + 14% { + transform: translate(0px, 0px) rotate(0.5deg); } + 16% { + transform: translate(1px, 0px) rotate(0.5deg); } + 18% { + transform: translate(0px, 1px) rotate(0.5deg); } + 20% { + transform: translate(0px, 1px) rotate(0.5deg); } + 22% { + transform: translate(1px, 1px) rotate(0.5deg); } + 24% { + transform: translate(0px, 1px) rotate(0.5deg); } + 26% { + transform: translate(0px, 0px) rotate(0.5deg); } + 28% { + transform: translate(1px, 0px) rotate(0.5deg); } + 30% { + transform: translate(1px, 0px) rotate(0.5deg); } + 32% { + transform: translate(0px, 1px) rotate(0.5deg); } + 34% { + transform: translate(0px, 1px) rotate(0.5deg); } + 36% { + transform: translate(0px, 0px) rotate(0.5deg); } + 38% { + transform: translate(1px, 1px) rotate(0.5deg); } + 40% { + transform: translate(1px, 0px) rotate(0.5deg); } + 42% { + transform: translate(0px, 1px) rotate(0.5deg); } + 44% { + transform: translate(0px, 1px) rotate(0.5deg); } + 46% { + transform: translate(0px, 0px) rotate(0.5deg); } + 48% { + transform: translate(0px, 1px) rotate(0.5deg); } + 50% { + transform: translate(0px, 1px) rotate(0.5deg); } + 52% { + transform: translate(1px, 1px) rotate(0.5deg); } + 54% { + transform: translate(0px, 0px) rotate(0.5deg); } + 56% { + transform: translate(0px, 0px) rotate(0.5deg); } + 58% { + transform: translate(0px, 0px) rotate(0.5deg); } + 60% { + transform: translate(0px, 1px) rotate(0.5deg); } + 62% { + transform: translate(0px, 0px) rotate(0.5deg); } + 64% { + transform: translate(1px, 0px) rotate(0.5deg); } + 66% { + transform: translate(0px, 1px) rotate(0.5deg); } + 68% { + transform: translate(0px, 0px) rotate(0.5deg); } + 70% { + transform: translate(1px, 1px) rotate(0.5deg); } + 72% { + transform: translate(1px, 0px) rotate(0.5deg); } + 74% { + transform: translate(0px, 1px) rotate(0.5deg); } + 76% { + transform: translate(0px, 1px) rotate(0.5deg); } + 78% { + transform: translate(1px, 0px) rotate(0.5deg); } + 80% { + transform: translate(1px, 0px) rotate(0.5deg); } + 82% { + transform: translate(0px, 0px) rotate(0.5deg); } + 84% { + transform: translate(1px, 0px) rotate(0.5deg); } + 86% { + transform: translate(0px, 0px) rotate(0.5deg); } + 88% { + transform: translate(0px, 0px) rotate(0.5deg); } + 90% { + transform: translate(1px, 1px) rotate(0.5deg); } + 92% { + transform: translate(1px, 1px) rotate(0.5deg); } + 94% { + transform: translate(1px, 0px) rotate(0.5deg); } + 96% { + transform: translate(1px, 0px) rotate(0.5deg); } + 98% { + transform: translate(0px, 0px) rotate(0.5deg); } + 0%, 100% { + transform: translate(0, 0) rotate(0); } } + +code.Nm:hover::after, +.shake-trigger:hover code.Nm::after, .shake-little.shake-freeze, .shake-little.shake-constant { + animation-name: shake-little; + animation-duration: 100ms; + animation-timing-function: ease-in-out; + animation-iteration-count: infinite; +} + +#bee-emoji-svg:hover::before, +.shake-trigger:hover .shake-little.shake-freeze, .shake-little.shake-constant { + animation: shake-little 50ms ease-in-out running 120, harvest 10s 5500ms running steps(8, jump-both) infinite; +} + + + .logo::after { + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} +.logo:hover::after { + content: "🌸"; + height: 3.5rem; + width: 3.5rem; + font-size: 2rem; + position: relative; + right: 3rem; + z-index: -1; + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg:hover::before { + transform: translateY(26px) scale(.5); + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg::before { + content: " "; + filter: hue-rotate(170deg) grayscale(42%); + background-image: var(--bee-emoji-svg); + background-repeat: no-repeat; + height: 3.5rem; + width: 3.5rem; + + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); + } +#bee-emoji-svg { + height: 3.5rem; + width: 3.5rem; + cursor: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="25px" height="25px"%3E%3Cpath fill="%2377B255" d="M28.938 27.441c-2.554-.89-8.111-.429-9.938 1.331V17c0-.553-.447-1-1-1s-1 .447-1 1v11.772c-1.827-1.76-7.384-2.221-9.938-1.331-.741.259 5.264 8.749 9.507 4.507.168-.168.306-.33.431-.49V35c0 .553.447 1 1 1s1-.447 1-1v-3.542c.125.16.263.322.431.49 4.243 4.242 10.248-4.248 9.507-4.507z"/%3E%3Cpath fill="%23CCD6DD" d="M12.562 25.65c-.619-.266-1.107-.837-1.378-1.513l-1.266-3.306-3.258-1.393c-1.336-.574-1.876-1.922-1.304-3.259l1.362-3.181-1.364-3.269c-.541-1.35.15-2.868 1.5-3.408l3.272-1.281 1.449-3.384C12.148.32 13.496-.22 14.833.352l3.258 1.396L21.358.382c.675-.271 1.411-.276 2.03-.011.619.265 1.114.819 1.385 1.494l1.274 3.29 3.309 1.417c1.336.572 1.875 1.921 1.305 3.258l-1.451 3.384 1.365 3.267c.541 1.35-.15 2.866-1.5 3.407l-3.271 1.281-1.363 3.183c-.572 1.336-1.922 1.877-3.258 1.305l-3.308-1.417-3.267 1.364c-.676.271-1.427.311-2.046.046z"/%3E%3Cpath fill="%23E1E8ED" d="M29.356 6.572l-3.309-1.417-.055-.143c-1.565 1.337-5.215 4.354-5.215 4.354l.007.123C20.015 8.879 19.057 8.5 18 8.5V1.709L14.833.353c-1.337-.572-2.685-.032-3.258 1.304l-1.449 3.384-.061.024 4.753 4.754c-.814.813-1.318 1.938-1.318 3.181H6.717l-1.361 3.178c-.572 1.337-.032 2.686 1.304 3.259l3.258 1.394.002.006 4.496-5.142c.822 1.09 2.115 1.805 3.584 1.805h.005c.006 1.979.015 5.273.012 6.801l3.164 1.356c1.336.572 2.686.031 3.258-1.305l1.362-3.18-5.192-4.517c1.14-.816 1.89-2.145 1.89-3.654 0-.071-.018-.137-.021-.208 1.802.182 4.951.472 6.822.642l-.092-.22L30.66 9.83c.571-1.337.031-2.686-1.304-3.258z"/%3E%3Ccircle fill="%23F4900C" cx="18" cy="13" r="5"/%3E%3C/svg%3E'), auto; +} +#bee-emoji-svg:hover { + animation: flowercursor 0.65s infinite; +} + + +.sakura { + opacity: 0; + position: fixed; +} +.envelope { + filter: grayscale(); + opacity: 0; + position: fixed; +} +#bee-emoji-svg:hover .sakuraA, .sakuraA:hover { + opacity: 1; + animation-name: none; + transition: opacity 0.01s linear; + font-size:1em; +} + +#bee-emoji-svg:hover #envelopeA, #envelopeA:hover { + animation-name: envelope-flyA; + animation-delay: 3.5s; +} +#bee-emoji-svg:hover #envelopeB, #envelopeB:hover { + animation-name: envelope-flyB; + animation-delay: 3.55s; +margin-top:2rem; +} +#bee-emoji-svg:hover #envelopeC, #envelopeC:hover { + animation-name: envelope-flyC; + animation-delay: 3.6s; +margin-top:3rem; +} +#bee-emoji-svg:hover #envelopeD, #envelopeD:hover { + animation-name: envelope-flyD; + animation-delay: 3.65s; +margin-top:2rem; +} +#bee-emoji-svg:hover .envelope, .envelope:hover { + animation-duration: 1s; + animation-timing-function: linear; + animation-iteration-count: 1; + animation-play-state: running; + font-size:2em; +} + +@keyframes envelope-flyA { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(-45deg); + } + 20% { + transform: translate(15px, -15px) rotate(-45deg); + } + 40% { + transform: translate(30px, -30px) rotate(-45deg); + opacity: .4; + } + 60% { + transform: translate(45px, -45px) rotate(-45deg); + opacity: .1; + } + 80% { + transform: translate(60px, -60px) rotate(-45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyB { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(45deg); + } + 20% { + transform: translate(15px, 15px) rotate(45deg); + } + 40% { + transform: translate(30px, 30px) rotate(45deg); + opacity: .4; + } + 60% { + transform: translate(45px, 45px) rotate(45deg); + opacity: .1; + } + 80% { + transform: translate(60px, 60px) rotate(45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyC { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(60deg); + } + 20% { + transform: translate(15px, 30px) rotate(60deg); + } + 40% { + transform: translate(30px, 60px) rotate(60deg); + opacity: .4; + } + 60% { + transform: translate(45px, 90px) rotate(60deg); + opacity: .1; + } + 80% { + transform: translate(60px, 120px) rotate(60deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyD { + 0% { +opacity: 1; + transform: translate(0, 0); + } + 20% { + transform: translate(15px, 0); + } + 40% { + transform: translate(30px, 0); + opacity: .4; + } + 60% { + transform: translate(45px, 0); + opacity: .1; + } + 80% { + transform: translate(80px, 0); + opacity: 0; + } + 100% { + opacity: 0; + } + +} + +@keyframes harvest { + 0% { + transform: rotate(5deg) translateY(3px) translateX(3px); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(7px) rotate(12deg); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(4px) rotate(12deg); + transition: transform linear; + } + 60% { + transform: translateY(3px) rotate(12deg); + transition: transform linear; + } + 70% { + transform: translateY(3px) rotate(10deg); + transition: transform linear; + } + 80% { + transform: translateY(3px) translateX(2px) rotate(7deg); + transition: transform linear; + } + 100% { + transform: translate(3px, 3px) rotate(5deg); } +} + + + + + +@keyframes flowercursor{ + 0%{ + cursor: url("/css/flowercursor.svg"), auto; + } + 10%{ + cursor: url("/css/flowercursor1.svg"), auto; + } + 20%{ + cursor: url("/css/flowercursor1.svg"), auto; + } + 30%{ + cursor: url("/css/flowercursor1.svg"), auto; + } + 60%{ + cursor: url("/css/flowercursor.svg"), auto; + } + 70%{ + cursor: url("/css/flowercursor5.svg"), auto; + } + 80%{ + cursor: url("/css/flowercursor5.svg"), auto; + } + 90%{ + cursor: url("/css/flowercursor5.svg"), auto; + } +} + +.window { + box-shadow: inset -1px -1px #0a0a0a, + inset 1px 1px #ffffff, inset -2px -2px #808080, + inset 2px 2px #dfdfdf; + background: #c0c0c0; + padding: 3px; + padding-bottom: 0px; +} +.window> div:last-child { + margin:0; +} + +button, +label, +input, +textarea, +select, +option, +ul.tree-view, +.window, +.title-bar { + -webkit-font-smoothing: none; + font-size: 11px; + } + +.title-bar { + background: #163339; + font-family: "Liberation Sans", "DejaVu Sans", sans; + border-bottom: 1px solid #fff; + height: initial; + max-height: min-content; + flex: initial; + padding: 2px; + display: flex; + justify-content: space-between; + align-items: center; +} +.title-bar-text { + text-shadow: 1px 0px #424; + user-select: none; + font-weight: bold; + color: #fff; + letter-spacing: 0; + margin-right: 24px; +} +.title-bar-controls { + display: flex; +} +.title-bar-controls button[aria-label="Minimize"] { + background-position: top -1px center; + background-size: 100%; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -0.5 16 16' shape-rendering='crispEdges'%3E%3Cdefs/%3E%3Cpath stroke='%23000' d='M5 7h6M6 8h4M7 9h2'/%3E%3C/svg%3E"); + background-repeat: no-repeat; +} +.title-bar-controls button[aria-label="Maximize"] { + background-position: top -2px center; + background-size: 100%; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -0.5 16 16' shape-rendering='crispEdges'%3E%3Cdefs/%3E%3Cpath stroke='%23000' d='M7 7h2M6 8h4M5 9h6'/%3E%3C/svg%3E"); + background-repeat: no-repeat; +} +.title-bar-controls button { + padding: 0; + display: block; + min-width: 14px; + min-height: 12px; + box-sizing: border-box; + border: none; + background: #c0c0c0; + background-position-x: 0%; + background-position-y: 0%; + background-repeat: repeat; + background-image: none; + background-size: auto; + box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #fff, inset -2px -2px #808080, inset 2px 2px #dfdfdf; + border-radius: 0; +} +.title-bar-controls button:disabled { + background-blend-mode: overlay; + color: #808080; + text-shadow: 1px 1px 0 #fff; +} + +.title-bar-controls button[aria-label="Close"] { + background-position: top -2px center; + background-size: 100%; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -0.5 16 16' shape-rendering='crispEdges'%3E%3Cpath stroke='%23000' d='M4 5h2m4 0h2M4 6h3m2 0h3M5 7h6M6 8h4M6 9h4m-5 1h6m-7 1h3m2 0h3m-8 1h2m4 0h2'/%3E%3C/svg%3E"); + margin-left: 2px; + background-repeat: no-repeat; +} diff --git a/css/default.css.bkp b/css/default.css.bkp new file mode 100644 index 0000000..02d9842 --- /dev/null +++ b/css/default.css.bkp @@ -0,0 +1,1164 @@ +@font-face { + font-family: 'dejavu_sans_monobook'; + src: local("DejaVu Sans Mono"), + url('/css/dejavusansmono-webfont.woff2') format('woff2'), + url('/css/dejavusansmono-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + + +html { + font-size:100%; + font-family:"dejavu_sans_monobook", monospace; +} +body { + font-size:.80rem; + color: #151515; +/* color: #202020; */ +/* color: #404040;*/ + background: radial-gradient(circle farthest-side at 0% 50%,#FFF 23.5%,rgba(240,166,17,0) 0)21px 30px, radial-gradient(circle farthest-side at 0% 50%,#f8f8f8 24%,rgba(240,166,17,0) 0)19px 30px, linear-gradient(#FFF 14%,rgba(240,166,17,0) 0, rgba(240,166,17,0) 85%,#FFF 0)0 0, linear-gradient(150deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(30deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(90deg,#f8f8f8 2%,#FFF 0,#FFF 98%,#f8f8f8 0%)0 0 #FFF; + background-size: 40px 60px; +} + +a:visited { + color: #404040; +} +header { + border-bottom:1px solid #969595; + display: flex; + justify-content: space-between; +} +header nav { + margin: auto 0 0 auto; + text-align:right; +} +header nav a { + font-size:1.3rem; + font-weight:bold; + text-transform:uppercase; +} +footer { + margin-top:3rem; + padding:.5rem 0 1.2rem 0; + border-top:1px solid #969595; + font-size:.8rem; + color:#555; +} +h1 { + font-variant-caps: small-caps; +} +h2 { + font-variant-caps: small-caps; +} + +h3 { + font-style: italic; + font-variant-caps: small-caps; + font-weight: 100; + } + +h1.title{ + margin-bottom: 4px; + padding: .7rem; +} + +ul { + list-style: circle; + padding-left: 0px; + list-style-position: inside; +} + +li ul { + padding-left: 1.2rem; +} + +li { + line-height: 1.5; +} + +.subtitle { + /* Add extra padding to align with the title above */ + padding-left:.7rem; +} + +/* Article/posts styling */ +main.article { + display: flex; + flex-direction: column; + min-height: 100vh; + width: 100%; + margin:0 0; +} + +main.article article > :first-child { + /* header div already has padding-bottom */ + margin-top: 0; + padding-top: 0; +} + +main.article .title { + border-bottom: double 3px #d5d5d5; + border-left: double 3px #d5d5d5; + border-radius: 6px; + background-color: #a9a9a924; + +} + +@media (min-width: 1280px) { + #bee-emoji-svg, #bee-emoji-svg::before { + display: inline-block !important; + } + .logo:hover, .logo:hover::after { + display: inline !important; + } + article { + width: 43rem; + } + main { + z-index: 1; + min-width: 78rem; + margin:0 auto; + padding:0; + } + header { + margin:2.0rem 0 3.5rem 3rem; + padding:0.2rem 0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .logo { + text-align:left; + } + .logo a { + font-size:6rem; + } + img.fit { + width: 100%; + height: auto; + object-fit: cover; + } + main.article { + display: grid; + grid-template-columns: [left-sideline] auto [body] auto [right-sideline] auto; + grid-column-gap: 10px; + grid-row-gap: 3px; + grid-auto-rows: auto; + } + + main.article article { + padding-right: 4rem; + } +} + +main.article div.left { + grid-column: left-sideline; + grid-row: 2 / 3; + min-width:180px; + order: 2; + padding-left: 2em; + padding-right: 2em; +} + +main.article article { + line-height: 1.4; + text-decoration-color: #0000001a; + grid-column: body; + grid-row: 2 / 3; + order:1; + max-width: 41rem; +} + +main.article div.right { + grid-column: right-sideline; + grid-row: 2 / 3; + min-width:180px; + order:3; + padding-left: 2em; + padding-right: 2em; +} + +main section.header { + color:#555; + font-size:0.8rem; + grid-column: 2 / 3; + grid-row: 1 / 2; + max-width: 50rem; + padding-bottom: .5rem; +} + +main.article article p:first-child { + margin-top: 0; +} + +main.article article > p:first-child::first-letter { + float: left; + font-size: 500%; +/* font-style: italic;*/ + height: 1rem; + line-height: 1rem; + margin: 0px; + padding: 0 .05em 0 0; + text-shadow: #d9d4d4 .05em .05em; +} + +.logo a { + font-size: 3.5rem; + color:#131516; + font-weight:bold; + text-decoration:none; +} +/* +.sidenote-left, .sidenote-right { + display: inline-block; + width: 48%; + margin-top: 0; + margin-bottom: 0; + font-size: 7pt; + line-height: 1.3; + vertical-align: baseline; +} +*/ + +code { + font-weight: 800; + color: #006266; +} + +kbd.□.▭ { + width: auto; + font-weight: 800; + padding: 13px 5px; + /* box-shadow: 2px 3px #8e897a; */ + box-shadow: 3px 5px #8e897a, 2px 0px 2px -1px inset #bbb, -1px 0px 2px -1px inset #bbb, -2px 3px #8e897a, -3px 5px #8e897a, 3px 5px #8e897a, -2px 3px #8e897a, 2px 3px #8e897a, 2px 3px #8e897a; + margin-bottom:4px; + margin-right:4px; +} + +kbd.□.▭:active { + box-shadow: 1px 0px 1px #c1c0c0 inset,-1px 0px 1px #c1c0c0 inset, -3px 3px #a29b9b, 3px 3px #a29b9b, -2px 2px #a29b9b, 2px 2px #a29b9b, -1px 1px #a29b9b, 1px 1px #a29b9b; + top: 3px; + position: relative; +} + +kbd.□:active { + color: black; + box-shadow: 1px 1px 0px #ddd inset; + top: 1px; + position: relative; +} + +kbd.□ { + font-weight: 800; + border: 1px solid #cecece; + background: #f7f7e7; + /* box-shadow: 2px 1px #8e897a;*/ + box-shadow: 1px 3px darkgray, -1px 3px darkgray, 1px 2px darkgray, -1px 2px darkgray; + border-radius: 3px; + display: inline-block; + font-size: .85em; + line-height: 1; + padding: 2px 4px; + white-space: nowrap; + user-select: none; + cursor:pointer; +} + +/* for keys that aren't entirely square */ +.thin-kbd.□.▭ { + padding-right: 7px; + padding-left: 8px; +} + +.sourceCode code { + font-weight: 300; +} + +@media (min-width:320px) { + #bee-emoji-svg, #bee-emoji-svg::before, .logo:hover, .logo:hover::after { + display: none; + } + body { + width:90%; + margin:0; + padding:0 5%; + } + header { + margin:1.7rem 0 2.0rem 0; + } + footer { + text-align:center; + } + .logo a { + font-size:3.5rem; + } + header nav { + padding-bottom: .7rem; + } + header nav a { + display:inline; + margin:0 0.6rem; + font-size:1.3rem; + } + .screenshots { + flex-direction: column; + } +} +@media (min-width:1140px) { + main { + z-index: 1; + padding:0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .screenshots { + flex-direction: row; + } +} + + + +img.fit { + width: 100%; + height: auto; + object-fit: cover; +} + +img.full-width { + width: 100%; + height: auto; + object-fit: cover; +} + +.fit-right { + margin-left: 10%; +} +.fit-left { + margin-right: 10%; +} + +.logo { + margin: auto auto 0 0; +} + +.logo-img { + width: 100%; + height: auto; + object-fit: cover; +} + +figure { + margin: 0 1.2rem 1.2rem 0; +} + +.bold { + font-weight: 800; +} + +figcaption { + font-size: 8pt; + color: #5b5e60; + background: #f6f6f6; + border: 1px solid #ededed; + border-radius: 0 0 2px 2px; + width: calc(98% - 2px); + margin-top: -3px; + padding-bottom: 7px; + padding-left: 2%; + padding-top: 5px; +} + +figcaption a { + text-decoration: inherit; + color: inherit; +} + +figcaption a:visited { + color: inherit; +} + +/* Index styling */ +.wrapper { + display: grid; + grid-auto-columns: minmax(100px, auto); + grid-gap: 10px; + grid-auto-rows: minmax(100px, auto); +} + +.wrapper h2 { + border-bottom: 2px inset #000; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + padding-left: .5rem; + padding-right: .5rem; + border-top: 1px solid #b2b2b2; + padding: .5rem; + border-radius: 2px; + background: white; +} +@media (max-width:1280px) { +.wrapper > *:first-child { + display: flex; + flex-wrap: wrap; + grid-column: 1; + grid-row: 1 / 1; +} +section.index-intro { + width: 100vw; +} + +section.index-intro, section.index-install, section.index-build, section.index-features, section-announcements { + border-bottom: 2px solid #6c6e6f; + min-width: 100%; + margin-bottom: 10px; +} +} + +@media (min-width:1280px) { +.wrapper > *:first-child { + display: grid; + grid-column: 1; + grid-row: 1 / 1; + grid-template-areas: + "term term install install" + "term term features build" + "screenshots screenshots features announcements" + "screenshots screenshots features announcements"; + grid-column-gap: 4rem; +} + +section.index-install ol { + margin-bottom: 0px; +} + +section.index-install, section.index-build { + margin-bottom: 20px; +} + +section.index-intro { + width: 45vw; +} +} + +section h1 { + font-size: 1.21rem; + font-variant-caps: normal; + margin-top: 0px; +} + +h1 { + border-bottom: 2px inset #000; + max-width: max-content; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + padding-left: .5rem; + padding-right: .5rem; + border-top: 1px solid #b2b2b2; + padding: .5rem; + border-radius: 2px; + background: white; +} + +section.index-intro { + grid-area:term; +} + +section.index-features { + grid-area: features; +} + +section.index-install { + grid-area: install; +} + +section.index-build { + grid-area: build; +} + +section.index-announcements { + grid-area: announcements; +} + + +ul.index-announcement-list { + padding-left: 0px; +} + +section.index-install > h2 { + margin-bottom: 0; + +} + + +section.index-install details > summary { + display: inline-block; + margin: .4rem auto; + padding: .2rem; + background: #d7d7d7; + border: 3px double white; + color: #56BAE6; +} + +section.index-install details > summary::after { + content: " (help) "; + color: #03186a; + font-size: .6rem; + cursor: pointer; +} + +section.index-install details > summary > code { + color: #014446; + font-size: 119%; +} + +.index-screenshots { + display:flex; + flex-wrap: wrap; + grid-area: screenshots; +} + +.index-screenshots > * { + flex: initial; +} + +.index-screenshots a { +height: 100%; +} + +.index-screenshots img { + object-fit: contain; + width: 100%; + height:inherit; + background: #444; +} +/* Index styling end */ + + + + + + + +/* lightbox */ + + + + +/*Eliminates padding, centers the thumbnail */ + +/* Styles the lightbox, removes it from sight and adds the fade-in transition */ + +figure:not(.lightbox-target) { + display: flex; + flex-direction: column; +} +.lightbox-target { + z-index:5; + pointer-events: none; + position: absolute; + top: 0; + left:0; + right:0; + bottom: 0; + width: 100%; + height: 100%; + opacity: 0; + /* overflow: hidden; */ + overflow-x: scroll; + + padding: 0; + text-align: center; + margin:0; +} + + +/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */ + +.lightbox-target img { + margin: auto; + max-height: 0%; + max-width: 0%; + border: 3px solid white; + box-shadow: 0px 0px 8px rgba(0,0,0,.3); + box-sizing: border-box; + z-index: 2; +} + +.lightbox-target figcaption { + margin: auto; + padding: 18px; + color: #5b5e60; + background: #f6f6f6; + border: 3px solid #ededed; + z-index: 3; + font-size: 2rem; + pointer-events: none; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + width: auto; + height: min-content; +} + +/* Styles the close link, adds the slide down transition */ + +a.lightbox-close { + width:50px; + height:50px; + color: white; + opacity: 1; + text-decoration: none; + pointer-events: auto; + z-index: 4; + font-size: 2.5rem; +} + +/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */ + +.lightbox-target:target { + opacity: 1; + top: 0; + bottom: 0; +} + +.lightbox-target:target img { + max-height: 80vh; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + height: auto; + width: auto; +} + +.lightbox-target:target a.lightbox-close { +top: 0px; +} + + +/* IBM's colorblind safe palette */ + +.cornflower-blue { + color: #648FFF; +} + +.purple { + color: #785EF0; +} + +.cerise { + color: #DC267F; +} + +.blaze-orange { + color: #FE6100; +} + +.amber { + color: #FFB000; +} + + +.dull-red { + color: #CC6677; +} + +.cyan { + color: #44AA99; +} + +.green { + color: #117733; +} + +.float_left_img { + max-width: 25%; + min-width: 5vw; + float:left; + padding: .4em; +} + + +div.mandoc { + max-width: 100vw; + min-width: 100vw; +} + +nav.nav-doc { + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + border: 1px solid black; + padding: .4rem 1rem .4rem 2rem; + background: white; + box-shadow: 5px 5px darkgrey; +} + +nav.nav-doc ul { +list-style: square; +} + +article.article-doc { + max-width: 43rem; + background: white; +} + +.screenshots-page { + display: flex; + flex-wrap: wrap; +} + +.screenshots-page > * { + flex: 1 0 30%; + min-width: 200px; +} + +.screenshots-page > figure > a { + height: 100%; + background: #1c1c1c; +} +.screenshots-page > figure > a > img { + height: inherit; + width: 100%; + object-fit: contain; + background: #444; +} + +.screenshots-page > figure:not(.lightbox-target):nth-child(odd) > a > img { + background-color: #cccccc; + background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23b9b9b9' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E"); +} + +code.Nm::after { + content: " 🐝"; + filter: hue-rotate(170deg) grayscale(42%); +} + + +/* Documentation */ + +span.notice-info { + padding: .5rem; + border: 2px dashed grey; + margin-bottom: 15px; + background: white; + display: inline-block; +} + + + +/*! * * * * * * * * * * * * * * * * * * * *\ + CSShake :: shake-little + v1.5.0 + CSS classes to move your DOM + (c) 2015 @elrumordelaluz + http://elrumordelaluz.github.io/csshake/ + Licensed under MIT +\* * * * * * * * * * * * * * * * * * * * */ +code.Nm::after { + display: inline-block; + transform-origin: center center; } + +.shake-freeze, +.shake-constant.shake-constant--hover:hover, +.shake-trigger:hover .shake-constant.shake-constant--hover { + animation-play-state: paused; } + +.shake-freeze:hover, +.shake-trigger:hover .shake-freeze, code.Nm:hover::after, +.shake-trigger:hover code.Nm::after { + animation-play-state: running; } + +@keyframes shake-little { + 2% { + transform: translate(0px, 1px) rotate(0.5deg); } + 4% { + transform: translate(0px, 1px) rotate(0.5deg); } + 6% { + transform: translate(1px, 1px) rotate(0.5deg); } + 8% { + transform: translate(0px, 0px) rotate(0.5deg); } + 10% { + transform: translate(1px, 0px) rotate(0.5deg); } + 12% { + transform: translate(1px, 1px) rotate(0.5deg); } + 14% { + transform: translate(0px, 0px) rotate(0.5deg); } + 16% { + transform: translate(1px, 0px) rotate(0.5deg); } + 18% { + transform: translate(0px, 1px) rotate(0.5deg); } + 20% { + transform: translate(0px, 1px) rotate(0.5deg); } + 22% { + transform: translate(1px, 1px) rotate(0.5deg); } + 24% { + transform: translate(0px, 1px) rotate(0.5deg); } + 26% { + transform: translate(0px, 0px) rotate(0.5deg); } + 28% { + transform: translate(1px, 0px) rotate(0.5deg); } + 30% { + transform: translate(1px, 0px) rotate(0.5deg); } + 32% { + transform: translate(0px, 1px) rotate(0.5deg); } + 34% { + transform: translate(0px, 1px) rotate(0.5deg); } + 36% { + transform: translate(0px, 0px) rotate(0.5deg); } + 38% { + transform: translate(1px, 1px) rotate(0.5deg); } + 40% { + transform: translate(1px, 0px) rotate(0.5deg); } + 42% { + transform: translate(0px, 1px) rotate(0.5deg); } + 44% { + transform: translate(0px, 1px) rotate(0.5deg); } + 46% { + transform: translate(0px, 0px) rotate(0.5deg); } + 48% { + transform: translate(0px, 1px) rotate(0.5deg); } + 50% { + transform: translate(0px, 1px) rotate(0.5deg); } + 52% { + transform: translate(1px, 1px) rotate(0.5deg); } + 54% { + transform: translate(0px, 0px) rotate(0.5deg); } + 56% { + transform: translate(0px, 0px) rotate(0.5deg); } + 58% { + transform: translate(0px, 0px) rotate(0.5deg); } + 60% { + transform: translate(0px, 1px) rotate(0.5deg); } + 62% { + transform: translate(0px, 0px) rotate(0.5deg); } + 64% { + transform: translate(1px, 0px) rotate(0.5deg); } + 66% { + transform: translate(0px, 1px) rotate(0.5deg); } + 68% { + transform: translate(0px, 0px) rotate(0.5deg); } + 70% { + transform: translate(1px, 1px) rotate(0.5deg); } + 72% { + transform: translate(1px, 0px) rotate(0.5deg); } + 74% { + transform: translate(0px, 1px) rotate(0.5deg); } + 76% { + transform: translate(0px, 1px) rotate(0.5deg); } + 78% { + transform: translate(1px, 0px) rotate(0.5deg); } + 80% { + transform: translate(1px, 0px) rotate(0.5deg); } + 82% { + transform: translate(0px, 0px) rotate(0.5deg); } + 84% { + transform: translate(1px, 0px) rotate(0.5deg); } + 86% { + transform: translate(0px, 0px) rotate(0.5deg); } + 88% { + transform: translate(0px, 0px) rotate(0.5deg); } + 90% { + transform: translate(1px, 1px) rotate(0.5deg); } + 92% { + transform: translate(1px, 1px) rotate(0.5deg); } + 94% { + transform: translate(1px, 0px) rotate(0.5deg); } + 96% { + transform: translate(1px, 0px) rotate(0.5deg); } + 98% { + transform: translate(0px, 0px) rotate(0.5deg); } + 0%, 100% { + transform: translate(0, 0) rotate(0); } } + +code.Nm:hover::after, +.shake-trigger:hover code.Nm::after, .shake-little.shake-freeze, .shake-little.shake-constant { + animation-name: shake-little; + animation-duration: 100ms; + animation-timing-function: ease-in-out; + animation-iteration-count: infinite; +} + +#bee-emoji-svg:hover::before, +.shake-trigger:hover .shake-little.shake-freeze, .shake-little.shake-constant { + animation: shake-little 50ms ease-in-out running 120, harvest 10s 5500ms running steps(8, jump-both) infinite; +} + + + .logo::after { + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} +.logo:hover::after { + content: "🌸"; + height: 3.5rem; + width: 3.5rem; + font-size: 2rem; + position: relative; + right: 3rem; + z-index: -1; + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg:hover::before { + transform: translateY(26px) scale(.5); + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg::before { + content: " "; + filter: hue-rotate(170deg) grayscale(42%); + background-image: url('data:image/svg+xml,%3Csvg enable-background="new 0 0 47.5 47.5" version="1.1" viewBox="0 0 47.5 47.5" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="c"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3CclipPath id="b"%3E%3Cpath d="m8.719 17c0-6.133 4.603-13 10.281-13 5.679 0 10.281 6.867 10.281 13s-4.602 8.923-10.281 8.923c-5.678 0-10.281-2.79-10.281-8.923"/%3E%3C/clipPath%3E%3CclipPath id="a"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform="matrix(1.25,0,0,-1.25,0,47.5)"%3E%3Cg clip-path="url(%23c)"%3E%3Cg transform="translate(20,4)"%3E%3Cpath d="m0 0c0-1.657-0.447-3-1-3-0.552 0-1 1.343-1 3s0.448 3 1 3c0.553 0 1-1.343 1-3" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(26.753 35.753)"%3E%3Cpath d="m0 0c-0.586 0.586-1.693 0.428-2.475-0.354-0.611-0.611-1.948-2.53-2.222-3.619-0.884 0.195-1.93 0.22-3.056 0.22-1.125 0-2.172-0.025-3.055-0.219-0.275 1.089-1.611 3.007-2.223 3.618-0.781 0.782-1.888 0.94-2.474 0.354s-0.428-1.693 0.353-2.475c0.511-0.51 1.937-1.529 3.027-2.011-0.82-0.533-1.315-1.451-1.315-3.032 0-3.589 2.546-7.312 5.687-7.312 3.142 0 5.688 3.723 5.688 7.312 0 1.581-0.496 2.499-1.316 3.032 1.091 0.482 2.517 1.5 3.027 2.011 0.782 0.782 0.94 1.889 0.354 2.475" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(29.281 17)"%3E%3Cpath d="m0 0c0-6.134-4.603-13-10.281-13s-10.281 6.866-10.281 13c0 6.133 4.603 8.923 10.281 8.923s10.281-2.79 10.281-8.923" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23b)"%3E%3Cpath d="m30 18h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 10h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 2h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647-7.858-10-12-10s-6 5.354-6 8 1.858 1.584 6 1.584c4.143 0 12 3.061 12 0.416" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647 7.857-10 12-10s6 5.354 6 8-1.857 1.584-6 1.584-12 3.061-12 0.416" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23a)"%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647-7.858-8.584-12-8.584s-6 2.443-6 5.089 1.858 4.495 6 4.495c4.143 0 12 1.645 12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647 7.857-8.584 12-8.584s6 2.443 6 5.089-1.857 4.495-6 4.495-12 1.645-12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(3,18)"%3E%3Cpath d="m0 0c-0.552 0-1 0.447-1 1 0 0.551 0.446 0.999 0.998 1 0.048 0 4.948 0.07 13.596 3.914 0.505 0.227 1.095-2e-3 1.32-0.508 0.224-0.505-3e-3 -1.095-0.508-1.32-9.089-4.039-14.193-4.086-14.406-4.086" fill="%2399aab5"/%3E%3C/g%3E%3Cg transform="translate(35,18)"%3E%3Cpath d="m 0,0 c -0.213,0 -5.316,0.047 -14.406,4.086 -0.505,0.225 -0.732,0.815 -0.508,1.32 0.225,0.505 0.817,0.732 1.32,0.508 C -4.946,2.07 -0.046,2 0.003,2 0.554,1.997 1,1.548 0.999,0.997 0.997,0.446 0.551,0 0,0" fill="%2399aab5"/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A'); + background-repeat: no-repeat; + height: 3.5rem; + width: 3.5rem; + + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); + } +#bee-emoji-svg { + + height: 3.5rem; + width: 3.5rem; + /* cursor: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="25px" height="25px"%3E%3Cpath fill="%2377B255" d="M28.938 27.441c-2.554-.89-8.111-.429-9.938 1.331V17c0-.553-.447-1-1-1s-1 .447-1 1v11.772c-1.827-1.76-7.384-2.221-9.938-1.331-.741.259 5.264 8.749 9.507 4.507.168-.168.306-.33.431-.49V35c0 .553.447 1 1 1s1-.447 1-1v-3.542c.125.16.263.322.431.49 4.243 4.242 10.248-4.248 9.507-4.507z"/%3E%3Cpath fill="%23CCD6DD" d="M12.562 25.65c-.619-.266-1.107-.837-1.378-1.513l-1.266-3.306-3.258-1.393c-1.336-.574-1.876-1.922-1.304-3.259l1.362-3.181-1.364-3.269c-.541-1.35.15-2.868 1.5-3.408l3.272-1.281 1.449-3.384C12.148.32 13.496-.22 14.833.352l3.258 1.396L21.358.382c.675-.271 1.411-.276 2.03-.011.619.265 1.114.819 1.385 1.494l1.274 3.29 3.309 1.417c1.336.572 1.875 1.921 1.305 3.258l-1.451 3.384 1.365 3.267c.541 1.35-.15 2.866-1.5 3.407l-3.271 1.281-1.363 3.183c-.572 1.336-1.922 1.877-3.258 1.305l-3.308-1.417-3.267 1.364c-.676.271-1.427.311-2.046.046z"/%3E%3Cpath fill="%23E1E8ED" d="M29.356 6.572l-3.309-1.417-.055-.143c-1.565 1.337-5.215 4.354-5.215 4.354l.007.123C20.015 8.879 19.057 8.5 18 8.5V1.709L14.833.353c-1.337-.572-2.685-.032-3.258 1.304l-1.449 3.384-.061.024 4.753 4.754c-.814.813-1.318 1.938-1.318 3.181H6.717l-1.361 3.178c-.572 1.337-.032 2.686 1.304 3.259l3.258 1.394.002.006 4.496-5.142c.822 1.09 2.115 1.805 3.584 1.805h.005c.006 1.979.015 5.273.012 6.801l3.164 1.356c1.336.572 2.686.031 3.258-1.305l1.362-3.18-5.192-4.517c1.14-.816 1.89-2.145 1.89-3.654 0-.071-.018-.137-.021-.208 1.802.182 4.951.472 6.822.642l-.092-.22L30.66 9.83c.571-1.337.031-2.686-1.304-3.258z"/%3E%3Ccircle fill="%23F4900C" cx="18" cy="13" r="5"/%3E%3C/svg%3E'), auto;*/ +} + + +.sakura { + opacity: 0; + position: fixed; +} +.envelope { + filter: grayscale(); + opacity: 0; + position: fixed; +} +#bee-emoji-svg:hover .sakuraA, .sakuraA:hover { + opacity: 1; + animation-name: none; + transition: opacity 0.01s linear; + font-size:1em; +} + +#bee-emoji-svg:hover #envelopeA, #envelopeA:hover { + animation-name: envelope-flyA; + animation-delay: 3.5s; +} +#bee-emoji-svg:hover #envelopeB, #envelopeB:hover { + animation-name: envelope-flyB; + animation-delay: 3.55s; +margin-top:2rem; +} +#bee-emoji-svg:hover #envelopeC, #envelopeC:hover { + animation-name: envelope-flyC; + animation-delay: 3.6s; +margin-top:3rem; +} +#bee-emoji-svg:hover #envelopeD, #envelopeD:hover { + animation-name: envelope-flyD; + animation-delay: 3.65s; +margin-top:2rem; +} +#bee-emoji-svg:hover .envelope, .envelope:hover { + animation-duration: 1s; + animation-timing-function: linear; + animation-iteration-count: 1; + animation-play-state: running; + font-size:2em; +} + +@keyframes envelope-flyA { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(-45deg); + } + 20% { + transform: translate(15px, -15px) rotate(-45deg); + } + 40% { + transform: translate(30px, -30px) rotate(-45deg); + opacity: .4; + } + 60% { + transform: translate(45px, -45px) rotate(-45deg); + opacity: .1; + } + 80% { + transform: translate(60px, -60px) rotate(-45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyB { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(45deg); + } + 20% { + transform: translate(15px, 15px) rotate(45deg); + } + 40% { + transform: translate(30px, 30px) rotate(45deg); + opacity: .4; + } + 60% { + transform: translate(45px, 45px) rotate(45deg); + opacity: .1; + } + 80% { + transform: translate(60px, 60px) rotate(45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyC { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(60deg); + } + 20% { + transform: translate(15px, 30px) rotate(60deg); + } + 40% { + transform: translate(30px, 60px) rotate(60deg); + opacity: .4; + } + 60% { + transform: translate(45px, 90px) rotate(60deg); + opacity: .1; + } + 80% { + transform: translate(60px, 120px) rotate(60deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyD { + 0% { +opacity: 1; + transform: translate(0, 0); + } + 20% { + transform: translate(15px, 0); + } + 40% { + transform: translate(30px, 0); + opacity: .4; + } + 60% { + transform: translate(45px, 0); + opacity: .1; + } + 80% { + transform: translate(80px, 0); + opacity: 0; + } + 100% { + opacity: 0; + } + +} + +@keyframes harvest { + 0% { + transform: rotate(5deg) translateY(3px) translateX(3px); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(7px) rotate(12deg); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(4px) rotate(12deg); + transition: transform linear; + } + 60% { + transform: translateY(3px) rotate(12deg); + transition: transform linear; + } + 70% { + transform: translateY(3px) rotate(10deg); + transition: transform linear; + } + 80% { + transform: translateY(3px) translateX(2px) rotate(7deg); + transition: transform linear; + } + 100% { + transform: translate(3px, 3px) rotate(5deg); } +} + + +.xterm_title { + background: #22AA99; + color: white; + font-size: .8rem; + padding: 0.3em; + padding-left: 2px; + padding-right: 2px; + width: auto; + border: 1px ridge black; + border-top-left-radius: 2px; + border-top-right-radius: 2px; + border-bottom:0px; + margin-bottom:0px; + min-width: inherit; + + display: grid; + grid-template-columns: [symbol] 40px [title] 1fr [buttons]; + grid-template-rows: auto; +} + .xterm { + overflow: hidden; + font-size: 12px; + direction: ltr; + text-align: left; + background: #22AA99; + padding: 1px; + border: 1px solid black; + width: inherit; + + max-width: min-content; + min-width: min-content; +} + +.xterm-title { + grid-column: title; + grid-row: 1 / 1; + font-weight:800; + margin-top: 3px; +} + +.xterm-symbol { + cursor:pointer; + grid-column: symbol; + grid-row: 1 / 1; + font-size: 1rem; + line-height: initial; + padding-left: 2px; + padding-right: 0px; + border-right: 3px double #cbebe7; + margin-right: 13px; + margin-left: 4px; +} +#main_svg { + max-width: 85vw; + width: inherit; + border: 1px solid black; +} diff --git a/css/default_tmp.css b/css/default_tmp.css new file mode 100644 index 0000000..02999bc --- /dev/null +++ b/css/default_tmp.css @@ -0,0 +1,1077 @@ +@font-face { + font-family: 'dejavu_sans_monobook'; + src: local("DejaVu Sans Mono"), + url('/css/dejavusansmono-webfont.woff2') format('woff2'), + url('/css/dejavusansmono-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + + +html { + font-size:100%; + font-family:"dejavu_sans_monobook", monospace; +} +body { + font-size:.80rem; + color: #151515; +/* color: #202020; */ +/* color: #404040;*/ + background: radial-gradient(circle farthest-side at 0% 50%,#FFF 23.5%,rgba(240,166,17,0) 0)21px 30px, radial-gradient(circle farthest-side at 0% 50%,#f8f8f8 24%,rgba(240,166,17,0) 0)19px 30px, linear-gradient(#FFF 14%,rgba(240,166,17,0) 0, rgba(240,166,17,0) 85%,#FFF 0)0 0, linear-gradient(150deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(30deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(90deg,#f8f8f8 2%,#FFF 0,#FFF 98%,#f8f8f8 0%)0 0 #FFF; + background-size: 40px 60px; +} + +a:visited { + color: #404040; +} +header { + border-bottom:1px solid #969595; + display: flex; + justify-content: space-between; +} +header nav { + margin: auto 0 0 auto; + text-align:right; +} +header nav a { + font-size:1.3rem; + font-weight:bold; + text-transform:uppercase; +} +footer { + margin-top:3rem; + padding:.5rem 0 1.2rem 0; + border-top:1px solid #969595; + font-size:.8rem; + color:#555; +} +h1 { + font-variant-caps: small-caps; +} +h2 { + font-variant-caps: small-caps; +} + +h3 { + font-style: italic; + font-variant-caps: small-caps; + font-weight: 100; + } + +h1.title{ + margin-bottom: 4px; + padding: .7rem; +} + +ul { + list-style: circle; + padding-left: 0px; + list-style-position: inside; +} + +li ul { + padding-left: 1.2rem; +} + +li { + line-height: 1.5; +} + +.subtitle { + /* Add extra padding to align with the title above */ + padding-left:.7rem; +} + +/* Article/posts styling */ +main.article { + display: flex; + flex-direction: column; + min-height: 100vh; + width: 100%; + margin:0 0; +} + +main.article article > :first-child { + /* header div already has padding-bottom */ + margin-top: 0; + padding-top: 0; +} + +main.article .title { + border-bottom: double 3px #d5d5d5; + border-left: double 3px #d5d5d5; + border-radius: 6px; + background-color: #a9a9a924; + +} + +@media (min-width: 1280px) { + #bee-emoji-svg, #bee-emoji-svg::before { + display: inline-block !important; + } + .logo:hover, .logo:hover::after { + display: inline !important; + } + article { + width: 43rem; + } + main { + z-index: 1; + min-width: 78rem; + margin:0 auto; + padding:0; + } + header { + margin:2.0rem 0 3.5rem 3rem; + padding:0.2rem 0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .logo { + text-align:left; + } + .logo a { + font-size:6rem; + } + img.fit { + width: 100%; + height: auto; + object-fit: cover; + } + main.article { + display: grid; + grid-template-columns: [left-sideline] auto [body] auto [right-sideline] auto; + grid-column-gap: 10px; + grid-row-gap: 3px; + grid-auto-rows: auto; + } + + main.article article { + padding-right: 4rem; + } +} + +main.article div.left { + grid-column: left-sideline; + grid-row: 2 / 3; + min-width:180px; + order: 2; + padding-left: 2em; + padding-right: 2em; +} + +main.article article { + line-height: 1.4; + text-decoration-color: #0000001a; + grid-column: body; + grid-row: 2 / 3; + order:1; + max-width: 41rem; +} + +main.article div.right { + grid-column: right-sideline; + grid-row: 2 / 3; + min-width:180px; + order:3; + padding-left: 2em; + padding-right: 2em; +} + +main section.header { + color:#555; + font-size:0.8rem; + grid-column: 2 / 3; + grid-row: 1 / 2; + max-width: 50rem; + padding-bottom: .5rem; +} + +main.article article p:first-child { + margin-top: 0; +} + +main.article article > p:first-child::first-letter { + float: left; + font-size: 500%; +/* font-style: italic;*/ + height: 1rem; + line-height: 1rem; + margin: 0px; + padding: 0 .05em 0 0; + text-shadow: #d9d4d4 .05em .05em; +} + +.logo a { + font-size: 3.5rem; + color:#131516; + font-weight:bold; + text-decoration:none; +} +/* +.sidenote-left, .sidenote-right { + display: inline-block; + width: 48%; + margin-top: 0; + margin-bottom: 0; + font-size: 7pt; + line-height: 1.3; + vertical-align: baseline; +} +*/ + +code { + font-weight: 800; + color: #006266; +} + +kbd.□.▭ { + width: auto; + font-weight: 800; + padding: 13px 5px; + /* box-shadow: 2px 3px #8e897a; */ + box-shadow: 3px 5px #8e897a, 2px 0px 2px -1px inset #bbb, -1px 0px 2px -1px inset #bbb, -2px 3px #8e897a, -3px 5px #8e897a, 3px 5px #8e897a, -2px 3px #8e897a, 2px 3px #8e897a, 2px 3px #8e897a; + margin-bottom:4px; + margin-right:4px; +} + +kbd.□.▭:active { + box-shadow: 1px 0px 1px #c1c0c0 inset,-1px 0px 1px #c1c0c0 inset, -3px 3px #a29b9b, 3px 3px #a29b9b, -2px 2px #a29b9b, 2px 2px #a29b9b, -1px 1px #a29b9b, 1px 1px #a29b9b; + top: 3px; + position: relative; +} + +kbd.□:active { + color: black; + box-shadow: 1px 1px 0px #ddd inset; + top: 1px; + position: relative; +} + +kbd.□ { + font-weight: 800; + border: 1px solid #cecece; + background: #f7f7e7; + /* box-shadow: 2px 1px #8e897a;*/ + box-shadow: 1px 3px darkgray, -1px 3px darkgray, 1px 2px darkgray, -1px 2px darkgray; + border-radius: 3px; + display: inline-block; + font-size: .85em; + line-height: 1; + padding: 2px 4px; + white-space: nowrap; + user-select: none; + cursor:pointer; +} + +/* for keys that aren't entirely square */ +.thin-kbd.□.▭ { + padding-right: 7px; + padding-left: 8px; +} + +.sourceCode code { + font-weight: 300; +} + +@media (min-width:320px) { + #bee-emoji-svg, #bee-emoji-svg::before, .logo:hover, .logo:hover::after { + display: none; + } + body { + width:90%; + margin:0; + padding:0 5%; + } + header { + margin:1.7rem 0 2.0rem 0; + } + footer { + text-align:center; + } + .logo a { + font-size:3.5rem; + } + header nav { + padding-bottom: .7rem; + } + header nav a { + display:inline; + margin:0 0.6rem; + font-size:1.3rem; + } + .screenshots { + flex-direction: column; + } +} +@media (min-width:1140px) { + main { + z-index: 1; + padding:0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .screenshots { + flex-direction: row; + } +} + + + +img.fit { + width: 100%; + height: auto; + object-fit: cover; +} + +img.full-width { + width: 100%; + height: auto; + object-fit: cover; +} + +.fit-right { + margin-left: 10%; +} +.fit-left { + margin-right: 10%; +} + +.logo { + margin: auto auto 0 0; +} + +.logo-img { + width: 100%; + height: auto; + object-fit: cover; +} + +figure { + margin: 0 1.2rem 1.2rem 0; +} + +.bold { + font-weight: 800; +} + +figcaption { + font-size: 8pt; + color: #5b5e60; + background: #f6f6f6; + border: 1px solid #ededed; + border-radius: 0 0 2px 2px; + width: calc(98% - 2px); + margin-top: -3px; + padding-bottom: 7px; + padding-left: 2%; + padding-top: 5px; +} + +figcaption a { + text-decoration: inherit; + color: inherit; +} + +figcaption a:visited { + color: inherit; +} + +/* Index styling */ +.wrapper { + display: grid; + grid-auto-columns: minmax(100px, auto); + grid-gap: 10px; + grid-auto-rows: minmax(100px, auto); +} +.wrapper > section:first-child { + display: flex; + flex-flow: row; + grid-column: 1; + grid-row: 1 / 1; +} +.wrapper > section:first-child > * { + flex: 1 auto auto; +} + +section h1 { + font-size: 1.21rem; + font-variant-caps: normal; + margin-top: 0px; +} + +h1 { + border-bottom: 2px inset #000; + max-width: max-content; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + padding-left: .5rem; + padding-right: .5rem; + border-top: 1px solid #b2b2b2; + padding: .5rem; + border-radius: 2px; + background: white; +} + +section.index-intro { + flex: 0 50%; +} + +section.index-features { + flex: 0 50%; +} + + + +.screenshots { + grid-row: 2 / 2; + display:flex; + grid-column: 1; + margin-top: 1rem; +} +.screenshots > * { + flex: 0 50%; +} + +.screenshots a { +height: 100%; +} +.screenshots img { + object-fit: contain; + width: 100%; + height:inherit; + background: #444; + +} +ul.index-announcement-list { + padding-left: 0px; +} + +/* Index styling end */ + + + + + + + +/* lightbox */ + + + + +/*Eliminates padding, centers the thumbnail */ + +/* Styles the lightbox, removes it from sight and adds the fade-in transition */ + +figure:not(.lightbox-target) { + display: flex; + flex-direction: column; +} +.lightbox-target { + z-index:5; + pointer-events: none; + position: absolute; + top: 0; + left:0; + right:0; + bottom: 0; + width: 100%; + height: 100%; + opacity: 0; + /* overflow: hidden; */ + overflow-x: scroll; + + padding: 0; + text-align: center; + margin:0; +} + + +/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */ + +.lightbox-target img { + margin: auto; + max-height: 0%; + max-width: 0%; + border: 3px solid white; + box-shadow: 0px 0px 8px rgba(0,0,0,.3); + box-sizing: border-box; + z-index: 2; +} + +.lightbox-target figcaption { + margin: auto; + padding: 18px; + color: #5b5e60; + background: #f6f6f6; + border: 3px solid #ededed; + z-index: 3; + font-size: 2rem; + pointer-events: none; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + width: auto; + height: min-content; +} + +/* Styles the close link, adds the slide down transition */ + +a.lightbox-close { + width:50px; + height:50px; + color: white; + opacity: 1; + text-decoration: none; + pointer-events: auto; + z-index: 4; + font-size: 2.5rem; +} + +/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */ + +.lightbox-target:target { + opacity: 1; + top: 0; + bottom: 0; +} + +.lightbox-target:target img { + max-height: 80vh; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + height: auto; + width: auto; +} + +.lightbox-target:target a.lightbox-close { +top: 0px; +} + + +/* IBM's colorblind safe palette */ + +.cornflower-blue { + color: #648FFF; +} + +.purple { + color: #785EF0; +} + +.cerise { + color: #DC267F; +} + +.blaze-orange { + color: #FE6100; +} + +.amber { + color: #FFB000; +} + + +.dull-red { + color: #CC6677; +} + +.cyan { + color: #44AA99; +} + +.green { + color: #117733; +} + +.float_left_img { + max-width: 25%; + min-width: 5vw; + float:left; + padding: .4em; +} + + +div.mandoc { + max-width: 100vw; + min-width: 100vw; +} + +nav.nav-doc { + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + border: 1px solid black; + padding: .4rem 1rem .4rem 2rem; + background: white; + box-shadow: 5px 5px darkgrey; +} + +nav.nav-doc ul { +list-style: square; +} + +article.article-doc { + max-width: 43rem; + background: white; +} + +.screenshots-page { + display: flex; + flex-wrap: wrap; +} + +.screenshots-page > * { + flex: 1 0 30%; + min-width: 200px; +} + +.screenshots-page > figure > a { + height: 100%; + background: #1c1c1c; +} +.screenshots-page > figure > a > img { + height: inherit; + width: 100%; + object-fit: contain; + background: #444; +} + +.screenshots-page > figure:not(.lightbox-target):nth-child(odd) > a > img { + background-color: #cccccc; + background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23b9b9b9' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E"); +} + +code.Nm::after { + content: " 🐝"; + filter: hue-rotate(170deg) grayscale(42%); +} + + +/* Documentation */ + +span.notice-info { + padding: .5rem; + border: 2px dashed grey; + margin-bottom: 15px; + background: white; + display: inline-block; +} + + + +/*! * * * * * * * * * * * * * * * * * * * *\ + CSShake :: shake-little + v1.5.0 + CSS classes to move your DOM + (c) 2015 @elrumordelaluz + http://elrumordelaluz.github.io/csshake/ + Licensed under MIT +\* * * * * * * * * * * * * * * * * * * * */ +code.Nm::after { + display: inline-block; + transform-origin: center center; } + +.shake-freeze, +.shake-constant.shake-constant--hover:hover, +.shake-trigger:hover .shake-constant.shake-constant--hover { + animation-play-state: paused; } + +.shake-freeze:hover, +.shake-trigger:hover .shake-freeze, code.Nm:hover::after, +.shake-trigger:hover code.Nm::after { + animation-play-state: running; } + +@keyframes shake-little { + 2% { + transform: translate(0px, 1px) rotate(0.5deg); } + 4% { + transform: translate(0px, 1px) rotate(0.5deg); } + 6% { + transform: translate(1px, 1px) rotate(0.5deg); } + 8% { + transform: translate(0px, 0px) rotate(0.5deg); } + 10% { + transform: translate(1px, 0px) rotate(0.5deg); } + 12% { + transform: translate(1px, 1px) rotate(0.5deg); } + 14% { + transform: translate(0px, 0px) rotate(0.5deg); } + 16% { + transform: translate(1px, 0px) rotate(0.5deg); } + 18% { + transform: translate(0px, 1px) rotate(0.5deg); } + 20% { + transform: translate(0px, 1px) rotate(0.5deg); } + 22% { + transform: translate(1px, 1px) rotate(0.5deg); } + 24% { + transform: translate(0px, 1px) rotate(0.5deg); } + 26% { + transform: translate(0px, 0px) rotate(0.5deg); } + 28% { + transform: translate(1px, 0px) rotate(0.5deg); } + 30% { + transform: translate(1px, 0px) rotate(0.5deg); } + 32% { + transform: translate(0px, 1px) rotate(0.5deg); } + 34% { + transform: translate(0px, 1px) rotate(0.5deg); } + 36% { + transform: translate(0px, 0px) rotate(0.5deg); } + 38% { + transform: translate(1px, 1px) rotate(0.5deg); } + 40% { + transform: translate(1px, 0px) rotate(0.5deg); } + 42% { + transform: translate(0px, 1px) rotate(0.5deg); } + 44% { + transform: translate(0px, 1px) rotate(0.5deg); } + 46% { + transform: translate(0px, 0px) rotate(0.5deg); } + 48% { + transform: translate(0px, 1px) rotate(0.5deg); } + 50% { + transform: translate(0px, 1px) rotate(0.5deg); } + 52% { + transform: translate(1px, 1px) rotate(0.5deg); } + 54% { + transform: translate(0px, 0px) rotate(0.5deg); } + 56% { + transform: translate(0px, 0px) rotate(0.5deg); } + 58% { + transform: translate(0px, 0px) rotate(0.5deg); } + 60% { + transform: translate(0px, 1px) rotate(0.5deg); } + 62% { + transform: translate(0px, 0px) rotate(0.5deg); } + 64% { + transform: translate(1px, 0px) rotate(0.5deg); } + 66% { + transform: translate(0px, 1px) rotate(0.5deg); } + 68% { + transform: translate(0px, 0px) rotate(0.5deg); } + 70% { + transform: translate(1px, 1px) rotate(0.5deg); } + 72% { + transform: translate(1px, 0px) rotate(0.5deg); } + 74% { + transform: translate(0px, 1px) rotate(0.5deg); } + 76% { + transform: translate(0px, 1px) rotate(0.5deg); } + 78% { + transform: translate(1px, 0px) rotate(0.5deg); } + 80% { + transform: translate(1px, 0px) rotate(0.5deg); } + 82% { + transform: translate(0px, 0px) rotate(0.5deg); } + 84% { + transform: translate(1px, 0px) rotate(0.5deg); } + 86% { + transform: translate(0px, 0px) rotate(0.5deg); } + 88% { + transform: translate(0px, 0px) rotate(0.5deg); } + 90% { + transform: translate(1px, 1px) rotate(0.5deg); } + 92% { + transform: translate(1px, 1px) rotate(0.5deg); } + 94% { + transform: translate(1px, 0px) rotate(0.5deg); } + 96% { + transform: translate(1px, 0px) rotate(0.5deg); } + 98% { + transform: translate(0px, 0px) rotate(0.5deg); } + 0%, 100% { + transform: translate(0, 0) rotate(0); } } + +code.Nm:hover::after, +.shake-trigger:hover code.Nm::after, .shake-little.shake-freeze, .shake-little.shake-constant { + animation-name: shake-little; + animation-duration: 100ms; + animation-timing-function: ease-in-out; + animation-iteration-count: infinite; +} + +#bee-emoji-svg:hover::before, +.shake-trigger:hover .shake-little.shake-freeze, .shake-little.shake-constant { + animation: shake-little 50ms ease-in-out running 120, harvest 10s 5500ms running steps(8, jump-both) infinite; +} + + + .logo::after { + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} +.logo:hover::after { + content: "🌸"; + height: 3.5rem; + width: 3.5rem; + font-size: 2rem; + position: relative; + right: 3rem; + z-index: -1; + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg:hover::before { + transform: translateY(26px) scale(.5); + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg::before { + content: " "; + filter: hue-rotate(170deg) grayscale(42%); + background-image: url('data:image/svg+xml,%3Csvg enable-background="new 0 0 47.5 47.5" version="1.1" viewBox="0 0 47.5 47.5" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="c"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3CclipPath id="b"%3E%3Cpath d="m8.719 17c0-6.133 4.603-13 10.281-13 5.679 0 10.281 6.867 10.281 13s-4.602 8.923-10.281 8.923c-5.678 0-10.281-2.79-10.281-8.923"/%3E%3C/clipPath%3E%3CclipPath id="a"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform="matrix(1.25,0,0,-1.25,0,47.5)"%3E%3Cg clip-path="url(%23c)"%3E%3Cg transform="translate(20,4)"%3E%3Cpath d="m0 0c0-1.657-0.447-3-1-3-0.552 0-1 1.343-1 3s0.448 3 1 3c0.553 0 1-1.343 1-3" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(26.753 35.753)"%3E%3Cpath d="m0 0c-0.586 0.586-1.693 0.428-2.475-0.354-0.611-0.611-1.948-2.53-2.222-3.619-0.884 0.195-1.93 0.22-3.056 0.22-1.125 0-2.172-0.025-3.055-0.219-0.275 1.089-1.611 3.007-2.223 3.618-0.781 0.782-1.888 0.94-2.474 0.354s-0.428-1.693 0.353-2.475c0.511-0.51 1.937-1.529 3.027-2.011-0.82-0.533-1.315-1.451-1.315-3.032 0-3.589 2.546-7.312 5.687-7.312 3.142 0 5.688 3.723 5.688 7.312 0 1.581-0.496 2.499-1.316 3.032 1.091 0.482 2.517 1.5 3.027 2.011 0.782 0.782 0.94 1.889 0.354 2.475" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(29.281 17)"%3E%3Cpath d="m0 0c0-6.134-4.603-13-10.281-13s-10.281 6.866-10.281 13c0 6.133 4.603 8.923 10.281 8.923s10.281-2.79 10.281-8.923" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23b)"%3E%3Cpath d="m30 18h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 10h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 2h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647-7.858-10-12-10s-6 5.354-6 8 1.858 1.584 6 1.584c4.143 0 12 3.061 12 0.416" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647 7.857-10 12-10s6 5.354 6 8-1.857 1.584-6 1.584-12 3.061-12 0.416" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23a)"%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647-7.858-8.584-12-8.584s-6 2.443-6 5.089 1.858 4.495 6 4.495c4.143 0 12 1.645 12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647 7.857-8.584 12-8.584s6 2.443 6 5.089-1.857 4.495-6 4.495-12 1.645-12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(3,18)"%3E%3Cpath d="m0 0c-0.552 0-1 0.447-1 1 0 0.551 0.446 0.999 0.998 1 0.048 0 4.948 0.07 13.596 3.914 0.505 0.227 1.095-2e-3 1.32-0.508 0.224-0.505-3e-3 -1.095-0.508-1.32-9.089-4.039-14.193-4.086-14.406-4.086" fill="%2399aab5"/%3E%3C/g%3E%3Cg transform="translate(35,18)"%3E%3Cpath d="m 0,0 c -0.213,0 -5.316,0.047 -14.406,4.086 -0.505,0.225 -0.732,0.815 -0.508,1.32 0.225,0.505 0.817,0.732 1.32,0.508 C -4.946,2.07 -0.046,2 0.003,2 0.554,1.997 1,1.548 0.999,0.997 0.997,0.446 0.551,0 0,0" fill="%2399aab5"/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A'); + background-repeat: no-repeat; + height: 3.5rem; + width: 3.5rem; + + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); + } +#bee-emoji-svg { + + height: 3.5rem; + width: 3.5rem; + /* cursor: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="25px" height="25px"%3E%3Cpath fill="%2377B255" d="M28.938 27.441c-2.554-.89-8.111-.429-9.938 1.331V17c0-.553-.447-1-1-1s-1 .447-1 1v11.772c-1.827-1.76-7.384-2.221-9.938-1.331-.741.259 5.264 8.749 9.507 4.507.168-.168.306-.33.431-.49V35c0 .553.447 1 1 1s1-.447 1-1v-3.542c.125.16.263.322.431.49 4.243 4.242 10.248-4.248 9.507-4.507z"/%3E%3Cpath fill="%23CCD6DD" d="M12.562 25.65c-.619-.266-1.107-.837-1.378-1.513l-1.266-3.306-3.258-1.393c-1.336-.574-1.876-1.922-1.304-3.259l1.362-3.181-1.364-3.269c-.541-1.35.15-2.868 1.5-3.408l3.272-1.281 1.449-3.384C12.148.32 13.496-.22 14.833.352l3.258 1.396L21.358.382c.675-.271 1.411-.276 2.03-.011.619.265 1.114.819 1.385 1.494l1.274 3.29 3.309 1.417c1.336.572 1.875 1.921 1.305 3.258l-1.451 3.384 1.365 3.267c.541 1.35-.15 2.866-1.5 3.407l-3.271 1.281-1.363 3.183c-.572 1.336-1.922 1.877-3.258 1.305l-3.308-1.417-3.267 1.364c-.676.271-1.427.311-2.046.046z"/%3E%3Cpath fill="%23E1E8ED" d="M29.356 6.572l-3.309-1.417-.055-.143c-1.565 1.337-5.215 4.354-5.215 4.354l.007.123C20.015 8.879 19.057 8.5 18 8.5V1.709L14.833.353c-1.337-.572-2.685-.032-3.258 1.304l-1.449 3.384-.061.024 4.753 4.754c-.814.813-1.318 1.938-1.318 3.181H6.717l-1.361 3.178c-.572 1.337-.032 2.686 1.304 3.259l3.258 1.394.002.006 4.496-5.142c.822 1.09 2.115 1.805 3.584 1.805h.005c.006 1.979.015 5.273.012 6.801l3.164 1.356c1.336.572 2.686.031 3.258-1.305l1.362-3.18-5.192-4.517c1.14-.816 1.89-2.145 1.89-3.654 0-.071-.018-.137-.021-.208 1.802.182 4.951.472 6.822.642l-.092-.22L30.66 9.83c.571-1.337.031-2.686-1.304-3.258z"/%3E%3Ccircle fill="%23F4900C" cx="18" cy="13" r="5"/%3E%3C/svg%3E'), auto;*/ +} + + +.sakura { + opacity: 0; + position: fixed; +} +.envelope { + filter: grayscale(); + opacity: 0; + position: fixed; +} +#bee-emoji-svg:hover .sakuraA, .sakuraA:hover { + opacity: 1; + animation-name: none; + transition: opacity 0.01s linear; + font-size:1em; +} + +#bee-emoji-svg:hover #envelopeA, #envelopeA:hover { + animation-name: envelope-flyA; + animation-delay: 3.5s; +} +#bee-emoji-svg:hover #envelopeB, #envelopeB:hover { + animation-name: envelope-flyB; + animation-delay: 3.55s; +margin-top:2rem; +} +#bee-emoji-svg:hover #envelopeC, #envelopeC:hover { + animation-name: envelope-flyC; + animation-delay: 3.6s; +margin-top:3rem; +} +#bee-emoji-svg:hover #envelopeD, #envelopeD:hover { + animation-name: envelope-flyD; + animation-delay: 3.65s; +margin-top:2rem; +} +#bee-emoji-svg:hover .envelope, .envelope:hover { + animation-duration: 1s; + animation-timing-function: linear; + animation-iteration-count: 1; + animation-play-state: running; + font-size:2em; +} + +@keyframes envelope-flyA { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(-45deg); + } + 20% { + transform: translate(15px, -15px) rotate(-45deg); + } + 40% { + transform: translate(30px, -30px) rotate(-45deg); + opacity: .4; + } + 60% { + transform: translate(45px, -45px) rotate(-45deg); + opacity: .1; + } + 80% { + transform: translate(60px, -60px) rotate(-45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyB { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(45deg); + } + 20% { + transform: translate(15px, 15px) rotate(45deg); + } + 40% { + transform: translate(30px, 30px) rotate(45deg); + opacity: .4; + } + 60% { + transform: translate(45px, 45px) rotate(45deg); + opacity: .1; + } + 80% { + transform: translate(60px, 60px) rotate(45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyC { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(60deg); + } + 20% { + transform: translate(15px, 30px) rotate(60deg); + } + 40% { + transform: translate(30px, 60px) rotate(60deg); + opacity: .4; + } + 60% { + transform: translate(45px, 90px) rotate(60deg); + opacity: .1; + } + 80% { + transform: translate(60px, 120px) rotate(60deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyD { + 0% { +opacity: 1; + transform: translate(0, 0); + } + 20% { + transform: translate(15px, 0); + } + 40% { + transform: translate(30px, 0); + opacity: .4; + } + 60% { + transform: translate(45px, 0); + opacity: .1; + } + 80% { + transform: translate(80px, 0); + opacity: 0; + } + 100% { + opacity: 0; + } + +} + +@keyframes harvest { + 0% { + transform: rotate(5deg) translateY(3px) translateX(3px); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(7px) rotate(12deg); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(4px) rotate(12deg); + transition: transform linear; + } + 60% { + transform: translateY(3px) rotate(12deg); + transition: transform linear; + } + 70% { + transform: translateY(3px) rotate(10deg); + transition: transform linear; + } + 80% { + transform: translateY(3px) translateX(2px) rotate(7deg); + transition: transform linear; + } + 100% { + transform: translate(3px, 3px) rotate(5deg); } +} + + +.xterm_title { + background: #22AA99; + color: white; + font-size: .8rem; + padding: 0.3em; + padding-left: 2px; + padding-right: 2px; + width: auto; + border: 1px ridge black; + border-top-left-radius: 2px; + border-top-right-radius: 2px; + border-bottom:0px; + margin-bottom:0px; + min-width: inherit; + + display: grid; + grid-template-columns: [symbol] 40px [title] 1fr [buttons]; + grid-template-rows: auto; +} + .xterm { + overflow: hidden; + font: 12px, monospace; + direction: ltr; + text-align: left; + background: #22AA99; + padding: 1px; + border: 1px solid black; + + max-width: min-content; + min-width: min-content; +} + +.xterm-title { + grid-column: title; + grid-row: 1 / 1; + font-weight:800; + margin-top: 3px; +} + +.xterm-symbol { + cursor:pointer; + grid-column: symbol; + grid-row: 1 / 1; + font-size: 1rem; + line-height: initial; + padding-left: 2px; + padding-right: 0px; + border-right: 3px double #cbebe7; + margin-right: 13px; + margin-left: 4px; +} +#main_svg { +min-width: 600px;width: 30%; border: 1px solid black; +} diff --git a/css/dejavusansmono-webfont.woff b/css/dejavusansmono-webfont.woff new file mode 100644 index 0000000..7a737a1 Binary files /dev/null and b/css/dejavusansmono-webfont.woff differ diff --git a/css/dejavusansmono-webfont.woff2 b/css/dejavusansmono-webfont.woff2 new file mode 100644 index 0000000..37db1c3 Binary files /dev/null and b/css/dejavusansmono-webfont.woff2 differ diff --git a/css/flowercursor.svg b/css/flowercursor.svg new file mode 100644 index 0000000..0206662 --- /dev/null +++ b/css/flowercursor.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/css/flowercursor1.svg b/css/flowercursor1.svg new file mode 100644 index 0000000..bf88f37 --- /dev/null +++ b/css/flowercursor1.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/css/flowercursor2.svg b/css/flowercursor2.svg new file mode 100644 index 0000000..66dd2cf --- /dev/null +++ b/css/flowercursor2.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/css/flowercursor3.svg b/css/flowercursor3.svg new file mode 100644 index 0000000..fba7adb --- /dev/null +++ b/css/flowercursor3.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/css/flowercursor4.svg b/css/flowercursor4.svg new file mode 100644 index 0000000..aa47c14 --- /dev/null +++ b/css/flowercursor4.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/css/flowercursor5.svg b/css/flowercursor5.svg new file mode 100644 index 0000000..cae80a0 --- /dev/null +++ b/css/flowercursor5.svg @@ -0,0 +1,73 @@ + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/css/hex-grid.css b/css/hex-grid.css new file mode 100644 index 0000000..91e1d0a --- /dev/null +++ b/css/hex-grid.css @@ -0,0 +1,256 @@ +.hex-grid { + display: flex; + justify-content: center; } + .hex-grid__list { + --amount: 5; + position: relative; + padding: 0; + margin: 0; + list-style-type: none; + display: grid; + grid-template-columns: repeat(var(--amount), 1fr 2fr) 1fr; + grid-gap: 2.5rem 5rem; } + .hex-grid__item { + position: relative; + grid-column: 1 / span 3; + grid-row: calc(var(--counter) + var(--counter))/span 2; + filter: drop-shadow(0 0 10px rgba(68, 68, 68, 0.08)); + height: 0; + padding-bottom: 90%; } + .hex-grid__content { + position: absolute; + height: 100%; + width: 100%; + font-size: 1.125rem; + color: #111111; + background-color: white; + clip-path: polygon(75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%, 25% 0); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 2rem 25%; + text-decoration: none; + text-align: center; + transition: transform .24s ease-out; } + +@media screen and (min-width: 1440px) { + .hex-grid__list { + --amount: 5; + --counter: 1; } + .hex-grid__item:nth-of-type(5n + 1) { + grid-column: 1 / span 3; } + .hex-grid__item:nth-of-type(5n + 2) { + grid-column: 3 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(5n + 3) { + grid-column: 5 / span 3; } + .hex-grid__item:nth-of-type(5n + 4) { + grid-column: 7 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(5n + 5) { + grid-column: 9 / span 3; } + .hex-grid__item:nth-of-type(n + 6) { + --counter: 2; } + .hex-grid__item:nth-of-type(n + 11) { + --counter: 3; } + .hex-grid__item:nth-of-type(n + 16) { + --counter: 4; } + .hex-grid__item:nth-of-type(n + 21) { + --counter: 5; } + .hex-grid__item:nth-of-type(n + 26) { + --counter: 6; } + .hex-grid__item:nth-of-type(n + 31) { + --counter: 7; } + .hex-grid__item:nth-of-type(n + 36) { + --counter: 8; } + .hex-grid__item:nth-of-type(n + 41) { + --counter: 9; } + .hex-grid__item:nth-of-type(n + 46) { + --counter: 10; } + .hex-grid__item:nth-of-type(n + 51) { + --counter: 11; } + .hex-grid__item:nth-of-type(n + 56) { + --counter: 12; } + .hex-grid__item:nth-of-type(n + 61) { + --counter: 13; } + .hex-grid__item:nth-of-type(n + 66) { + --counter: 14; } + .hex-grid__item:nth-of-type(n + 71) { + --counter: 15; } + .hex-grid__item:nth-of-type(n + 76) { + --counter: 16; } + .hex-grid__item:nth-of-type(n + 81) { + --counter: 17; } + .hex-grid__item:nth-of-type(n + 86) { + --counter: 18; } + .hex-grid__item:nth-of-type(n + 91) { + --counter: 19; } + .hex-grid__item:nth-of-type(n + 96) { + --counter: 20; } + .hex-grid__item:nth-of-type(n + 101) { + --counter: 21; } } + +@media screen and (min-width: 1120px) and (max-width: 1439px) { + .hex-grid__list { + --amount: 4; + --counter: 1; } + .hex-grid__item:nth-of-type(4n + 1) { + grid-column: 1 / span 3; } + .hex-grid__item:nth-of-type(4n + 2) { + grid-column: 3 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(4n + 3) { + grid-column: 5 / span 3; } + .hex-grid__item:nth-of-type(4n + 4) { + grid-column: 7 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(n + 5) { + --counter: 2; } + .hex-grid__item:nth-of-type(n + 9) { + --counter: 3; } + .hex-grid__item:nth-of-type(n + 13) { + --counter: 4; } + .hex-grid__item:nth-of-type(n + 17) { + --counter: 5; } + .hex-grid__item:nth-of-type(n + 21) { + --counter: 6; } + .hex-grid__item:nth-of-type(n + 25) { + --counter: 7; } + .hex-grid__item:nth-of-type(n + 29) { + --counter: 8; } + .hex-grid__item:nth-of-type(n + 33) { + --counter: 9; } + .hex-grid__item:nth-of-type(n + 37) { + --counter: 10; } + .hex-grid__item:nth-of-type(n + 41) { + --counter: 11; } + .hex-grid__item:nth-of-type(n + 45) { + --counter: 12; } + .hex-grid__item:nth-of-type(n + 49) { + --counter: 13; } + .hex-grid__item:nth-of-type(n + 53) { + --counter: 14; } + .hex-grid__item:nth-of-type(n + 57) { + --counter: 15; } + .hex-grid__item:nth-of-type(n + 61) { + --counter: 16; } + .hex-grid__item:nth-of-type(n + 65) { + --counter: 17; } + .hex-grid__item:nth-of-type(n + 69) { + --counter: 18; } + .hex-grid__item:nth-of-type(n + 73) { + --counter: 19; } + .hex-grid__item:nth-of-type(n + 77) { + --counter: 20; } + .hex-grid__item:nth-of-type(n + 81) { + --counter: 21; } } + +@media screen and (min-width: 840px) and (max-width: 1119px) { + .hex-grid__list { + --amount: 3; + --counter: 1; + grid-gap: 1.5rem 3rem; } + .hex-grid__item:nth-of-type(3n + 1) { + grid-column: 1 / span 3; } + .hex-grid__item:nth-of-type(3n + 2) { + grid-column: 3 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(3n + 3) { + grid-column: 5 / span 3; } + .hex-grid__item:nth-of-type(n + 4) { + --counter: 2; } + .hex-grid__item:nth-of-type(n + 7) { + --counter: 3; } + .hex-grid__item:nth-of-type(n + 10) { + --counter: 4; } + .hex-grid__item:nth-of-type(n + 13) { + --counter: 5; } + .hex-grid__item:nth-of-type(n + 16) { + --counter: 6; } + .hex-grid__item:nth-of-type(n + 19) { + --counter: 7; } + .hex-grid__item:nth-of-type(n + 22) { + --counter: 8; } + .hex-grid__item:nth-of-type(n + 25) { + --counter: 9; } + .hex-grid__item:nth-of-type(n + 28) { + --counter: 10; } + .hex-grid__item:nth-of-type(n + 31) { + --counter: 11; } + .hex-grid__item:nth-of-type(n + 34) { + --counter: 12; } + .hex-grid__item:nth-of-type(n + 37) { + --counter: 13; } + .hex-grid__item:nth-of-type(n + 40) { + --counter: 14; } + .hex-grid__item:nth-of-type(n + 43) { + --counter: 15; } + .hex-grid__item:nth-of-type(n + 46) { + --counter: 16; } + .hex-grid__item:nth-of-type(n + 49) { + --counter: 17; } + .hex-grid__item:nth-of-type(n + 52) { + --counter: 18; } + .hex-grid__item:nth-of-type(n + 55) { + --counter: 19; } + .hex-grid__item:nth-of-type(n + 58) { + --counter: 20; } + .hex-grid__item:nth-of-type(n + 61) { + --counter: 21; } } + +@media screen and (min-width: 480px) and (max-width: 839px) { + .hex-grid__list { + --amount: 2; + --counter: 1; + grid-gap: 1.5rem 3rem; } + .hex-grid__item:nth-of-type(2n + 1) { + grid-column: 1 / span 3; } + .hex-grid__item:nth-of-type(2n + 2) { + grid-column: 3 / span 3; + grid-row: calc(var(--counter) + var(--counter) - 1)/span 2; } + .hex-grid__item:nth-of-type(n + 3) { + --counter: 2; } + .hex-grid__item:nth-of-type(n + 5) { + --counter: 3; } + .hex-grid__item:nth-of-type(n + 7) { + --counter: 4; } + .hex-grid__item:nth-of-type(n + 9) { + --counter: 5; } + .hex-grid__item:nth-of-type(n + 11) { + --counter: 6; } + .hex-grid__item:nth-of-type(n + 13) { + --counter: 7; } + .hex-grid__item:nth-of-type(n + 15) { + --counter: 8; } + .hex-grid__item:nth-of-type(n + 17) { + --counter: 9; } + .hex-grid__item:nth-of-type(n + 19) { + --counter: 10; } + .hex-grid__item:nth-of-type(n + 21) { + --counter: 11; } + .hex-grid__item:nth-of-type(n + 23) { + --counter: 12; } + .hex-grid__item:nth-of-type(n + 25) { + --counter: 13; } + .hex-grid__item:nth-of-type(n + 27) { + --counter: 14; } + .hex-grid__item:nth-of-type(n + 29) { + --counter: 15; } + .hex-grid__item:nth-of-type(n + 31) { + --counter: 16; } + .hex-grid__item:nth-of-type(n + 33) { + --counter: 17; } + .hex-grid__item:nth-of-type(n + 35) { + --counter: 18; } + .hex-grid__item:nth-of-type(n + 37) { + --counter: 19; } + .hex-grid__item:nth-of-type(n + 39) { + --counter: 20; } + .hex-grid__item:nth-of-type(n + 41) { + --counter: 21; } } + +@media screen and (max-width: 479px) { + .hex-grid__list { + --amount: 1; + grid-gap: 1.5rem 3rem; } } diff --git a/css/hex-grid.scss b/css/hex-grid.scss new file mode 100644 index 0000000..c4e5772 --- /dev/null +++ b/css/hex-grid.scss @@ -0,0 +1,125 @@ +$amount: 1; +$block: '.hex-grid'; + +@mixin grid-item($amount) { +@for $i from 1 through $amount { + &:nth-of-type(#{$amount}n + #{$i}) { + grid-column: #{$i + $i - 1} / span 3; + @if $i % 2 == 0 { + grid-row: calc(var(--counter) + var(--counter) - 1) / span 2; + } + } +} + +@for $i from 1 through 20 { + &:nth-of-type(n + #{$i * $amount + 1}) { + --counter: #{$i + 1}; + } +} +} + +#{$block} { + display: flex; + justify-content: center; + + &__list { + --amount: 5; + position: relative; + padding: 0; + margin: 0; + list-style-type: none; + display: grid; + grid-template-columns: repeat(var(--amount), 1fr 2fr) 1fr; + grid-gap: 2.5rem 5rem; + } + + &__item { + position: relative; + grid-column: 1 / span 3; + grid-row: calc(var(--counter) + var(--counter)) / span 2; + filter: drop-shadow(0 0 10px rgba(#444, .08)); + height: 0; + padding-bottom: 90%; + } + + &__content { + position: absolute; + height: 100%; + width: 100%; + font-size: 1.125rem; + color: #111111; + background-color: white; + clip-path: polygon(75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%, 25% 0); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 2rem 25%; + text-decoration: none; + text-align: center; + transition: transform .24s ease-out; + } +} + +@media screen and (min-width: 1440px) { + #{$block} { + &__list { + --amount: 5; + --counter: 1; + } + + &__item { + @include grid-item(5); + } + } +} + +@media screen and (min-width: 1120px) and (max-width: 1439px) { + #{$block} { + &__list { + --amount: 4; + --counter: 1; + } + + &__item { + @include grid-item(4); + } + } +} + +@media screen and (min-width: 840px) and (max-width: 1119px) { + #{$block} { + &__list { + --amount: 3; + --counter: 1; + grid-gap: 1.5rem 3rem; + } + + &__item { + @include grid-item(3); + } + } +} + +@media screen and (min-width: 480px) and (max-width: 839px) { + #{$block} { + &__list { + --amount: 2; + --counter: 1; + grid-gap: 1.5rem 3rem; + } + + &__item { + @include grid-item(2); + } + } +} + +@media screen and (max-width: 479px) { + #{$block} { + &__list { + --amount: 1; + grid-gap: 1.5rem 3rem; + } + } +} diff --git a/css/manpage.css b/css/manpage.css new file mode 100644 index 0000000..00d8bf7 --- /dev/null +++ b/css/manpage.css @@ -0,0 +1,226 @@ +/* $Id: example.style.css,v 1.49 2011/12/15 12:18:57 kristaps Exp $ */ +/* + * This is an example style-sheet provided for mandoc(1) and the -Thtml + * or -Txhtml output mode. + * It mimics the appearance of the legacy man.cgi output. + * See mdoc(7) and man(7) for macro explanations. + */ + +/* +.Bd pre { + background: teal; + color: white; + padding: 5px; + border-color: teal; + border: 2px solid #486262; + border-left-width: 5px; + overflow-x: auto; +} +*/ + +:root { + --color-cm: #0b5b00; + --color-pa: green; + --color-ar: #b0141a; +} +@media (prefers-color-scheme: dark) { +:root { + --color-cm: #63ff2b; + --color-pa: #0f0; + --color-ar: #fbb7ba; +} +} + +table.Nm tbody tr > * { + display: inline; +} + +a.permalink { + text-decoration: none; + color: var(--color-text); +} +@media (prefers-color-scheme: dark) { +a.permalink { + text-decoration: dotted underline; +} +} + +h1.Sh { + font-size: 10pt; + margin: 20px 0; +} + +section.Sh { + border-left: 1px dashed #979696; + padding-left: 2rem; + overflow-x: auto; +} + +div.Nd { + display: inline; +} + +dl.Bl-tag { + /*display: flex; + flex-wrap: wrap;*/ + display: grid; + width: 100%; + max-width: 100%; + overflow-x: auto; + grid-template-columns: minmax(auto, 1fr) minmax(auto, 1fr); + grid-template-rows: auto; +} +dt { + margin: .5rem 0; + overflow-x: auto; + grid-column: 1 / span 1; +} +dd { + margin-left: auto; + margin: .5rem 0; + overflow-x: auto; + grid-column: 2 / span 1; +} + +.Cm { + color: var(--color-cm); +} + +.Ar { + color: var(--color-ar); + font-style: normal; +} + +.Em { + font-style: normal; + color: var(--color-pa); +} + +.Pa { + color: var(--color-pa); +} + +.Pa::after { + content: " 📁"; + filter: grayscale(); + white-space: pre; +} + +@media (prefers-color-scheme: dark) { +.Pa::after { + filter: invert(100%) grayscale(100%); +} +} + + +.Pa:hover::after { + content: " 📂"; + white-space: pre; + display: inline-block; + user-select: none; + cursor:pointer; +} + + +.Bd.Pp { + padding: .2rem; +} + +.Bd.Bd-indent { + margin: 0 2rem; + background: darksalmon; + padding: .7rem; + border: 2px inset #792323; + color: #3c0303; + box-shadow: inset 2px 2px #c83333; + overflow-x:auto; +} + +.Xr { + font-weight: 800; +} + +code.Nm::after { + white-space: pre; +} + +ul.Bl-compact { + list-style: inside lower-greek; +} + +ol.Bl-enum li { + margin: .2rem 0; +} + +.Bd pre { + background: #ecbc2a; + color: #3c2b0c; + padding: 20px; + border: solid #b79328; + overflow-x: auto; + max-width: max-content; + margin: auto; + box-shadow: 5px 5px #737373; +} + +.tbl { + border-spacing: 0; + border: solid black; + border-width: 1px 1px 0px 0px; + margin: auto; + margin-bottom: 1rem; + box-shadow: 1px 1px grey; +} + +table.tbl td { + border: solid #000; + border-width: 0 0 1px 1px; + border-spacing: 0; + padding: 0.2rem; + +} + +hr { + margin: initial; + max-width: 50em; + margin-bottom:1rem; + clear: both; +} + +.foot { + width: 100%; + font-size: 80%; +} + +.foot .foot-date { + text-align: left; +} + +.foot .foot-os { + text-align: right; +} + +.head { + width: 100%; + font-size: 80%; +} + +.head .head-ltitle { + text-align:left; +} + +.head .head-vol { + text-align:center; +} + +.head .head-rtitle { + text-align:right; +} + +code.Li { + background: revert; + border: revert; + text-align: revert; + margin: revert; + color: revert; +} diff --git a/css/mvp.css b/css/mvp.css new file mode 100644 index 0000000..14ea978 --- /dev/null +++ b/css/mvp.css @@ -0,0 +1,361 @@ +/* MVP.css v1.0.1 - by Andy Brewer */ + +:root { + --border-radius: 5px; + --box-shadow: 2px 2px 10px; + --color: #118bee; + --color-accent: #118bee0b; + --color-bg: #fff; + --color-bg-secondary: #e9e9e9; + --color-secondary: #920de9; + --color-secondary-accent: #920de90b; + --color-shadow: #f4f4f4; + --color-text: #000; + --color-text-secondary: #999; + --hover-brightness: 1.2; + --justify-important: center; + --justify-normal: left; + --line-height: 150%; + --width-card: 285px; + --width-card-medium: 460px; + --width-card-wide: 800px; + --width-content: 1080px; +} + +@media (prefers-color-scheme: dark) { + :root { + --color-accent: #118aee7f; + --color-bg: #333333; + --color-bg-secondary: #555; + --color-secondary: #6df216; + --color-secondary-accent: #6df2167f; + --color-shadow: #bbbbbb20; + --color-text: #fff; + --color-text-secondary: #666; + } +} + +/* Layout */ +article aside { + background: var(--color-secondary-accent); + border-left: 4px solid var(--color-secondary); + padding: 0.01rem 0.8rem; +} + +body { + background: var(--color-bg); + color: var(--color-text); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; + line-height: var(--line-height); + margin: 0; + overflow-x: hidden; + padding: 1rem 0; +} + +footer, +header, +main { + margin: 0 auto; + max-width: var(--width-content); + padding: 2rem 1rem; +} + +hr { + background-color: var(--color-bg-secondary); + border: none; + height: 1px; + margin: 4rem 0; +} + +section { + display: flex; + flex-wrap: wrap; + justify-content: var(--justify-important); +} + +section aside { + border: 1px solid var(--color-bg-secondary); + border-radius: var(--border-radius); + box-shadow: var(--box-shadow) var(--color-shadow); + margin: 1rem; + padding: 1.25rem; + width: var(--width-card); +} + +section aside:hover { + box-shadow: var(--box-shadow) var(--color-bg-secondary); +} + +section aside img { + max-width: 100%; +} + +/* Headers */ +article header, +div header, +main header { + padding-top: 0; +} + +header { + text-align: var(--justify-important); +} + +header a b, +header a em, +header a i, +header a strong { + margin-left: 1rem; + margin-right: 1rem; +} + +header nav img { + margin: 1rem 0; +} + +section header { + padding-top: 0; + width: 100%; +} + +/* Nav */ +nav { + align-items: center; + display: flex; + font-weight: bold; + justify-content: space-between; + margin-bottom: 7rem; +} + +nav ul { + list-style: none; + padding: 0; +} + +nav ul li { + display: inline-block; + margin: 0 0.5rem; +} + +/* Typography */ +code { + display: inline-block; + margin: 0 0.1rem; + padding: 0rem 0.5rem; +} + +code, +samp { + background-color: var(--color-accent); + color: var(--color-text); + border-radius: var(--border-radius); + text-align: var(--justify-normal); +} + +h1, +h2, +h3, +h4, +h5, +h6 { + line-height: var(--line-height); +} + +mark { + padding: 0.1rem; +} + +ol li, +ul li { + padding: 0.2rem 0; +} + +p { + margin: 0.75rem 0; + padding: 0; +} + +samp { + display: block; + margin: 1rem 0; + max-width: var(--width-card-wide); + padding: 1rem; +} + +small { + color: var(--color-text-secondary); +} + +sup { + background-color: var(--color-secondary); + border-radius: var(--border-radius); + color: var(--color-bg); + font-size: xx-small; + font-weight: bold; + margin: 0.2rem; + padding: 0.2rem 0.3rem; + position: relative; + top: -2px; +} + +/* Links */ +a { + color: var(--color-secondary); + font-weight: bold; + text-decoration: none; +} + +a:hover { + filter: brightness(var(--hover-brightness)); + text-decoration: underline; +} + +a b, +a em, +a i, +a strong, +button { + border-radius: var(--border-radius); + display: inline-block; + font-size: medium; + font-weight: bold; + margin: 1.5rem 0 0.5rem 0; + padding: 1rem 2rem; +} + +button:hover { + cursor: pointer; + filter: brightness(var(--hover-brightness)); +} + +a b, +a strong, +button { + background-color: var(--color); + border: 2px solid var(--color); + color: var(--color-bg); +} + +a em, +a i { + border: 2px solid var(--color); + border-radius: var(--border-radius); + color: var(--color); + display: inline-block; + padding: 1rem 2rem; +} + +/* Images */ +figure { + margin: 0; + padding: 0; +} + +figure figcaption { + color: var(--color-text-secondary); +} + +/* Forms */ +form { + border: 1px solid var(--color-bg-secondary); + border-radius: var(--border-radius); + box-shadow: var(--box-shadow) var(--color-shadow); + display: block; + max-width: var(--width-card-wide); + min-width: var(--width-card); + padding: 1.5rem; + text-align: var(--justify-normal); +} + +form header { + margin: 1.5rem 0; + padding: 1.5rem 0; +} + +input, +label, +select, +textarea { + display: block; + font-size: inherit; + max-width: var(--width-card-wide); +} + +input, +select, +textarea { + margin-bottom: 1rem; +} + +input, +textarea { + border: 1px solid var(--color-bg-secondary); + border-radius: var(--border-radius); + padding: 0.4rem 0.8rem; +} + +label { + font-weight: bold; + margin-bottom: 0.2rem; +} + +/* Tables */ +table { + border: 1px solid var(--color-bg-secondary); + border-radius: var(--border-radius); + border-spacing: 0; + display: block; + overflow-x: scroll; + overflow-y: hidden; + padding: 0; +} + +table td, +table th, +table tr { + padding: 0.4rem 0.8rem; + text-align: var(--justify-important); +} + +table thead { + background-color: var(--color); + border-collapse: collapse; + border-radius: var(--border-radius); + color: var(--color-bg); + margin: 0; + padding: 0; +} + +table thead th:first-child { + border-top-left-radius: var(--border-radius); +} + +table thead th:last-child { + border-top-right-radius: var(--border-radius); +} + +table thead th:first-child, +table tr td:first-child { + text-align: var(--justify-normal); +} + +/* Quotes */ +blockquote { + display: block; + font-size: x-large; + line-height: var(--line-height); + margin: 1rem auto; + max-width: var(--width-card-medium); + padding: 1.5rem 1rem; + text-align: var(--justify-important); +} + +blockquote footer { + color: var(--color-text-secondary); + display: block; + font-size: small; + line-height: var(--line-height); + padding: 1.5rem 0; +} + +/* Custom styles */ diff --git a/css/syntax.css b/css/syntax.css new file mode 100644 index 0000000..f72212a --- /dev/null +++ b/css/syntax.css @@ -0,0 +1,78 @@ +:root { + --color-other: #007020; + --color-datatype: #902000; +} + +@media (prefers-color-scheme: dark) { + :root { + --color-other: #3bff2a; + } +} +a.sourceLine { display: inline-block; line-height: 1.25; } +a.sourceLine { pointer-events: none; color: inherit; text-decoration: inherit; } +a.sourceLine:empty { height: 1.2em; } +.sourceCode { overflow: visible; } +code.sourceCode { white-space: pre-wrap; position: relative; color: black; } +pre.sourceCode code.sourceCode { white-space: pre; padding: .5rem; } +pre.sourceCode { + margin: 0; + background: #80808014; + width: min-content; + border-radius: 2px; + border: 1px solid #80808014; +} +@media screen { +div.sourceCode { overflow: auto; } +div.sourceCode:hover { overflow:visible; } +} +@media print { +code.sourceCode { white-space: pre-wrap; } +a.sourceLine { text-indent: -1em; padding-left: 1em; } +} +pre.numberSource a.sourceLine + { position: relative; left: -4em; } +pre.numberSource a.sourceLine::before + { content: attr(title); + position: relative; left: -1em; text-align: right; vertical-align: baseline; + border: none; pointer-events: all; display: inline-block; + -webkit-touch-callout: none; -webkit-user-select: none; + -khtml-user-select: none; -moz-user-select: none; + -ms-user-select: none; user-select: none; + padding: 0 4px; width: 4em; + color: #aaaaaa; + } +pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa; padding-left: 4px; } +div.sourceCode + { } +@media screen { +a.sourceLine::before { text-decoration: underline; } +} +code span.al { color: #ff0000; font-weight: bold; } /* Alert */ +code span.an { color: #60a0b0; font-weight: bold; font-style: italic; } /* Annotation */ +code span.at { color: #7d9029; } /* Attribute */ +code span.bn { color: #40a070; } /* BaseN */ +code span.bu { } /* BuiltIn */ +code span.cf { color: var(--color-other); font-weight: bold; } /* ControlFlow */ +code span.ch { color: #4070a0; } /* Char */ +code span.cn { color: #880000; } /* Constant */ +code span.co { color: #60a0b0; font-style: italic; } /* Comment */ +code span.cv { color: #60a0b0; font-weight: bold; font-style: italic; } /* CommentVar */ +code span.do { color: #ba2121; font-style: italic; } /* Documentation */ +code span.dt { color: var(--color-datatype); } /* DataType */ +code span.dv { color: #0081A1; } /* DecVal */ +code span.er { color: #ff0000; font-weight: bold; } /* Error */ +code span.ex { } /* Extension */ +code span.fl { color: #40a070; } /* Float */ +code span.fu { color: #06287e; } /* Function */ +code span.im { } /* Import */ +code span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Information */ +code span.kw { color: #8F5C87; font-weight: bold; } /* Keyword */ +code span.op { color: #666666; } /* Operator */ +code span.ot { color: #007020; } /* Other */ +code span.pp { color: #A45B70; } /* Preprocessor */ +code span.sc { color: #4070a0; } /* SpecialChar */ +code span.ss { color: #bb6688; } /* SpecialString */ +code span.st { color: #4070a0; } /* String */ +code span.va { color: #19177c; } /* Variable */ +code span.vs { color: #4070a0; } /* VerbatimString */ +code span.wa { color: #60a0b0; font-weight: bold; font-style: italic; } /* Warning */ diff --git a/css/with_changes_default.css b/css/with_changes_default.css new file mode 100644 index 0000000..6283415 --- /dev/null +++ b/css/with_changes_default.css @@ -0,0 +1,1176 @@ +@font-face { + font-family: 'dejavu_sans_monobook'; + src: local("DejaVu Sans Mono"), + url('/css/dejavusansmono-webfont.woff2') format('woff2'), + url('/css/dejavusansmono-webfont.woff') format('woff'); + font-weight: normal; + font-style: normal; +} + + +html { + font-size:100%; + font-family:"dejavu_sans_monobook", monospace; +} +body { + font-size:.80rem; + color: #151515; +/* color: #202020; */ +/* color: #404040;*/ + background: radial-gradient(circle farthest-side at 0% 50%,#FFF 23.5%,rgba(240,166,17,0) 0)21px 30px, radial-gradient(circle farthest-side at 0% 50%,#f8f8f8 24%,rgba(240,166,17,0) 0)19px 30px, linear-gradient(#FFF 14%,rgba(240,166,17,0) 0, rgba(240,166,17,0) 85%,#FFF 0)0 0, linear-gradient(150deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(30deg,#FFF 24%,#f8f8f8 0,#f8f8f8 26%,rgba(240,166,17,0) 0,rgba(240,166,17,0) 74%,#f8f8f8 0,#f8f8f8 76%,#FFF 0)0 0, linear-gradient(90deg,#f8f8f8 2%,#FFF 0,#FFF 98%,#f8f8f8 0%)0 0 #FFF; + background-size: 40px 60px; +} + +a:visited { + color: #404040; +} +header { + border-bottom:1px solid #969595; + display: flex; + justify-content: space-between; +} +header nav { + margin: auto 0 0 auto; + text-align:right; +} +header nav a { + font-size:1.3rem; + font-weight:bold; + text-transform:uppercase; +} +footer { + margin-top:3rem; + padding:.5rem 0 1.2rem 0; + border-top:1px solid #969595; + font-size:.8rem; + color:#555; +} +h1 { + font-variant-caps: small-caps; +} +h2 { + font-variant-caps: small-caps; +} + +h3 { + font-style: italic; + font-variant-caps: small-caps; + font-weight: 100; + } + +h1.title{ + margin-bottom: 4px; + padding: .7rem; +} + +ul { + list-style: circle; + padding-left: 0px; + list-style-position: inside; +} + +li ul { + padding-left: 1.2rem; +} + +li { + line-height: 1.5; +} + +.subtitle { + /* Add extra padding to align with the title above */ + padding-left:.7rem; +} + +/* Article/posts styling */ +main.article { + display: flex; + flex-direction: column; + min-height: 100vh; + width: 100%; + margin:0 0; +} + +main.article article > :first-child { + /* header div already has padding-bottom */ + margin-top: 0; + padding-top: 0; +} + +main.article .title { + border-bottom: double 3px #d5d5d5; + border-left: double 3px #d5d5d5; + border-radius: 6px; + background-color: #a9a9a924; + +} + +@media (min-width: 1280px) { + #bee-emoji-svg, #bee-emoji-svg::before { + display: inline-block !important; + } + .logo:hover, .logo:hover::after { + display: inline !important; + } + article { + width: 43rem; + } + main { + z-index: 1; + min-width: 78rem; + margin:0 auto; + padding:0; + } + header { + margin:2.0rem 0 3.5rem 3rem; + padding:0.2rem 0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .logo { + text-align:left; + } + .logo a { + font-size:6rem; + } + img.fit { + width: 100%; + height: auto; + object-fit: cover; + } + main.article { + display: grid; + grid-template-columns: [left-sideline] auto [body] auto [right-sideline] auto; + grid-column-gap: 10px; + grid-row-gap: 3px; + grid-auto-rows: auto; + } + + main.article article { + padding-right: 4rem; + } +} + +main.article div.left { + grid-column: left-sideline; + grid-row: 2 / 3; + min-width:180px; + order: 2; + padding-left: 2em; + padding-right: 2em; +} + +main.article article { + line-height: 1.4; + text-decoration-color: #0000001a; + grid-column: body; + grid-row: 2 / 3; + order:1; + max-width: 41rem; +} + +main.article div.right { + grid-column: right-sideline; + grid-row: 2 / 3; + min-width:180px; + order:3; + padding-left: 2em; + padding-right: 2em; +} + +main section.header { + color:#555; + font-size:0.8rem; + grid-column: 2 / 3; + grid-row: 1 / 2; + max-width: 50rem; + padding-bottom: .5rem; +} + +main.article article p:first-child { + margin-top: 0; +} + +main.article article > p:first-child::first-letter { + float: left; + font-size: 500%; +/* font-style: italic;*/ + height: 1rem; + line-height: 1rem; + margin: 0px; + padding: 0 .05em 0 0; + text-shadow: #d9d4d4 .05em .05em; +} + +.logo a { + font-size: 3.5rem; + color:#131516; + font-weight:bold; + text-decoration:none; +} +/* +.sidenote-left, .sidenote-right { + display: inline-block; + width: 48%; + margin-top: 0; + margin-bottom: 0; + font-size: 7pt; + line-height: 1.3; + vertical-align: baseline; +} +*/ + +code { + font-weight: 800; + color: #006266; +} + +kbd.□.▭ { + width: auto; + font-weight: 800; + padding: 13px 5px; + /* box-shadow: 2px 3px #8e897a; */ + box-shadow: 3px 5px #8e897a, 2px 0px 2px -1px inset #bbb, -1px 0px 2px -1px inset #bbb, -2px 3px #8e897a, -3px 5px #8e897a, 3px 5px #8e897a, -2px 3px #8e897a, 2px 3px #8e897a, 2px 3px #8e897a; + margin-bottom:4px; + margin-right:4px; +} + +kbd.□.▭:active { + box-shadow: 1px 0px 1px #c1c0c0 inset,-1px 0px 1px #c1c0c0 inset, -3px 3px #a29b9b, 3px 3px #a29b9b, -2px 2px #a29b9b, 2px 2px #a29b9b, -1px 1px #a29b9b, 1px 1px #a29b9b; + top: 3px; + position: relative; +} + +kbd.□:active { + color: black; + box-shadow: 1px 1px 0px #ddd inset; + top: 1px; + position: relative; +} + +kbd.□ { + font-weight: 800; + border: 1px solid #cecece; + background: #f7f7e7; + /* box-shadow: 2px 1px #8e897a;*/ + box-shadow: 1px 3px darkgray, -1px 3px darkgray, 1px 2px darkgray, -1px 2px darkgray; + border-radius: 3px; + display: inline-block; + font-size: .85em; + line-height: 1; + padding: 2px 4px; + white-space: nowrap; + user-select: none; + cursor:pointer; +} + +/* for keys that aren't entirely square */ +.thin-kbd.□.▭ { + padding-right: 7px; + padding-left: 8px; +} + +.sourceCode code { + font-weight: 300; +} + +@media (min-width:320px) { + #bee-emoji-svg, #bee-emoji-svg::before, .logo:hover, .logo:hover::after { + display: none; + } + body { + width:90%; + margin:0; + padding:0 5%; + } + header { + margin:1.7rem 0 2.0rem 0; + } + footer { + text-align:center; + } + .logo a { + font-size:3.5rem; + } + header nav { + padding-bottom: .7rem; + } + header nav a { + display:inline; + margin:0 0.6rem; + font-size:1.3rem; + } + .screenshots { + flex-direction: column; + } +} +@media (min-width:1140px) { + main { + z-index: 1; + padding:0; + } + header nav a { + margin:0 0 0 1.2rem; + display:inline; + } + footer { + text-align:right; + } + .screenshots { + flex-direction: row; + } +} + + + +img.fit { + width: 100%; + height: auto; + object-fit: cover; +} + +img.full-width { + width: 100%; + height: auto; + object-fit: cover; +} + +.fit-right { + margin-left: 10%; +} +.fit-left { + margin-right: 10%; +} + +.logo { + margin: auto auto 0 0; +} + +.logo-img { + width: 100%; + height: auto; + object-fit: cover; +} + +figure { + margin: 0 1.2rem 1.2rem 0; +} + +.bold { + font-weight: 800; +} + +figcaption { + font-size: 8pt; + color: #5b5e60; + background: #f6f6f6; + border: 1px solid #ededed; + border-radius: 0 0 2px 2px; + width: calc(98% - 2px); + margin-top: -3px; + padding-bottom: 7px; + padding-left: 2%; + padding-top: 5px; +} + +figcaption a { + text-decoration: inherit; + color: inherit; +} + +figcaption a:visited { + color: inherit; +} + +/* Index styling */ +.wrapper { + display: grid; + grid-auto-columns: minmax(100px, auto); + grid-gap: 10px; + grid-auto-rows: minmax(100px, auto); +} + +.wrapper h2 { + border-bottom: 2px inset #000; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + padding-left: .5rem; + padding-right: .5rem; + border-top: 1px solid #b2b2b2; + padding: .5rem; + border-radius: 2px; + background: white; +} +@media (max-width:1280px) { +.wrapper > *:first-child { + display: flex; + flex-wrap: wrap; + grid-column: 1; + grid-row: 1 / 1; +} +section.index-intro { + width: 100vw; +} + +section.index-intro, section.index-install, section.index-build, section.index-features, section-announcements { + border-bottom: 2px solid #6c6e6f; + min-width: 100%; + margin-bottom: 10px; +} +} + +@media (min-width:1280px) { +.wrapper > *:first-child { + display: grid; + grid-column: 1; + grid-row: 1 / 1; + grid-template-areas: + "term term install install" "term term features build" "screenshots screenshots features announcements"; + grid-column-gap: 3rem; + grid-row-gap: 1rem; + grid-template-columns: repeat(2, min-content) repeat(2, auto); +} + +section.index-install ol { + margin-bottom: 0px; +} + +section.index-install, section.index-build { + margin-bottom: 20px; +} + +section.index-intro { + width: 36vw; +} +} + +section h1 { + font-size: 1.21rem; + font-variant-caps: normal; + margin-top: 0px; +} + +h1 { + border-bottom: 2px inset #000; + max-width: max-content; + border-left: 1px solid #b2b2b2; + border-right: 1px solid #b2b2b2; + padding-left: .5rem; + padding-right: .5rem; + border-top: 1px solid #b2b2b2; + padding: .5rem; + border-radius: 2px; + background: white; +} + +section.index-intro { + grid-area:term; +} + +section.index-features { + grid-area: features; +} + +section.index-install { + grid-area: install; +} + +section.index-build { + grid-area: build; +} + +section.index-announcements { + grid-area: announcements; +} + + +ul.index-announcement-list { + padding-left: 0px; +} + +section.index-install > h2 { + margin-bottom: 0; + +} + + +section.index-install details > summary { + display: inline-block; + margin: .4rem auto; + padding: .2rem; + background: #d7d7d7; + border: 3px double white; + color: #56BAE6; +} + +section.index-install details > summary::after { + content: " (help) "; + color: #03186a; + font-size: .6rem; + cursor: pointer; +} + +section.index-install details > summary > code { + color: #014446; + font-size: 119%; +} + +.index-screenshots { + display:inline-flex; + flex-wrap: wrap; + grid-area: screenshots; + /*! grid-template-columns: repeat(auto-fit, 202px); */ + /*! width: 51%; */ + /*! max-width: min-content; */ + flex-grow: inherit; + flex-shrink: 1px; + display: flex; + /*! grid-template-columns: repeat(auto-fill,minmax(160px, 1fr)); */ + flex-wrap: wrap; + /*! flex: 0 59%; */ +} + +.index-screenshots > * { + flex: initial; + flex: 0 22%; + /*! flex-flow: row; */ + /*! flex-grow: 0; */ + flex-shrink: -1; + /*! flex-basis: 16%; */ +} + +.index-screenshots a { +height: 100%; +} + +.index-screenshots img { + object-fit: contain; + width: 100%; + height:inherit; + background: #444; +} + +.xterm_title { + background: #22AA99; + color: white; + font-size: .8rem; + padding: 0.3em; + padding-left: 2px; + padding-right: 2px; + width: auto; + border: 1px ridge black; + border-top-left-radius: 2px; + border-top-right-radius: 2px; + border-bottom:0px; + margin-bottom:0px; + min-width: inherit; + + display: grid; + grid-template-columns: [symbol] 40px [title] 1fr [buttons]; + grid-template-rows: auto; +} + .xterm { + overflow: hidden; + font-size: 12px; + direction: ltr; + text-align: left; + background: #22AA99; + padding: 1px; + border: 1px solid black; + width: inherit; + + max-width: min-content; + min-width: min-content; +} + +.xterm-title { + grid-column: title; + grid-row: 1 / 1; + font-weight:800; + margin-top: 3px; +} + +.xterm-symbol { + cursor:pointer; + grid-column: symbol; + grid-row: 1 / 1; + font-size: 1rem; + line-height: initial; + padding-left: 2px; + padding-right: 0px; + border-right: 3px double #cbebe7; + margin-right: 13px; + margin-left: 4px; +} +#main_svg { + max-width: 85vw; + width: inherit; + border: 1px solid black; +} +/* Index styling end */ + + + + + + + +/* lightbox */ + + + + +/*Eliminates padding, centers the thumbnail */ + +/* Styles the lightbox, removes it from sight and adds the fade-in transition */ + +figure:not(.lightbox-target) { + display: flex; + flex-direction: column; +} +.lightbox-target { + z-index:5; + pointer-events: none; + position: absolute; + top: 0; + left:0; + right:0; + bottom: 0; + width: 100%; + height: 100%; + opacity: 0; + /* overflow: hidden; */ + overflow-x: scroll; + + padding: 0; + text-align: center; + margin:0; +} + + +/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */ + +.lightbox-target img { + margin: auto; + max-height: 0%; + max-width: 0%; + border: 3px solid white; + box-shadow: 0px 0px 8px rgba(0,0,0,.3); + box-sizing: border-box; + z-index: 2; +} + +.lightbox-target figcaption { + margin: auto; + padding: 18px; + color: #5b5e60; + background: #f6f6f6; + border: 3px solid #ededed; + z-index: 3; + font-size: 2rem; + pointer-events: none; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + width: auto; + height: min-content; +} + +/* Styles the close link, adds the slide down transition */ + +a.lightbox-close { + width:50px; + height:50px; + color: white; + opacity: 1; + text-decoration: none; + pointer-events: auto; + z-index: 4; + font-size: 2.5rem; +} + +/* Uses the :target pseudo-class to perform the animations upon clicking the .lightbox-target anchor */ + +.lightbox-target:target { + opacity: 1; + top: 0; + bottom: 0; +} + +.lightbox-target:target img { + max-height: 80vh; + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + height: auto; + width: auto; +} + +.lightbox-target:target a.lightbox-close { +top: 0px; +} + + +/* IBM's colorblind safe palette */ + +.cornflower-blue { + color: #648FFF; +} + +.purple { + color: #785EF0; +} + +.cerise { + color: #DC267F; +} + +.blaze-orange { + color: #FE6100; +} + +.amber { + color: #FFB000; +} + + +.dull-red { + color: #CC6677; +} + +.cyan { + color: #44AA99; +} + +.green { + color: #117733; +} + +.float_left_img { + max-width: 25%; + min-width: 5vw; + float:left; + padding: .4em; +} + + +div.mandoc { + max-width: 100vw; + min-width: 100vw; +} + +nav.nav-doc { + /* fallback in case max-content is not supported by the browser */ + max-width: 100%; + max-width: max-content; + border: 1px solid black; + padding: .4rem 1rem .4rem 2rem; + background: white; + box-shadow: 5px 5px darkgrey; +} + +nav.nav-doc ul { +list-style: square; +} + +article.article-doc { + max-width: 43rem; + background: white; +} + +.screenshots-page { + display: flex; + flex-wrap: wrap; +} + +.screenshots-page > * { + flex: 1 0 30%; + min-width: 200px; +} + +.screenshots-page > figure > a { + height: 100%; + background: #1c1c1c; +} +.screenshots-page > figure > a > img { + height: inherit; + width: 100%; + object-fit: contain; + background: #444; +} + +.screenshots-page > figure:not(.lightbox-target):nth-child(odd) > a > img { + background-color: #cccccc; + background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23b9b9b9' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E"); +} + +code.Nm::after { + content: " 🐝"; + filter: hue-rotate(170deg) grayscale(42%); +} + + +/* Documentation */ + +span.notice-info { + padding: .5rem; + border: 2px dashed grey; + margin-bottom: 15px; + background: white; + display: inline-block; +} + + + +/*! * * * * * * * * * * * * * * * * * * * *\ + CSShake :: shake-little + v1.5.0 + CSS classes to move your DOM + (c) 2015 @elrumordelaluz + http://elrumordelaluz.github.io/csshake/ + Licensed under MIT +\* * * * * * * * * * * * * * * * * * * * */ +code.Nm::after { + display: inline-block; + transform-origin: center center; } + +.shake-freeze, +.shake-constant.shake-constant--hover:hover, +.shake-trigger:hover .shake-constant.shake-constant--hover { + animation-play-state: paused; } + +.shake-freeze:hover, +.shake-trigger:hover .shake-freeze, code.Nm:hover::after, +.shake-trigger:hover code.Nm::after { + animation-play-state: running; } + +@keyframes shake-little { + 2% { + transform: translate(0px, 1px) rotate(0.5deg); } + 4% { + transform: translate(0px, 1px) rotate(0.5deg); } + 6% { + transform: translate(1px, 1px) rotate(0.5deg); } + 8% { + transform: translate(0px, 0px) rotate(0.5deg); } + 10% { + transform: translate(1px, 0px) rotate(0.5deg); } + 12% { + transform: translate(1px, 1px) rotate(0.5deg); } + 14% { + transform: translate(0px, 0px) rotate(0.5deg); } + 16% { + transform: translate(1px, 0px) rotate(0.5deg); } + 18% { + transform: translate(0px, 1px) rotate(0.5deg); } + 20% { + transform: translate(0px, 1px) rotate(0.5deg); } + 22% { + transform: translate(1px, 1px) rotate(0.5deg); } + 24% { + transform: translate(0px, 1px) rotate(0.5deg); } + 26% { + transform: translate(0px, 0px) rotate(0.5deg); } + 28% { + transform: translate(1px, 0px) rotate(0.5deg); } + 30% { + transform: translate(1px, 0px) rotate(0.5deg); } + 32% { + transform: translate(0px, 1px) rotate(0.5deg); } + 34% { + transform: translate(0px, 1px) rotate(0.5deg); } + 36% { + transform: translate(0px, 0px) rotate(0.5deg); } + 38% { + transform: translate(1px, 1px) rotate(0.5deg); } + 40% { + transform: translate(1px, 0px) rotate(0.5deg); } + 42% { + transform: translate(0px, 1px) rotate(0.5deg); } + 44% { + transform: translate(0px, 1px) rotate(0.5deg); } + 46% { + transform: translate(0px, 0px) rotate(0.5deg); } + 48% { + transform: translate(0px, 1px) rotate(0.5deg); } + 50% { + transform: translate(0px, 1px) rotate(0.5deg); } + 52% { + transform: translate(1px, 1px) rotate(0.5deg); } + 54% { + transform: translate(0px, 0px) rotate(0.5deg); } + 56% { + transform: translate(0px, 0px) rotate(0.5deg); } + 58% { + transform: translate(0px, 0px) rotate(0.5deg); } + 60% { + transform: translate(0px, 1px) rotate(0.5deg); } + 62% { + transform: translate(0px, 0px) rotate(0.5deg); } + 64% { + transform: translate(1px, 0px) rotate(0.5deg); } + 66% { + transform: translate(0px, 1px) rotate(0.5deg); } + 68% { + transform: translate(0px, 0px) rotate(0.5deg); } + 70% { + transform: translate(1px, 1px) rotate(0.5deg); } + 72% { + transform: translate(1px, 0px) rotate(0.5deg); } + 74% { + transform: translate(0px, 1px) rotate(0.5deg); } + 76% { + transform: translate(0px, 1px) rotate(0.5deg); } + 78% { + transform: translate(1px, 0px) rotate(0.5deg); } + 80% { + transform: translate(1px, 0px) rotate(0.5deg); } + 82% { + transform: translate(0px, 0px) rotate(0.5deg); } + 84% { + transform: translate(1px, 0px) rotate(0.5deg); } + 86% { + transform: translate(0px, 0px) rotate(0.5deg); } + 88% { + transform: translate(0px, 0px) rotate(0.5deg); } + 90% { + transform: translate(1px, 1px) rotate(0.5deg); } + 92% { + transform: translate(1px, 1px) rotate(0.5deg); } + 94% { + transform: translate(1px, 0px) rotate(0.5deg); } + 96% { + transform: translate(1px, 0px) rotate(0.5deg); } + 98% { + transform: translate(0px, 0px) rotate(0.5deg); } + 0%, 100% { + transform: translate(0, 0) rotate(0); } } + +code.Nm:hover::after, +.shake-trigger:hover code.Nm::after, .shake-little.shake-freeze, .shake-little.shake-constant { + animation-name: shake-little; + animation-duration: 100ms; + animation-timing-function: ease-in-out; + animation-iteration-count: infinite; +} + +#bee-emoji-svg:hover::before, +.shake-trigger:hover .shake-little.shake-freeze, .shake-little.shake-constant { + animation: shake-little 50ms ease-in-out running 120, harvest 10s 5500ms running steps(8, jump-both) infinite; +} + + + .logo::after { + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} +.logo:hover::after { + content: "🌸"; + height: 3.5rem; + width: 3.5rem; + font-size: 2rem; + position: relative; + right: 3rem; + z-index: -1; + transition: all 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg:hover::before { + transform: translateY(26px) scale(.5); + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); +} + +#bee-emoji-svg::before { + content: " "; + filter: hue-rotate(170deg) grayscale(42%); + background-image: url('data:image/svg+xml,%3Csvg enable-background="new 0 0 47.5 47.5" version="1.1" viewBox="0 0 47.5 47.5" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"%3E%3Cdefs%3E%3CclipPath id="c"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3CclipPath id="b"%3E%3Cpath d="m8.719 17c0-6.133 4.603-13 10.281-13 5.679 0 10.281 6.867 10.281 13s-4.602 8.923-10.281 8.923c-5.678 0-10.281-2.79-10.281-8.923"/%3E%3C/clipPath%3E%3CclipPath id="a"%3E%3Cpath d="m0 38h38v-38h-38v38z"/%3E%3C/clipPath%3E%3C/defs%3E%3Cg transform="matrix(1.25,0,0,-1.25,0,47.5)"%3E%3Cg clip-path="url(%23c)"%3E%3Cg transform="translate(20,4)"%3E%3Cpath d="m0 0c0-1.657-0.447-3-1-3-0.552 0-1 1.343-1 3s0.448 3 1 3c0.553 0 1-1.343 1-3" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(26.753 35.753)"%3E%3Cpath d="m0 0c-0.586 0.586-1.693 0.428-2.475-0.354-0.611-0.611-1.948-2.53-2.222-3.619-0.884 0.195-1.93 0.22-3.056 0.22-1.125 0-2.172-0.025-3.055-0.219-0.275 1.089-1.611 3.007-2.223 3.618-0.781 0.782-1.888 0.94-2.474 0.354s-0.428-1.693 0.353-2.475c0.511-0.51 1.937-1.529 3.027-2.011-0.82-0.533-1.315-1.451-1.315-3.032 0-3.589 2.546-7.312 5.687-7.312 3.142 0 5.688 3.723 5.688 7.312 0 1.581-0.496 2.499-1.316 3.032 1.091 0.482 2.517 1.5 3.027 2.011 0.782 0.782 0.94 1.889 0.354 2.475" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(29.281 17)"%3E%3Cpath d="m0 0c0-6.134-4.603-13-10.281-13s-10.281 6.866-10.281 13c0 6.133 4.603 8.923 10.281 8.923s10.281-2.79 10.281-8.923" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23b)"%3E%3Cpath d="m30 18h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 10h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cpath d="m30 2h-22v4h22v-4z" fill="%23ffcc4d"/%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647-7.858-10-12-10s-6 5.354-6 8 1.858 1.584 6 1.584c4.143 0 12 3.061 12 0.416" fill="%23292f33"/%3E%3C/g%3E%3Cg transform="translate(19 23)"%3E%3Cpath d="m0 0c0-2.647 7.857-10 12-10s6 5.354 6 8-1.857 1.584-6 1.584-12 3.061-12 0.416" fill="%23292f33"/%3E%3C/g%3E%3C/g%3E%3Cg clip-path="url(%23a)"%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647-7.858-8.584-12-8.584s-6 2.443-6 5.089 1.858 4.495 6 4.495c4.143 0 12 1.645 12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(19 23.495)"%3E%3Cpath d="m0 0c0-2.647 7.857-8.584 12-8.584s6 2.443 6 5.089-1.857 4.495-6 4.495-12 1.645-12-1" fill="%23ccd6dd"/%3E%3C/g%3E%3Cg transform="translate(3,18)"%3E%3Cpath d="m0 0c-0.552 0-1 0.447-1 1 0 0.551 0.446 0.999 0.998 1 0.048 0 4.948 0.07 13.596 3.914 0.505 0.227 1.095-2e-3 1.32-0.508 0.224-0.505-3e-3 -1.095-0.508-1.32-9.089-4.039-14.193-4.086-14.406-4.086" fill="%2399aab5"/%3E%3C/g%3E%3Cg transform="translate(35,18)"%3E%3Cpath d="m 0,0 c -0.213,0 -5.316,0.047 -14.406,4.086 -0.505,0.225 -0.732,0.815 -0.508,1.32 0.225,0.505 0.817,0.732 1.32,0.508 C -4.946,2.07 -0.046,2 0.003,2 0.554,1.997 1,1.548 0.999,0.997 0.997,0.446 0.551,0 0,0" fill="%2399aab5"/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A'); + background-repeat: no-repeat; + height: 3.5rem; + width: 3.5rem; + + transition: transform 6.1s cubic-bezier(.68,-0.55,.27,1.55); + } +#bee-emoji-svg { + + height: 3.5rem; + width: 3.5rem; + /* cursor: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" width="25px" height="25px"%3E%3Cpath fill="%2377B255" d="M28.938 27.441c-2.554-.89-8.111-.429-9.938 1.331V17c0-.553-.447-1-1-1s-1 .447-1 1v11.772c-1.827-1.76-7.384-2.221-9.938-1.331-.741.259 5.264 8.749 9.507 4.507.168-.168.306-.33.431-.49V35c0 .553.447 1 1 1s1-.447 1-1v-3.542c.125.16.263.322.431.49 4.243 4.242 10.248-4.248 9.507-4.507z"/%3E%3Cpath fill="%23CCD6DD" d="M12.562 25.65c-.619-.266-1.107-.837-1.378-1.513l-1.266-3.306-3.258-1.393c-1.336-.574-1.876-1.922-1.304-3.259l1.362-3.181-1.364-3.269c-.541-1.35.15-2.868 1.5-3.408l3.272-1.281 1.449-3.384C12.148.32 13.496-.22 14.833.352l3.258 1.396L21.358.382c.675-.271 1.411-.276 2.03-.011.619.265 1.114.819 1.385 1.494l1.274 3.29 3.309 1.417c1.336.572 1.875 1.921 1.305 3.258l-1.451 3.384 1.365 3.267c.541 1.35-.15 2.866-1.5 3.407l-3.271 1.281-1.363 3.183c-.572 1.336-1.922 1.877-3.258 1.305l-3.308-1.417-3.267 1.364c-.676.271-1.427.311-2.046.046z"/%3E%3Cpath fill="%23E1E8ED" d="M29.356 6.572l-3.309-1.417-.055-.143c-1.565 1.337-5.215 4.354-5.215 4.354l.007.123C20.015 8.879 19.057 8.5 18 8.5V1.709L14.833.353c-1.337-.572-2.685-.032-3.258 1.304l-1.449 3.384-.061.024 4.753 4.754c-.814.813-1.318 1.938-1.318 3.181H6.717l-1.361 3.178c-.572 1.337-.032 2.686 1.304 3.259l3.258 1.394.002.006 4.496-5.142c.822 1.09 2.115 1.805 3.584 1.805h.005c.006 1.979.015 5.273.012 6.801l3.164 1.356c1.336.572 2.686.031 3.258-1.305l1.362-3.18-5.192-4.517c1.14-.816 1.89-2.145 1.89-3.654 0-.071-.018-.137-.021-.208 1.802.182 4.951.472 6.822.642l-.092-.22L30.66 9.83c.571-1.337.031-2.686-1.304-3.258z"/%3E%3Ccircle fill="%23F4900C" cx="18" cy="13" r="5"/%3E%3C/svg%3E'), auto;*/ +} + + +.sakura { + opacity: 0; + position: fixed; +} +.envelope { + filter: grayscale(); + opacity: 0; + position: fixed; +} +#bee-emoji-svg:hover .sakuraA, .sakuraA:hover { + opacity: 1; + animation-name: none; + transition: opacity 0.01s linear; + font-size:1em; +} + +#bee-emoji-svg:hover #envelopeA, #envelopeA:hover { + animation-name: envelope-flyA; + animation-delay: 3.5s; +} +#bee-emoji-svg:hover #envelopeB, #envelopeB:hover { + animation-name: envelope-flyB; + animation-delay: 3.55s; +margin-top:2rem; +} +#bee-emoji-svg:hover #envelopeC, #envelopeC:hover { + animation-name: envelope-flyC; + animation-delay: 3.6s; +margin-top:3rem; +} +#bee-emoji-svg:hover #envelopeD, #envelopeD:hover { + animation-name: envelope-flyD; + animation-delay: 3.65s; +margin-top:2rem; +} +#bee-emoji-svg:hover .envelope, .envelope:hover { + animation-duration: 1s; + animation-timing-function: linear; + animation-iteration-count: 1; + animation-play-state: running; + font-size:2em; +} + +@keyframes envelope-flyA { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(-45deg); + } + 20% { + transform: translate(15px, -15px) rotate(-45deg); + } + 40% { + transform: translate(30px, -30px) rotate(-45deg); + opacity: .4; + } + 60% { + transform: translate(45px, -45px) rotate(-45deg); + opacity: .1; + } + 80% { + transform: translate(60px, -60px) rotate(-45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyB { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(45deg); + } + 20% { + transform: translate(15px, 15px) rotate(45deg); + } + 40% { + transform: translate(30px, 30px) rotate(45deg); + opacity: .4; + } + 60% { + transform: translate(45px, 45px) rotate(45deg); + opacity: .1; + } + 80% { + transform: translate(60px, 60px) rotate(45deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyC { + 0% { +opacity: 1; + transform: translate(0, 0) rotate(60deg); + } + 20% { + transform: translate(15px, 30px) rotate(60deg); + } + 40% { + transform: translate(30px, 60px) rotate(60deg); + opacity: .4; + } + 60% { + transform: translate(45px, 90px) rotate(60deg); + opacity: .1; + } + 80% { + transform: translate(60px, 120px) rotate(60deg); + opacity: 0; + } + 100% { + opacity: 0; + } + +} +@keyframes envelope-flyD { + 0% { +opacity: 1; + transform: translate(0, 0); + } + 20% { + transform: translate(15px, 0); + } + 40% { + transform: translate(30px, 0); + opacity: .4; + } + 60% { + transform: translate(45px, 0); + opacity: .1; + } + 80% { + transform: translate(80px, 0); + opacity: 0; + } + 100% { + opacity: 0; + } + +} + +@keyframes harvest { + 0% { + transform: rotate(5deg) translateY(3px) translateX(3px); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(7px) rotate(12deg); + transition: transform linear; + } + 40% { + transform: translateY(3px) translateX(4px) rotate(12deg); + transition: transform linear; + } + 60% { + transform: translateY(3px) rotate(12deg); + transition: transform linear; + } + 70% { + transform: translateY(3px) rotate(10deg); + transition: transform linear; + } + 80% { + transform: translateY(3px) translateX(2px) rotate(7deg); + transition: transform linear; + } + 100% { + transform: translate(3px, 3px) rotate(5deg); } +} diff --git a/images/0-3-0-bee.png b/images/0-3-0-bee.png new file mode 100644 index 0000000..1b28574 Binary files /dev/null and b/images/0-3-0-bee.png differ diff --git a/images/2019-11-04_13.33.15.mp4 b/images/2019-11-04_13.33.15.mp4 new file mode 100644 index 0000000..e1d1231 Binary files /dev/null and b/images/2019-11-04_13.33.15.mp4 differ diff --git a/images/bee.svg b/images/bee.svg new file mode 100644 index 0000000..d89f1b2 --- /dev/null +++ b/images/bee.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/images/bee_minified.svg b/images/bee_minified.svg new file mode 100644 index 0000000..e84a86e --- /dev/null +++ b/images/bee_minified.svg @@ -0,0 +1,2 @@ + + diff --git a/images/blossom.svg b/images/blossom.svg new file mode 100644 index 0000000..4ee1cc0 --- /dev/null +++ b/images/blossom.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/images/compact-listing.png b/images/compact-listing.png new file mode 100644 index 0000000..78c0aff Binary files /dev/null and b/images/compact-listing.png differ diff --git a/images/composer.png b/images/composer.png new file mode 100644 index 0000000..7ee7b35 Binary files /dev/null and b/images/composer.png differ diff --git a/images/conversations-view.png b/images/conversations-view.png new file mode 100644 index 0000000..5a97b95 Binary files /dev/null and b/images/conversations-view.png differ diff --git a/images/conversations-view.webp b/images/conversations-view.webp new file mode 100644 index 0000000..c4a939d Binary files /dev/null and b/images/conversations-view.webp differ diff --git a/images/e6f3a23396305cc9.png?1568542090.1 b/images/e6f3a23396305cc9.png?1568542090.1 new file mode 100644 index 0000000..5a97b95 Binary files /dev/null and b/images/e6f3a23396305cc9.png?1568542090.1 differ diff --git a/images/h2.png b/images/h2.png new file mode 100644 index 0000000..b30f9a9 Binary files /dev/null and b/images/h2.png differ diff --git a/images/hark_canine.png b/images/hark_canine.png new file mode 100644 index 0000000..65dbc75 Binary files /dev/null and b/images/hark_canine.png differ diff --git a/images/haskell-logo.png b/images/haskell-logo.png new file mode 100644 index 0000000..97c0937 Binary files /dev/null and b/images/haskell-logo.png differ diff --git a/images/main.svg b/images/main.svg new file mode 100644 index 0000000..cc64961 --- /dev/null +++ b/images/main.svg @@ -0,0 +1,44 @@ + + + + + + + + + + + mail contact list status personal acc (Common) Lisp on bare metal (7) 0 INBOX 314 2020-02-04 01:47:12▁▁▁▁pfm@wp.eu, Refpga <refpga@disroot.org>, orbifx <fox@orbitalfox.eu>▁▁▁▁▁▁▁▁▁▁▁▁▁1 Sent ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ [GitHub] A personal access token has been added to your account personal acc 2020-02-04 01:23:23▁▁▁▁GitHub <noreply@github.com>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁offline ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ [GitHub] A third-party OAuth application has been added to your account university 2020-02-04 01:21:54▁▁▁▁GitHub <noreply@github.com>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁0 INBOX 376 ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓1 Drafts Thinking of trying Lisp (11) 2 Junk 138 2020-02-03 16:06:37▁▁▁▁orbifx <fox@orbitalfox.eu>, Refpga <refpga@disroot.org>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁3 Lists ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓4 21mutt- This equation will change how you see the world - Invidious 5 ntua 2020-02-03 15:54:56▁▁▁▁orbifx <fox@orbitalfox.eu>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁6 Sent ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓7 sent-mail All 'big five' tech firms listened to private conversations (privacy, FAAMG) (2) 2020-02-03 08:26:36▁▁▁▁orbifx <fox@orbitalfox.eu>, Nsukami Patrick <ptrck@nskm.xyz>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁vagary ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓0 testing_ac Brexit "done" & Scotland pulled out of the EU 1 puppies 2020-02-03 00:50:53▁▁▁▁orbifx <fox@orbitalfox.eu>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ Re: organic farming is actually worse for climate change? 2020-02-02 15:09:24▁▁▁▁6gain <janus-gaia@exmosis.net>▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁NORMAL | Mailbox: INBOX, Messages: 887, New: 314 + diff --git a/images/meli-logo.jpg b/images/meli-logo.jpg new file mode 100644 index 0000000..5892181 Binary files /dev/null and b/images/meli-logo.jpg differ diff --git a/images/meli-logo.jpg.old b/images/meli-logo.jpg.old new file mode 100644 index 0000000..799494a Binary files /dev/null and b/images/meli-logo.jpg.old differ diff --git a/images/meli-logo.png b/images/meli-logo.png new file mode 100644 index 0000000..4f84f2b Binary files /dev/null and b/images/meli-logo.png differ diff --git a/images/plain-listing.png b/images/plain-listing.png new file mode 100644 index 0000000..1480ce7 Binary files /dev/null and b/images/plain-listing.png differ diff --git a/images/posts/2019-12-09-alpha-release/contacts.png b/images/posts/2019-12-09-alpha-release/contacts.png new file mode 100644 index 0000000..3735527 Binary files /dev/null and b/images/posts/2019-12-09-alpha-release/contacts.png differ diff --git a/images/posts/2019-12-09-alpha-release/imap_status.png b/images/posts/2019-12-09-alpha-release/imap_status.png new file mode 100644 index 0000000..f714d53 Binary files /dev/null and b/images/posts/2019-12-09-alpha-release/imap_status.png differ diff --git a/images/posts/2019-12-09-alpha-release/list_actions.png b/images/posts/2019-12-09-alpha-release/list_actions.png new file mode 100644 index 0000000..06c996e Binary files /dev/null and b/images/posts/2019-12-09-alpha-release/list_actions.png differ diff --git a/images/posts/2019-12-09-alpha-release/maildir_status.png b/images/posts/2019-12-09-alpha-release/maildir_status.png new file mode 100644 index 0000000..1cd0200 Binary files /dev/null and b/images/posts/2019-12-09-alpha-release/maildir_status.png differ diff --git a/images/posts/2019-12-09-alpha-release/tags.png b/images/posts/2019-12-09-alpha-release/tags.png new file mode 100644 index 0000000..e16fc52 Binary files /dev/null and b/images/posts/2019-12-09-alpha-release/tags.png differ diff --git a/images/posts/c8d041b1f73642bb_watermelon_theme.png b/images/posts/c8d041b1f73642bb_watermelon_theme.png new file mode 100644 index 0000000..35b9fe3 Binary files /dev/null and b/images/posts/c8d041b1f73642bb_watermelon_theme.png differ diff --git a/images/posts/v0.6.0.png b/images/posts/v0.6.0.png new file mode 100644 index 0000000..9f72ede Binary files /dev/null and b/images/posts/v0.6.0.png differ diff --git a/images/sample-config.png b/images/sample-config.png new file mode 100644 index 0000000..acd9d36 Binary files /dev/null and b/images/sample-config.png differ diff --git a/images/screenshots/add_contact_from_mail.png b/images/screenshots/add_contact_from_mail.png new file mode 100644 index 0000000..22a5a66 Binary files /dev/null and b/images/screenshots/add_contact_from_mail.png differ diff --git a/images/screenshots/add_contact_from_mail.webp b/images/screenshots/add_contact_from_mail.webp new file mode 100644 index 0000000..55def6a Binary files /dev/null and b/images/screenshots/add_contact_from_mail.webp differ diff --git a/images/screenshots/command_auto_complete_and_history.png b/images/screenshots/command_auto_complete_and_history.png new file mode 100644 index 0000000..ffb5499 Binary files /dev/null and b/images/screenshots/command_auto_complete_and_history.png differ diff --git a/images/screenshots/command_auto_complete_and_history.svg b/images/screenshots/command_auto_complete_and_history.svg new file mode 100644 index 0000000..4d66222 --- /dev/null +++ b/images/screenshots/command_auto_complete_and_history.svg @@ -0,0 +1 @@ +mail contact list status fastmail-j Date: Fri, 12 Jun 2020 14:31:13 +0000 0 Inbox 5 From: The Spider Shop <info@thespidershop.co.uk> 1 Archive To: el13635@mail.ntua.gr set compact set conversations set plain set seen set threaded set unseen setenv setenv EX | 4 \ No newline at end of file diff --git a/images/screenshots/command_auto_complete_and_history.webp b/images/screenshots/command_auto_complete_and_history.webp new file mode 100644 index 0000000..23ed8af Binary files /dev/null and b/images/screenshots/command_auto_complete_and_history.webp differ diff --git a/images/screenshots/compose-context.png b/images/screenshots/compose-context.png new file mode 100644 index 0000000..e957f97 Binary files /dev/null and b/images/screenshots/compose-context.png differ diff --git a/images/screenshots/compose-context.webp b/images/screenshots/compose-context.webp new file mode 100644 index 0000000..9ef4fdf Binary files /dev/null and b/images/screenshots/compose-context.webp differ diff --git a/images/screenshots/compose.png b/images/screenshots/compose.png new file mode 100644 index 0000000..7837237 Binary files /dev/null and b/images/screenshots/compose.png differ diff --git a/images/screenshots/compose.webp b/images/screenshots/compose.webp new file mode 100644 index 0000000..68dafb5 Binary files /dev/null and b/images/screenshots/compose.webp differ diff --git a/images/screenshots/composing.png b/images/screenshots/composing.png new file mode 100644 index 0000000..96a7cf4 Binary files /dev/null and b/images/screenshots/composing.png differ diff --git a/images/screenshots/composing.svg b/images/screenshots/composing.svg new file mode 100644 index 0000000..7d560d3 --- /dev/null +++ b/images/screenshots/composing.svg @@ -0,0 +1 @@ +mail contact list status composing ▍ COMPOSING MESSAGE /t/m/bde4e0ce-e5b2-43dc-88cf-3f399e5e4c9d 8 Date: Sat, 13 Jun 2020 12:28:55 +0300 7 From: meli_devel@fea.st 6 To: 5 Cc: 4 Bcc: 3 Message-ID: <buych.nc1yfm5f6g1o@fea.st> 2 Subject: 1 User-Agent: meli 0.5.0 9 ~ ~ ~ ~ NORMAL /tmp/meli/bde4e0ce-e5b2-43dc-88cf-3f399e5e4c9d 100% ☰ 9: 1 ☐ don't sign no attachments EMBED | Mailbox: Inbox, Messages: 6, New: 5 \ No newline at end of file diff --git a/images/screenshots/composing.webp b/images/screenshots/composing.webp new file mode 100644 index 0000000..8fba955 Binary files /dev/null and b/images/screenshots/composing.webp differ diff --git a/images/screenshots/conversations-view-open-thread.png b/images/screenshots/conversations-view-open-thread.png new file mode 100644 index 0000000..5c0df93 Binary files /dev/null and b/images/screenshots/conversations-view-open-thread.png differ diff --git a/images/screenshots/conversations-view-open-thread.webp b/images/screenshots/conversations-view-open-thread.webp new file mode 100644 index 0000000..2231e7e Binary files /dev/null and b/images/screenshots/conversations-view-open-thread.webp differ diff --git a/images/screenshots/conversations.png b/images/screenshots/conversations.png new file mode 100644 index 0000000..e289365 Binary files /dev/null and b/images/screenshots/conversations.png differ diff --git a/images/screenshots/conversations.webp b/images/screenshots/conversations.webp new file mode 100644 index 0000000..e2bd402 Binary files /dev/null and b/images/screenshots/conversations.webp differ diff --git a/images/screenshots/gpg_signatures_verification.png b/images/screenshots/gpg_signatures_verification.png new file mode 100644 index 0000000..daab5a2 Binary files /dev/null and b/images/screenshots/gpg_signatures_verification.png differ diff --git a/images/screenshots/gpg_signatures_verification.webp b/images/screenshots/gpg_signatures_verification.webp new file mode 100644 index 0000000..1d214e6 Binary files /dev/null and b/images/screenshots/gpg_signatures_verification.webp differ diff --git a/images/screenshots/light_theme.png b/images/screenshots/light_theme.png new file mode 100644 index 0000000..6133d5f Binary files /dev/null and b/images/screenshots/light_theme.png differ diff --git a/images/screenshots/light_theme.webp b/images/screenshots/light_theme.webp new file mode 100644 index 0000000..9ab2052 Binary files /dev/null and b/images/screenshots/light_theme.webp differ diff --git a/images/screenshots/press_?_for_shortcuts.png b/images/screenshots/press_?_for_shortcuts.png new file mode 100644 index 0000000..0493782 Binary files /dev/null and b/images/screenshots/press_?_for_shortcuts.png differ diff --git a/images/screenshots/press_?_for_shortcuts.svg b/images/screenshots/press_?_for_shortcuts.svg new file mode 100644 index 0000000..86cbbb3 --- /dev/null +++ b/images/screenshots/press_?_for_shortcuts.svg @@ -0,0 +1 @@ +mail contact list status fa┌─────────────────────────────────────────────────────────────────────────────────────────┐me0 shortcut maps Press ? to close t-1 use EXECUTE command "search" to find shortcuts me2 Use Up, Down, Left, Right to scroll. ru3 n 4 compact listing an5 i exit_thread Enter open_thread v select_entry general M-n go_to_tab T next_tab Down scroll_down Left scroll_left Right scroll_right Up scroll_up └─────────────────────────────────────────────────────────────────────────────────────────┘ NORMAL | Mailbox: Inbox, Messages: 6, New: 5 \ No newline at end of file diff --git a/images/screenshots/press_?_for_shortcuts.webp b/images/screenshots/press_?_for_shortcuts.webp new file mode 100644 index 0000000..13ac73a Binary files /dev/null and b/images/screenshots/press_?_for_shortcuts.webp differ diff --git a/images/screenshots/recipient_auto_complete.png b/images/screenshots/recipient_auto_complete.png new file mode 100644 index 0000000..f687b44 Binary files /dev/null and b/images/screenshots/recipient_auto_complete.png differ diff --git a/images/screenshots/recipient_auto_complete.webp b/images/screenshots/recipient_auto_complete.webp new file mode 100644 index 0000000..b8aca1f Binary files /dev/null and b/images/screenshots/recipient_auto_complete.webp differ diff --git a/images/screenshots/single-thread-view.png b/images/screenshots/single-thread-view.png new file mode 100644 index 0000000..2fb456f Binary files /dev/null and b/images/screenshots/single-thread-view.png differ diff --git a/images/screenshots/single-thread-view.webp b/images/screenshots/single-thread-view.webp new file mode 100644 index 0000000..0dc9293 Binary files /dev/null and b/images/screenshots/single-thread-view.webp differ diff --git a/images/screenshots/threads.png b/images/screenshots/threads.png new file mode 100644 index 0000000..e570661 Binary files /dev/null and b/images/screenshots/threads.png differ diff --git a/images/screenshots/threads.png.old b/images/screenshots/threads.png.old new file mode 100644 index 0000000..47a956d Binary files /dev/null and b/images/screenshots/threads.png.old differ diff --git a/images/screenshots/threads.webp b/images/screenshots/threads.webp new file mode 100644 index 0000000..fb95968 Binary files /dev/null and b/images/screenshots/threads.webp differ diff --git a/images/sct1.png b/images/sct1.png new file mode 100644 index 0000000..bdce338 Binary files /dev/null and b/images/sct1.png differ diff --git a/images/sct2.png b/images/sct2.png new file mode 100644 index 0000000..52ef60b Binary files /dev/null and b/images/sct2.png differ diff --git a/images/sct5.png b/images/sct5.png new file mode 100644 index 0000000..d6f007f Binary files /dev/null and b/images/sct5.png differ diff --git a/images/shortcuts-view.png b/images/shortcuts-view.png new file mode 100644 index 0000000..8167239 Binary files /dev/null and b/images/shortcuts-view.png differ diff --git a/images/sprite.png b/images/sprite.png new file mode 100644 index 0000000..f94d6cd Binary files /dev/null and b/images/sprite.png differ diff --git a/images/thread-view.png b/images/thread-view.png new file mode 100644 index 0000000..d26da04 Binary files /dev/null and b/images/thread-view.png differ diff --git a/images/threaded-listing.png b/images/threaded-listing.png new file mode 100644 index 0000000..c13a1a1 Binary files /dev/null and b/images/threaded-listing.png differ diff --git a/images/xbiff.gif b/images/xbiff.gif new file mode 100644 index 0000000..2b81f7c Binary files /dev/null and b/images/xbiff.gif differ diff --git a/make_manpage.sh b/make_manpage.sh new file mode 100755 index 0000000..a38f3b5 --- /dev/null +++ b/make_manpage.sh @@ -0,0 +1,4 @@ +#!/bin/bash + +# sed Removes trailing whitespace in
 elements
+wget --timestamping "https://git.meli.delivery/meli/meli/raw/branch/master/"$1 -O - | mandoc -I os="rendered by mandoc" -Kutf-8 -Ofragment,toc,style="css/manpage.css",includes="#%I",man="#%N.%S" -Thtml | sed 's/\s*<\/pre/<\/pre/'
diff --git a/pages/documentation.md b/pages/documentation.md
new file mode 100644
index 0000000..4da80cf
--- /dev/null
+++ b/pages/documentation.md
@@ -0,0 +1,31 @@
+---
+bees: What if bees lived in your socks?
+ogDescription: Quick start tutorial and reference manual
+---
+
+# Quick start tutorial{#quick-start}
+
+Follow the installation instructions in the [README](https://git.meli.delivery/meli/meli/src/branch/master/README.md).
+
+Launch `meli`{.Nm .shake-little} with no arguments, and you will be asked if you want to create a sample configuration.
+
+The [sample configuration](https://git.meli.delivery/meli/meli/src/branch/master/samples/sample-config.toml) (created by default in `~/.config/meli/config.toml`{.Pa}) includes comments with the basic settings required for setting up accounts allowing you to copy and edit right away. See [meli.conf(5)](#meli.conf) for the available configuration options. 
+
+The main screen when you launch `meli`{.Nm .shake-little} is the INBOX of the first account you have configured.
+
+- With J / K you can select the next/previous folder. (To go to a specific one directly, press Space and type the command `go n`{.Cm} where n is the number of the folder)
+- With h / l you can select the next/previous account.
+- Use the arrow keys to browse entries in the e-mail list of a folder. (Along with Home / End / PgUp / PgDn)
+- Use Enter to open an entry and i to exit it.
+- Use m to start writing new e-mail. (or R to reply to the entry you're currently viewing)
+- Use the arrow keys to edit each field of the e-mail.
+- Attachments can be added by pressing Space and typing the command `add-attachment`{.Cm} `PATH`{.Pa} where `PATH`{.Pa} is the filesystem path of the attachment file.
+- Edit the draft body at eny time by pressing e
+- Send your e-mail by pressing s
+- Discard or save your draft by pressing Space and typing the command `close`{.Cm}
+
+At any time, you can press ? to show a list of all available actions and shortcuts, along with every possible setting and command that your version supports.
+
+Press T to cycle between tabs or Alt + 1 ... 9 to choose.
+
+Press q to exit.
diff --git a/pages/download.md b/pages/download.md
new file mode 100644
index 0000000..e68df92
--- /dev/null
+++ b/pages/download.md
@@ -0,0 +1,58 @@
+---
+showTitle: true
+title: download
+bees: What if you and bees had highly different taste in music? 
+---
+
+* git 
+* read-only github mirror 
+
+## install
+

Debian

+

Download an amd64 deb package here. Contributions for more packaging is welcome.

+

static amd64 linux binary

+

https://github.com/meli/meli/releases/

+

other prebuilt binaries

+

not available yet. Compile from source or install with cargo.

+ +### cargo{#cargo} +Note: `cargo` cannot distribute documentation. Install with `--features="cli-docs"` with `mandoc` or `man` in your system to use the command-line flags `--print-documentation [main config themes]` to print documentation in your terminal. + +```sh +cargo install meli +``` + +## build +Build instructions can be found in the `README` file, but for convenience here's how to get it up and running: + +```sh +git clone --depth=1 https://git.meli.delivery/meli/meli.git +cd meli +# print help +make +# try without installing: +# make meli +# ./target/release/meli +make PREFIX=$HOME/.local install +``` + +Read the [Quick start tutorial](documentation.html#quick-start). Documentation is located in the man pages and mirrored online [here](documentation.html). + +Developed with focus on Linux for now, but if you get compilation errors or find bugs in your \*nix please report it in [meli-general](https://lists.meli.delivery) or [our issue tracker](https://git.meli.delivery/meli/meli/issues). + + +## contributing +There are no concrete contribution guidelines yet as the development workflow is still in its infancy. Mail your [patches](https://git-scm.com/docs/git-format-patch) to [meli-devel](https://lists.meli.delivery). + +## bugs/support/feature requests + If you encounter a bug or a lack of features, you are encouraged to contact [meli-general](https://lists.meli.delivery). You don't need to subscribe to the mailing lists, but your message will have to be approved first. + + Alternatively, you can post on our [issue tracker](https://git.meli.delivery/meli/meli/issues) without registering by sending an e-mail to `issues@` this address with the title of your report as the Subject and your text in the body. To hide your name and address while still being able to control your report, send your e-mail to `issues+anonymous@` instead. + + By sending an e-mail to `issues@`, you will receive a special password you can use to control your report with a link to your issue. You will be automatically subscribed to replies to this issue. You can use the password to: + + - close the issue `issues+${password}+close@` + - subscribe/unsubscribe to replies `issues+${password}+unsubscribe@`, `issues+${password}+subscribe@` + - reply `issues+${password}+reply@` (if your posting is anonymous, you will remain so) + + If you encounter issues with `issues@` you can fall back to [meli-general](https://lists.meli.delivery) and report this as well. diff --git a/pages/index.md b/pages/index.md new file mode 100644 index 0000000..a966d04 --- /dev/null +++ b/pages/index.md @@ -0,0 +1,18 @@ +--- +html_title: meli terminal mail client +showTitle: false +mainClass: wrapper +bees: What if bees could travel through paintings? +screenshots: + - url : "/images/screenshots/conversations.webp" + desc: "Threads take one row by default." + - url : "/images/screenshots/conversations-view-open-thread.webp" + desc: "Viewing a thread." + - url : "/images/screenshots/threads.webp" + desc: "Compact view." + - url : "/images/screenshots/single-thread-view.webp" + desc: "Viewing a single thread. (UI not final)" + - url : "/images/screenshots/composing.svg" + desc: "Composing replies" +tag: alpha-0.6.0 +--- diff --git a/pages/mailing-lists.md b/pages/mailing-lists.md new file mode 100644 index 0000000..3bc99c0 --- /dev/null +++ b/pages/mailing-lists.md @@ -0,0 +1,19 @@ +--- +title: mailing lists +bees: What if bees abstained from voting? +--- +## contact/discuss/support +[mailing lists:](https://lists.meli.delivery) + + * mailing list `` [subscribe](https://lists.meli.delivery/mailman3/lists/meli-general.meli.delivery/) + * development list `` [subscribe](https://lists.meli.delivery/mailman3/lists/meli-devel.meli.delivery/) + * announcement list `` [subscribe](https://lists.meli.delivery/mailman3/lists/meli-announce.meli.delivery/) + + +[looking to contribute?](/download.html#contributing) + +## archives +[https://lists.meli.delivery/archives/](https://lists.meli.delivery/archives/) + +## IRC +there might also be people idling in `#meli` on freenode. diff --git a/pages/screenshots.md b/pages/screenshots.md new file mode 100644 index 0000000..10d1e68 --- /dev/null +++ b/pages/screenshots.md @@ -0,0 +1,26 @@ +--- +bees: What if bees built coral reefs? +screenshots: + - url : "/images/screenshots/light_theme.webp" + desc: "light theme" + - url : "/images/screenshots/composing.svg" + desc: "composing a mail" + - url : "/images/screenshots/add_contact_from_mail.webp" + desc: "adding contacts from received mail" + - url : "/images/screenshots/press_%3F_for_shortcuts.svg" + desc: "press ? for help with shortcuts" + - url : "/images/screenshots/command_auto_complete_and_history.svg" + desc: "enter commands with auto-completion" + - url : "/images/screenshots/gpg_signatures_verification.webp" + desc: "verification of gpg signatures" + - url : "/images/screenshots/recipient_auto_complete.webp" + desc: "autocompletion of email addresses" + - url : "/images/screenshots/conversations.webp" + desc: "Threads take one row by default." + - url : "/images/screenshots/conversations-view-open-thread.webp" + desc: "Viewing a thread." + - url : "/images/screenshots/threads.webp" + desc: "Compact view." + - url : "/images/screenshots/single-thread-view.webp" + desc: "Viewing a single thread. (UI not final)" +--- diff --git a/posts/2019-06-15-pre-alpha.markdown b/posts/2019-06-15-pre-alpha.markdown new file mode 100644 index 0000000..c2099ab --- /dev/null +++ b/posts/2019-06-15-pre-alpha.markdown @@ -0,0 +1,133 @@ +--- +title: pre-alpha release +ogTitle: pre-alpha release +author: epilys +date: 2019-06-15 00:00:00 +date_iso_8601: 2019-06-15T00:00:00+02:00 +bees: What if bees are contagious? +left: + - url : "/images/sample-config.png" + desc: "Sample generated config on first run." + - url : "/images/thread-view.png" + desc: "Viewing a thread." +right: + - url : "/images/compact-listing.png" + desc: "Compact mail listing." + class: "dull-red bold" + - url : "/images/plain-listing.png" + desc: "Plain mail listing." + class: "cyan bold" + - url : "/images/threaded-listing.png" + desc: "Threaded mail listing." + class: "green bold" + - url : "/images/shortcuts-view.png" + desc: "View currently applicable shortcuts." +updates: + - date: 2019-07-08 + content: Added mastodon account link, discussion link. +--- + +An early release with basic features and only Maildir support has been published in [meli's git repositories](https://git.meli.delivery/meli/meli/src/tag/pre-alpha-0.0). meli is a new experimental mail client for the terminal. It's a from-scratch implementation in order to experiment with ideas I had about a client's design. + +Contributions and development will be hosted on [meli-devel@](https://lists.meli.delivery/mailman3/lists/meli-devel.meli.delivery/), as on the long run I would like to make mailing-list driven development comfortable and newbie-friendly by eliminating effort on the side of the contributor; the mailing list software should lift most of the burden by acting as a bug tracker, patch archive, maintainer tool, build tool. Note: no contribution guide has been drafted yet. + +You can follow [meli-announce@](https://lists.meli.delivery/mailman3/lists/meli-announce.meli.delivery/), my mastodon account [\@epilys@chaos.social](https://chaos.social/@epilys) and the [RSS feed](/rss.xml) for updates. + +General discussion, comments, etc is welcome on [meli-general@](https://lists.meli.delivery/mailman3/lists/meli-general.meli.delivery/). + +meli aims to be a modal and hopefully a very configurable client. An API for plugins is in the current plans, allowing sufficient control of the client through scripting. + +## what is usable now +While this stuff is on the roadmap, the pre-alpha supports Maildir folder structures, and three ways to render every folder: [one row per thread]{.dull-red .bold}, [one row per message]{.cyan .bold} and [one row per message]{.green .bold} but with the thread structure visible. Browsing a thread is done in the same view as reading the email, where you can simultaneously browse the thread and read an mail's content. Replying to an email can also come with the same thread view in order to have the whole conversation available while composing; composing is done in a different tab, so you can switch tabs anytime. + +Commands can be executed via configurable shortcuts (bindings for the current view can be listed with the `?` shortcut) in `NORMAL` mode or commands in `EXECUTE` mode. Documentation is provided in a man page located in the root folder of the repository. You can view it with `man -l meli.1`{.shell} or rendered with `mandoc` on the [documentation page](/documentation.html). + +## what basic functionality is coming later + +For the moment there's no attachment ability in new e-mails, no IMAP support, no full text search ability or integration with notmuch. I suspect notmuch integration will coincide with the start of the API. + +## what I am doing generally + +MUAs are a lot of work, it turns out. I've been trying to scale it horizontally from the beginning, and I believe this helped as I was more focused on the overall architecture than individual functionalities. I have also tried to avoid adding dependencies when I could. I find it scary to install something and get hundreds of packages pulled. + +I hope I can make it into a decent tool :) + +## technical stuff + +`meli` is written in Rust, with an Entity-Component-System design. The mail specific functions are done in a separate library crate, which means it can be reused for other mail applications. + +### entity component system +A description of the ECS logic can be found here +Every component of the application represents a single entity that can draw on the terminal, access user data or spawn processes. This is the entity & component part of the ECS architecture merged together. + +All components implement the `Component`{.rust} trait: +```rust +pub trait Component { + fn draw(&mut self, grid: &mut CellBuffer, area: Area, context: &mut Context); + fn process_event(&mut self, event: &mut UIEvent, context: &mut Context) -> bool; + fn is_dirty(&self) -> bool; + fn set_dirty(&mut self); + + /* ... */ +} +``` + +The program's data state is held in a System object called `Context`{.rust}. The `State`{.rust} object holds the necessary bits to run the basic event loop. + +```rust +struct Context { + pub accounts: Vec, + pub mailbox_hashes: FnvHashMap, + pub settings: Settings, + + pub runtime_settings: Settings, + /// Areas of the screen that must be redrawn in the next render + pub dirty_areas: VecDeque, + + /// Events queue that components send back to the state + pub replies: VecDeque, + sender: Sender, + receiver: Receiver, + input: InputHandler, + + pub temp_files: Vec, +} + +struct State { + cols: usize, + rows: usize, + + grid: CellBuffer, /* The terminal as a grid */ + stdout: Option, + child: Option, + pub mode: UIMode, /* Normal, Input, Execute input, Fork.. */ + components: Vec>, /* UI components */ + pub context: Context, + threads: FnvHashMap, thread::JoinHandle<()>)>, + work_controller: WorkController, /* async jobs */ +} +``` +### drawing output +An event loop looks roughly like this: + +- see if `Context`{.rust} contains events to be received. These events are added by Components in previous loops. +- if any event existed, the grid might be modified. So redraw all dirty bits of the terminal grid. +- block on multiple writers-single reader channel that receives from the input thread, the mail update polling threads, timers, and anything else that accesses `Context.sender`{.rust} field. +- `State`{.rust} passes down the events by calling `component.process_event(&mut event, &mut self.context)`{.rust}. Components recursively pass the event down to their children. + +UI updates are supposed to be incremental for speed. Single envelope updates should only cause the minimally required UI updates. + +When drawing, Components update the grid and push the area coordinates of their updates to `Context`{.rust}. When State finally redraws in the next event loop, it does a horizontal sweep in all the dirty areas to avoid redrawing common parts. Areas are sorted by `x` coordinate and common segments of all dirty areas are drawn once. + +### data handling +To represent relationships between different objects without references, vector indexes and hashmap keys are used. This way most data reading or modification is done inside the `Context`{.rust} object. Caution must be exercised to keep all these indirect references up to date when something is modified or deleted. + +A great difficulty I face in debugging is visualising all these connections. I've started a library to provide access to `Debug`{.rust} implementations for gdb's pretty printing python API but I haven't reached any result yet. + +Mail parsing is done asynchronously in separate threads. Mail backends such as IMAP, Maildir have to implement a `Backend`{.rust} trait. So far I've used the trait only with Maildir, which means it was written with its needs and abilities in mind. If all goes well, IMAP should start in the nearish future. + +Discussions: + +- [*lobste.rs*](https://lobste.rs/s/fqcpxq/meli_new_mail_client_for_terminal_pre) +- [*reddit/r/rust*](https://www.reddit.com/r/rust/comments/ca9k75/meli_a_new_mail_client_for_the_terminal_prealpha/) +- [*hackernews*](https://news.ycombinator.com/item?id=20378657) diff --git a/posts/2019-09-16-v0.3.0-release.markdown b/posts/2019-09-16-v0.3.0-release.markdown new file mode 100644 index 0000000..63b44c2 --- /dev/null +++ b/posts/2019-09-16-v0.3.0-release.markdown @@ -0,0 +1,42 @@ +--- +title: v0.3.0 release - Now with IMAP, xbiff support +ogTitle: v0.3.0 release - Now with IMAP, xbiff support +author: epilys +date: 2019-09-16 00:00:00 +date_iso_8601: 2019-09-16T00:00:00+02:00 +bees: What if bees seized the means of reduction? +left: + - url : "/images/screenshots/conversations.webp" + desc: "" + - url : "/images/screenshots/conversations-view-open-thread.webp" + desc: "Viewing a thread." +right: + - url : "/images/xbiff.gif" + desc: "co-operation with modern tools is a priority" +--- + +[Get meli v0.3.0](https://git.meli.delivery/meli/meli/src/tag/pre-alpha-0.3.0) meli is now a `make && make PREFIX=$HOME/.local install` away! +\ +\ +![release bee](/images/0-3-0-bee.png){.float_left_img} + +## changelog: + +- IMAP support. Unpolished and experimental. +- [xbiff](https://linux.die.net/man/1/xbiff) support +- added portable Makefile for installation +- added manual page for the configuration file [meli.conf(5)](/documentation.html#meli.conf) +- various configuration changes can be seen in meli.conf(5) +- add conversations thread mailing view: a one entry per thread listing, but entries are less compact; they take 3 rows. Pager opens on the right. Intended for big terminals. +- added folder operations (create, delete, rename) +- added special use semantics for mailboxes: you can specify which mailboxes are special, eg specify `INBOX/Sent` as the `Sent` folder, `INBOX/Drafts` as `Drafts`, etc. This is optional as it in most cases it can be inferred by the names. +- add folder subscriptions: don't load all folders on startup, only the ones the user has specified + +## status +As before, this is a rough around the edges release. I'm working on a lot of stuff simultaneously and I can't stop and improve something. Please understand. + +Consider trying this release and file bug reports for any problems or suggestions you have. Documentation can be found in the installed manpages, `man` [meli](/documentation.html#meli) and `man` [meli.conf](/documentation.html#meli.conf). You will unfortunately have to sign up in meli's [gitea instance](https://git.meli.delivery/meli/meli/) to file bugs though. I am considering writing a bot to transfer mails from a bug report mailing list to gitea via its API. + +You're welcome to reach me via [Mastodon \@epilys@chaos.social](https://chaos.social/@epilys) or if you're feeling extremely enthusiastic, the [meli-general@](https://lists.meli.delivery/mailman3/lists/meli-general.meli.delivery/) mailing list. + +You can follow [meli-announce@](https://lists.meli.delivery/mailman3/lists/meli-announce.meli.delivery/), my mastodon account [\@epilys@chaos.social](https://chaos.social/@epilys) and the [RSS feed](/rss.xml) for updates. diff --git a/posts/2019-10-25-making-a-quick-and-dirty-terminal-emulator.markdown b/posts/2019-10-25-making-a-quick-and-dirty-terminal-emulator.markdown new file mode 100644 index 0000000..2c041ff --- /dev/null +++ b/posts/2019-10-25-making-a-quick-and-dirty-terminal-emulator.markdown @@ -0,0 +1,454 @@ +--- +title: making a quick and dirty terminal emulator +ogTitle: making a quick and dirty terminal emulator +author: epilys +date: 2019-10-25 00:00:00 +date_iso_8601: 2019-10-25T00:00:00+02:00 +bees: What if bees were made of bigger bees but smaller? +--- +
+Nested meli instances +
I gave up at 15 levels deep (though I had to stretch the height a lot to view them all)
+
+ +## Background +In order to be able to compose e-mail within meli and avoid writing an editor, making an embed terminal was obviously my only choice. I didn't bother to look if there are already libraries in Rust for this because as always my prime motivator is figuring things out, for fun. + +If you have ever executed `tty` before you'd probably see a response like `/dev/pts/16`. `pts` stands for pseudoterminal slave: the process (such as a shell) running inside it thinks it's speaking directly to an actual terminal, i.e. the virtual console you see when you Ctrl Alt F1 etc. Terminal emulators such as `xterm` create pseudoterminals and communicate with them by reading and writing to the pts device and the pseudoterminal reads and writes to `/dev/ptmx`. The kernel handles the pairing of I/O between each master/slave. You'll read how to create one below, but for more information read `pty(7)` on Linux, `pty(4)` on *BSDs. + +> A pseudoterminal (sometimes abbreviated "pty") is a pair of virtual +> character devices that provide a bidirectional communication channel. One +> end of the channel is called the master; the other end is called the slave. +> The slave end of the pseudoterminal provides an interface that behaves +> exactly like a classical terminal. A process that expects to be connected to +> a terminal, can open the slave end of a pseudoterminal and then be driven +> by a program that has opened the master end. Anything that is written on the +> master end is provided to the process on the slave end as though it was +> input typed on a terminal. For example, writing the interrupt character +> (usually control-C) to the master device would cause an interrupt signal +> (SIGINT) to be generated for the foreground process group that is connected +> to the slave. Conversely, anything that is written to the slave end of +> the pseudoterminal can be read by the process that is connected to the master +> end. Pseudoterminals are used by applications such as network login +> services (ssh(1), rlogin(1), telnet(1)), terminal emulators such as xterm(1), +> script(1), screen(1), tmux(1), unbuffer(1), and expect(1). + + +## First steps + +Let's begin with creating the pty: + +```rust +use crate::terminal::position::Area; +use nix::fcntl::{open, OFlag}; +use nix::{ioctl_none_bad, ioctl_write_ptr_bad}; +use nix::pty::{grantpt, posix_openpt, ptsname, unlockpt, Winsize}; +use nix::sys::stat::Mode; + +use libc::TIOCSCTTY; +// ioctl request code to set window size of pty: +use libc::TIOCSWINSZ; +use std::path::Path; +use std::process::{Command, Stdio}; + +use std::os::unix::io::{FromRawFd, IntoRawFd}; + +// nix macro that generates an ioctl call to set window size of pty: +ioctl_write_ptr_bad!(set_window_size, TIOCSWINSZ, Winsize); + +// request to "Make the given terminal the controlling terminal of the calling process" +ioctl_none_bad!(set_controlling_terminal, TIOCSCTTY); + +pub fn create_pty() -> nix::Result<()> { + /* Create a new master */ + let master_fd = posix_openpt(OFlag::O_RDWR)?; + + /* For some reason, you have to give permission to the master to have a + * pty. What is it good for otherwise? */ + grantpt(&master_fd)?; + unlockpt(&master_fd)?; + + /* Get the path of the slave */ + let slave_name = unsafe { ptsname(&master_fd) }?; + + /* Try to open the slave */ + let _slave_fd = open(Path::new(&slave_name), OFlag::O_RDWR, Mode::empty())?; + + /* Launch our child process. The main application loop can inspect and then + pass the stdin data to it. */ + let _child_pid = match fork() { + Ok(ForkResult::Child) => { + /* Open slave end for pseudoterminal */ + let slave_fd = open(Path::new(&slave_name), OFlag::O_RDWR, stat::Mode::empty())?; + + // assign stdin, stdout, stderr to the tty + dup2(slave_fd, STDIN_FILENO).unwrap(); + dup2(slave_fd, STDOUT_FILENO).unwrap(); + dup2(slave_fd, STDERR_FILENO).unwrap(); + /* Become session leader */ + nix::unistd::setsid().unwrap(); + unsafe { set_controlling_terminal(slave_fd) }.unwrap(); + nix::unistd::execv( + &CString::new("/usr/bin/vim").unwrap(), + Vec::new(), + ).unwrap(); + /* This path shouldn't be executed. */ + std::process::exit(-1); + } + Ok(ForkResult::Parent { child }) => child, + Err(e) => panic!(e), + }; + + /* Continue dealing with the pty in a thread so that the main application doesn't lock up */ + std::thread::Builder::new() + .spawn(move || { + let winsize = Winsize { + ws_row: 25, + ws_col: 80, + ws_xpixel: 0, + ws_ypixel: 0, + }; + let master_fd = master_fd.into_raw_fd(); + /* Tell the master the size of the terminal */ + unsafe { set_window_size(master_fd, &winsize).unwrap() }; + let master_file = unsafe { std::fs::File::from_raw_fd(master_fd) }; + /* start the pty liaison */ + liaison(master_file); + }) + .unwrap(); + Ok(()) +} +``` +So far graphics are not in the picture (heh). To draw directly on the screen we can print the bytes we read from the master without doing any sort of work in-between: + +```rust +fn liaison(pty_fd: std::fs::File) { + let stdout = std::io::stdout(); + let mut lock = stdout.lock(); + + let mut bytes_iter = pty_fd.bytes(); + while let Some(Ok(byte)) = bytes_iter.next() { + lock.write_all(&[byte]).unwrap(); + } +} +``` + + +## Embedding graphics + +A quick explanation on how meli graphics work: There's a two dimensional grid representing the state of the terminal at the current moment. Its elements are of type `Cell`: + +```rust +struct Cell { + ch: char, + + fg: Color, + bg: Color, + attrs: Attr, +} +``` + +To cache stuff I've made some UI components draw their stuff into their own grids and whenever I have to redraw, they copy the cache instead of recomputing data. To actually show changes on the screen each component pushes the area of the grid they have changed into the app state, and whenever it's time to draw the app displays only the dirty areas. On resize all of the components are marked dirty and redraw everything on the newly resized grid. + +The embedded process can thus draw its output on such a grid and we can then draw it like a regular UI widget. + +### How the terminal handles output + +For terminal UI apps we're interested in the Alternative screen buffer mode. In this mode the application is responsible for handling the cursor. There is no scrollback, to emulate scrolling the app has to redraw the screen entirely or use a special scrolling functionality that is out of scope for this post. + +To handle colours, cursor style changes, cursor position changes, the application sends *control sequences* to the terminal, which are sequences of bytes with designated prefixes and suffixes that correspond to a command. `xterm` control sequences are not standardised, but [here is one list](https://invisible-island.net/xterm/ctlseqs/ctlseqs.html#h2-Functions-using-CSI-_-ordered-by-the-final-character_s_). A quick summary with examples can be found in the [Wikipedia Article](https://en.wikipedia.org/wiki/ANSI_escape_code). + +All sequences start with the Escape character, `0x1b`, and are sorted in separate categories. The basic one is `CSI` or *Command Sequence Introducer*, which is Escape followed by `[`. + +Since we're pretending to be a terminal, we will encode the code sequence input's state in a state machine: + +```rust +pub enum State { + Normal, // Waiting for any kind of byte + ExpectingControlChar, // We just got an ESC and expect a control sequence + Csi, // ESC [ Control Sequence Introducer + /* Multiparameter sequences are of the form KIND P_1 ; P_2 ; ... TERMINATION */ + Csi1(Vec), // CSI with one buffer (CSI ) waiting for new buffer digits, a second buffer or a termination character + Csi2(Vec, Vec), // CSI with two buffers (CSI ; ) as above + Csi3(Vec, Vec, Vec), // CSI with three buffers + CsiQ(Vec), // CSI followed by '?' + Osc1(Vec), // ESC ] Operating System Command + Osc2(Vec, Vec), +} +``` + +The embed grid will include all the simulated terminal's state: + +```rust +pub struct EmbedGrid { + /* + 1 2 .. + ┏━━━┯━━━━━━━┅┅ x axis + 1 ┃1,1│ + ┠───┼┈┈ + 2 ┃ ┊ + ┃ + .. ┃ +y axis ┇ + */ + cursor: (usize, usize), // xterm cursor starts from (1, 1), but ours from (0, 0) + + pub grid: CellBuffer, + pub state: State, + pub stdin: std::fs::File, + // Pid of the embed process + pub child_pid: nix::unistd::Pid, + // (width, height) + pub terminal_size: (usize, usize), + // Current colors + fg_color: Color, + bg_color: Color, + + show_cursor: bool, + /* And others */ + .. +} +``` + +And here's the methods to control the terminal: + +```rust +impl EmbedGrid { + pub fn set_terminal_size(&mut self, new_val: (usize, usize)) { + if new_val == self.terminal_size { + return; + } + + self.terminal_size = new_val; + self.grid.resize(new_val.0, new_val.1, Cell::default()); + self.grid.clear(Cell::default()); + self.cursor = (0, 0); + let winsize = Winsize { + ws_row: ::try_from(new_val.1).unwrap(), + ws_col: ::try_from(new_val.0).unwrap(), + ws_xpixel: 0, + ws_ypixel: 0, + }; + + let master_fd = self.stdin.as_raw_fd(); + /* This is the macrogenerated function we defined earlier, which calls + ioctl underneath */ + unsafe { set_window_size(master_fd, &winsize).unwrap() }; + /* SIGWINCH informs the process the tty size has changed. TUI apps must + handle this signal */ + nix::sys::signal::kill(self.child_pid, nix::sys::signal::SIGWINCH).unwrap(); + } + + pub fn wake_up(&self) { + nix::sys::signal::kill(self.child_pid, nix::sys::signal::SIGCONT).unwrap(); + } + + pub fn stop(&self) { + /* we can emulate Ctrl-z and suspend the child process from meli */ + nix::sys::signal::kill(self.child_pid, nix::sys::signal::SIGSTOP).unwrap(); + } + + pub fn process_byte(&mut self, byte: u8); +} +``` + +In the `process_byte` method we take input from the child process and we perform actions depending on the control sequence state: + +- if it's `Normal` and we get a byte that does not start a sequence, we output it on the grid. +- if the state is in a sequence and we get a valid termination byte, we perform the sequence's action +- if the state is in a sequence and we get a valid continuation byte, we update the state +- else, the child process sent malformed output or we haven't implemented some sequence correctly (at this stage, probably the latter) + +```rust + pub fn process_byte(&mut self, byte: u8) { + let EmbedGrid { + ref mut cursor, + ref terminal_size, + ref mut grid, + ref mut state, + ref mut stdin, + ref mut fg_color, + ref mut bg_color, + child_pid: _, + .. + } = self; + + macro_rules! increase_cursor_x { + () => { + if cursor.0 + 1 < terminal_size.0 { + cursor.0 += 1; + } + }; + } + + macro_rules! cursor_x { + () => {{ + if cursor.0 >= terminal_size.0 { + cursor.0 = terminal_size.0.saturating_sub(1); + } + cursor.0 + }}; + } + macro_rules! cursor_y { + () => { + std::cmp::min( + cursor.1 + scroll_region.top, + terminal_size.1.saturating_sub(1), + ) + }; + } + macro_rules! cursor_val { + () => { + (cursor_x!(), cursor_y!()) + }; + } + + let mut state = state; + match (byte, &mut state) { + (b'\x1b', State::Normal) => { + *state = State::ExpectingControlChar; + } + (b']', State::ExpectingControlChar) => { + let buf1 = Vec::new(); + *state = State::Osc1(buf1); + } + (b'[', State::ExpectingControlChar) => { + *state = State::Csi; + } + /* 8<... */ + (b'H', State::Csi) => { + /* move cursor to (1,1) */ + *cursor = (0, 0); + *state = State::Normal; + } + /* 8<... */ + (b'\r', State::Normal) => { + // carriage return x-> 0 + cursor.0 = 0; + } + (b'\n', State::Normal) => { + // newline y -> y + 1 + if cursor.1 + 1 < terminal_size.1 { + cursor.1 += 1; + } + } + /* replaced the actual ^G character here with '^' + 'G' for clarity: */ + (b'^G', State::Normal) => { + // Visual bell ^G, ignoring + } + (0x08, State::Normal) => { + /* Backspace */ + // x -> x - 1 + if cursor.0 > 0 { + cursor.0 -= 1; + } + } + (c, State::Normal) => { + /* Character to be printed. */ + + /* We're UTF-8 bound, so check if byte starts a multi-byte + codepoint and keep state on this in order to get the complete + char, which will be 1-4 bytes long. + Check UTF-8 spec to see how it's defined. + */ + + /* ...codepoint checks ...8< */ + grid[cursor_val!()].set_ch(c); + grid[cursor_val!()].set_fg(*fg_color); + grid[cursor_val!()].set_bg(*bg_color); + increase_cursor_x!(); + } + /* other various sequences: */ + (b'H', State::Csi2(ref y, ref x)) => { + // Set Cursor Position [row;column] (default = [1,1]) + let orig_x = unsafe { std::str::from_utf8_unchecked(x) } + .parse::() + .unwrap_or(1); + let orig_y = unsafe { std::str::from_utf8_unchecked(y) } + .parse::() + .unwrap_or(1); + + if orig_x - 1 <= terminal_size.0 && orig_y - 1 <= terminal_size.1 { + cursor.0 = orig_x - 1; + cursor.1 = orig_y - 1; + } else { + eprintln!( + "[error] terminal_size = {:?}, cursor = {:?} but cursor set to [{},{}]", + terminal_size, cursor, orig_x, orig_y + ); + } + + *state = State::Normal; + } + (b'm', State::Csi1(ref buf1)) => { + // Set color + match buf1.as_slice() { + /* See next sequence for 38 and 48 special meanings */ + b"30" => *fg_color = Color::Black, + b"31" => *fg_color = Color::Red, + b"32" => *fg_color = Color::Green, + b"33" => *fg_color = Color::Yellow, + b"34" => *fg_color = Color::Blue, + b"35" => *fg_color = Color::Magenta, + b"36" => *fg_color = Color::Cyan, + b"37" => *fg_color = Color::White, + + b"39" => *fg_color = Color::Default, + b"40" => *bg_color = Color::Black, + b"41" => *bg_color = Color::Red, + b"42" => *bg_color = Color::Green, + b"43" => *bg_color = Color::Yellow, + b"44" => *bg_color = Color::Blue, + b"45" => *bg_color = Color::Magenta, + b"46" => *bg_color = Color::Cyan, + b"47" => *bg_color = Color::White, + + b"49" => *bg_color = Color::Default, + _ => {} + } + grid[cursor_val!()].set_fg(*fg_color); + grid[cursor_val!()].set_bg(*bg_color); + *state = State::Normal; + } + (b'm', State::Csi3(ref buf1, ref buf2, ref buf3)) if buf1 == b"38" && buf2 == b"5" => { + /* ESC [ m 38 ; 5 ; fg_color_byte m */ + /* Set only foreground color */ + *fg_color = if let Ok(byte) = + u8::from_str_radix(unsafe { std::str::from_utf8_unchecked(buf3) }, 10) + { + Color::Byte(byte) + } else { + Color::Default + }; + grid[cursor_val!()].set_fg(*fg_color); + *state = State::Normal; + } + (b'm', State::Csi3(ref buf1, ref buf2, ref buf3)) if buf1 == b"48" && buf2 == b"5" => { + /* ESC [ m 48 ; 5 ; fg_color_byte m */ + /* Set only background color */ + *bg_color = if let Ok(byte) = + u8::from_str_radix(unsafe { std::str::from_utf8_unchecked(buf3) }, 10) + { + Color::Byte(byte) + } else { + Color::Default + }; + grid[cursor_val!()].set_bg(*bg_color); + *state = State::Normal; + } + (b'D', State::Csi1(buf)) => { + // ESC[{buf}D CSI Cursor Backward {buf} Times + let offset = unsafe { std::str::from_utf8_unchecked(buf) } + .parse::() + .unwrap(); + cursor.0 = cursor.0.saturating_sub(offset); + *state = State::Normal; + } + /* and others */ + } + } +``` + +A bit of UI glue code later: + +