add a lovely thingy

author: Andrew Yu <andrew@andrewyu.org> 2022-01-11 19:03:59 +0800
committer: Andrew Yu <andrew@andrewyu.org> 2022-01-11 19:03:59 +0800
commit: a0d44fc9b49af8b581724c770338e5a3aa0bc8f5 (patch)
tree: 9e85f8a1b8640a625a577a61ad2ce6ca0b4e3a6b
parent: a8e0a54394fd4527fc901b160c95a12a10ad6c66 (diff)
download: www-a0d44fc9b49af8b581724c770338e5a3aa0bc8f5.tar.gz
4 files changed, 333 insertions, 0 deletions
diff --git a/lovely/.gitignore b/lovely/.gitignore
new file mode 100644
index 0000000..a40fad4
--- /dev/null
+++ b/lovely/.gitignore
@@ -0,0 +1 @@
+/pub
diff --git a/lovely/andrew.asc b/lovely/andrew.asc
new file mode 100644
index 0000000..c329902
--- /dev/null
+++ b/lovely/andrew.asc
Binary files differdiff --git a/lovely/index.html b/lovely/index.html
new file mode 100644
index 0000000..d00b919
--- /dev/null
+++ b/lovely/index.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
+	<head>
+		<title>Andrew Yu's Website</title>
+		<link rel="stylesheet" href="/style.css" />
+	</head>
+	<body>
+		<h1>Andrew Yu's Website</h1>
+		<div id="nav">
+			<ul>
+				<li><a href="https://www.andrewyu.org">Home</a></li>
+				<li><a href="https://blog.andrewyu.org">Blog</a></li>
+				<li><a href="https://project.andrewyu.org"><span class="alert">Projects</span></a></li>
+				<li><a href="https://git.andrewyu.org">Git</a></li>
+				<li><a href="https://pub.andrewyu.org">Users</a></li>
+				<li><a href="https://lib.andrewyu.org">Files</a></li>
+			</ul>
+		</div>
+		<div class="wrapper">
+			<div id="majornote">
+				<p>Hey there.  I'm playing around with the CSS a little, so don't hover your pointer on anything or select text.</p>
+			</div>
+			<div id="campaign">
+				<p>It is our responsibility to spread free software and advocate for user freedom.  Please don't waste any chances to do so.  Sign <a href="https://my.fsf.org/give-students-userfreedom">the give students user freedom petition by the FSF</a> and fight against <a href="https://www.fsf.org/bulletin/2020/spring/trial-by-proprietary-software">trial in courts with proprietary software</a>.</p>
+			</div>
+			<div id="project-help">
+				<h2><span class="alert">Project Help</span></h2>
+				<p>Hello guys.  I currently need help with some of my projects.  If you can, please look in their repositories.  Any ideas would work.</p>
+				<ul>
+					<li><a href="https://project.andrewyu.org/libresociety">The Libre Society Project</a> is a campaign to spread the ideas of <a href="https://fsf.org">free software</a> to places other than software, such as the political system, economics, and society in general.</li>
+					<li><a href="https://project.andrewyu.org/librebiology">The Libre Biololgy Project</a> is a repository of ideas for the development of medicine and the treatment of patients, especially related to medical equity.  I haven't started on this one yet, but it is upcoming.</li>
+				</ul>
+			</div>
+			<div id="ponder">
+				<h2>Help me ponder upon these questions</h2>
+				<p>These are questions that interest me.  If I have more ideas on them, I might turn them into projects.</p>
+				<h3>Sudden idea on the Lisp-like operating system</h3>
+				<p>Emacs is an example!</p>
+				<h3>Help me choose licenses</h3>
+				<p>I am currently unable to decide what license should I choose for my programs and other works.  I used to use the GNU General Public License.  Then I realized that (1) the GPL causes compatibility problems with those who wish to use another [free] license (who do exist) and (2) the GPL restricts on what a user can do with a work.  I'm thinking of what freedom actually means&mdash;there are freedoms to do things and freedoms from being the object of some other person doing something.  Does software which you can't distribute in any form you wish count as free software?  I think so.  However, as <a href="https://unixsheikh.com/articles/the-problems-with-the-gpl.html">https://unixsheikh.com/articles/the-problems-with-the-gpl.html</a> explains, the GPL is based on coercing people into sharing, but coercion not effective in any field to make people actually share.  This is understandable.  I might start using the GPL again for my programs (might even be the AGPL).  However, you might wanna convince me (if you have good arguments on this) to use a license for my documents and books&mdash;I put them into the public domain, and I think that's okay.  Please mail me if you have any thoughts on this.  But sad examples:  Minix was permissively licensed, got abused by Intel.  The BSD stuff was permissively licensed, got abused by Apple.</p>
+				<h3>What about a pure functional Lisp dialect, with monads and similar (Haskell) ideas?</h3>
+				<p>I love s-expressions, as they clearly represent the structure of a program, or even natural language.  They also allow for powerful macros, enabling some Lisp dialects to have continuations and other cool stuff.  Haskell, on the other hand, is purely functional, where things that involve side effects are usually implemented with Monads.  I'm looking for an implementation that combines these.</p>
+				<h3>What about a mathematical political system?</h3>
+				<p>A government too strong causes authoritarianism which may lead to non-democracies, while a government too weak causes the inability of the government to do anything with the slightest controversy (look at COVID handling).  Is there a mathematical way (say a function; this sounds like group theory, but I'm not sure) to compute, based all known information known about the bill/order/whatever being considered, if the government (I'm especially talking about the executive here) has the right to order that? I feel like this could be proved impossible due to incompleteness and unpredictability, but this needs further investigation.</p>
+			</div>
+			<div id="me">
+				<h2>About me</h2>
+				<p>I am Andrew Yu, a secondary school student in Shanghai, China.  My main fields of interest are philosophy (especially moral philosophy, and especially especially moral philosophy in technology), metamathematics, programming fundamentals and molecular biology. (To be extended)</p>
+			</div>
+			<div id="contact">
+				<h2>Contact</h2>
+				<p>There are many ways to contact me.  None of these require proprietary software.</p>
+				<ul>
+					<li>radio me at guard frequency (not recommended)</li>
+					<li>talk to me in real life</li>
+					<li>mail <a href="mailto:andrew@andrewyu.org">andrew@andrewyu.org</a></li>
+					<li>irc <a href="irc://irc.libera.chat:6697/AndrewYu">Andrew on Libera</a></li>
+					<li>irc <a href="irc://irc.libera.chat:6697/AndrewYu">Andrew on AndrewIRC</a></li>
+				</ul>
+				<p>My OpenPGP fingerprint is <code>58BD 7981 2187 1B71 870C 27D9 978B 5891 AD3F 5986</code>.  My public key is available at <a href="https://www.andrewyu.org/andrew.asc">https://www.andrewyu.org/andrew.asc</a>.</p>
+				<p>Contact me if you would like to sell an old ThinkPad x200 in good shape.</p>
+				<p>Caution: This server is quite new, and it seems to be in some dnsbl lists.  I'll try to get to you by other means if my email gets blocked.  Seems to be an issue with my reverse DNS, which I recently fixed.  We'll see.  Writing to me won't be affected though.</p>
+			</div>
+			<div id="randlinks">
+				<h2>Random Links</h2>
+				<ul>
+					<li><a href="https://fsf.org">The Free Software Foundation</a>.</li>
+				</ul>
+			</div>
+		</div>
+		<div id="footer">
+			<p>This site is designed to be viewable with plain text, only a few typographic and web design conventions are followed. Do you agree that max-width: 75ex makes sense?  I do that since people have a hard time scanning scross lines.  Also, I now use a sans font because some people have trouble reading monospace.  I prefer the Airbus B612Mono and B612 fonts, but I respect your preference by just saying font-family: sans-serif.  If you read this on a plain text browser like me, this won't matter, of course.  I'm also looking for a high-contrast colorful stylesheet.  As you can see, I did use some flexboxes in here.  They don't seem to respect min-width and max-width properly, especially min-wdith.  Tell me if you have a solution, thanks.</p>
+			<p>This is free and unencumbered software released into the public domain.  Anyone is free to copy, modify, publish, use, compile, sell, or distribute this software, either in source code form or as a compiled binary, for any purpose, commercial or non-commercial, and by any means.  In jurisdictions that recognize copyright laws, the author or authors of this software dedicate any and all copyright interest in the software to the public domain. We make this dedication for the benefit of the public at large and to the detriment of our heirs and successors. We intend this dedication to be an overt act of relinquishment in perpetuity of all present and future rights to this software under copyright law.  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.  IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.  For more information, please refer to <a href="https://unlicense.org/">https://unlicense.org</a></p>
+			<p>I know that this website is not a program and that HTML isn't considered a programming language.  Nevertheless, you can think of the HTML as code&mdash;even the plain text I write could also be considered code since languages are a code to give information.  Anyways, stuff on here that's supposed to be public (don't try to spoof my htaccess, don't hack my ssh, don't snoop on my email, etc) is public domain, including my projects and my git repos, unless otherwise specified by a file that looks like COPYING, LICENSE or licensing stuff in the source itself. <a href="https://stpeter.im/writings/essays/publicdomain.html">https://stpeter.im/writings/essays/publicdomain.html</a> is a good explanation on why people put stuff in the public domain.  However, you might want to see the "Help me choose licenses" section on this page.</p>
+		</div>
+	</body>
+</html>
diff --git a/lovely/style.css b/lovely/style.css
new file mode 100644
index 0000000..dd997a0
--- /dev/null
+++ b/lovely/style.css
@@ -0,0 +1,255 @@
+body {
+	background-color: black;
+	color: white;
+	font-family: sans-serif;
+	line-height: 1.4;
+	transition: all 1s;
+}
+body:hover {
+	transition: all 1s;
+	animation-name: shakenn;
+	animation-iteration-count: 1;
+	animation-duration: 1s;
+}
+p:hover, h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover, li:hover {
+	border: solid yellow 1px;
+	font-size: 3000%;
+	transition: all 0.5s;
+	animation-name: shakenn;
+	animation-iteration-count: 5;
+	animation-duration: 1s;
+}
+p:active, h1:active, h2:active, h3:active, h4:active, h5:active, h6:active, li:active {
+	border: solid lime 1px;
+	font-size: 30000%;
+	transition: all 0.5s;
+	animation-name: shakenn;
+	animation-iteration-count: 5;
+	animation-duration: 1s;
+}
+p, h1, h2, h3, h4, h5, h6, li {
+	font-size: 100%;
+	transition: all 0.5s;
+	padding: 5px;
+}
+h1 {
+	text-align: center;
+}
+.wrapper {
+	margin: auto;
+	/* display: flex; */
+	/* flex-flow: row wrap; */
+	/* flex-flow: row wrap; */
+	/* justify-content: center; */
+	/* align-items: flex-start; */
+	/* align-content: flex-start; */
+	/* height: calc(100vh); */
+	/* gap: 3%; */
+}
+.wrapper div {
+	min-width: 30ex;
+	max-width: 100ex;
+	margin: auto;
+}
+#footer {
+	line-height: 1.2;
+	font-size: 80%;
+}
+a:link {
+	color: cyan;
+	text-decoration: none;
+	border: solid cyan 1px;
+	padding: 1px;
+	font-size: 100%;
+	transition: all 0.5s;
+}
+a:visited {
+	color: violet;
+	text-decoration: none;
+	border: solid violet 1px;
+	padding: 1px;
+	font-size: 100%;
+	transition: all 0.5s;
+}
+a:hover {
+	color: yellow;
+	text-decoration: none;
+	border: solid yellow 1px;
+	padding: 1px;
+	font-size: 105%;
+	transition: all 0.5s;
+}
+a:active {
+	color: lime;
+	text-decoration: none;
+	border: solid lime 1px;
+	padding: 1px;
+	font-size: 200%;
+	transition: all 0.5s;
+}
+#nav ul {
+	list-style-type: none;
+	padding: 1em 0;
+	text-align: center;
+	/*************************************/
+	/* border-top: 2px solid black;		 */
+	/* border-bottom: 2px solid back;	 */
+	/*************************************/
+}
+#nav ul li {
+	display: inline;
+	padding: 0 1.5em;
+	border: none;
+}
+#nav ul li a {
+	font-weight: bold;
+}
+#majornote {
+	font-size: 120%;
+	color: lime;
+	display: block;
+	border: 3px dashed lime;
+	transition: all 0.5s;
+}
+#campaign {
+	font-size: 120%;
+	color: red;
+	display: block;
+	border: 3px dashed red;
+	transition: all 0.5s;
+}
+#campaign:hover{
+	font-size: 140%;
+	transition: all 0.5s;
+	animation-name: shake;
+	animation-iteration-count: 1;
+	animation-duration: 5s;
+	padding: 1ex;
+}
+.alarm {
+	color: red;
+}
+.alert {
+	color: orange;
+}
+.good {
+	color: lime;
+}
+@keyframes shaken { 
+   0%, 100% {transform: rotate(0deg);} 
+   10%, 30%, 50%, 70%, 90% {transform: rotate(-0.4deg);} 
+   20%, 40%, 60%, 80% {transform: rotate(0.4deg);} 
+}
+@keyframes shake { 
+   0%, 100% {transform: rotate(0deg);} 
+   10%, 30%, 50%, 70%, 90% {transform: rotate(-1deg);} 
+   20%, 40%, 60%, 80% {transform: rotate(1deg);} 
+}
+@keyframes shakey { 
+   0%, 100% {transform: rotate(0deg);} 
+   10%, 30%, 50%, 70%, 90% {transform: rotate(-45deg);} 
+   20%, 40%, 60%, 80% {transform: rotate(45deg);} 
+}
+@keyframes shakenn { 
+0% {background-color: black; transform: rotate(0deg);}
+1% {background-color: black; transform: rotate(3deg);}
+2% {background-color: black; transform: rotate(7deg);}
+3% {background-color: black; transform: rotate(10deg);}
+4% {background-color: black; transform: rotate(14deg);}
+5% {background-color: black; transform: rotate(18deg);}
+6% {background-color: black; transform: rotate(21deg);}
+7% {background-color: black; transform: rotate(25deg);}
+8% {background-color: black; transform: rotate(28deg);}
+9% {background-color: black; transform: rotate(32deg);}
+10% {background-color: black; transform: rotate(36deg);}
+11% {background-color: black; transform: rotate(39deg);}
+12% {background-color: black; transform: rotate(43deg);}
+13% {background-color: black; transform: rotate(46deg);}
+14% {background-color: black; transform: rotate(50deg);}
+15% {background-color: black; transform: rotate(54deg);}
+16% {background-color: black; transform: rotate(57deg);}
+17% {background-color: black; transform: rotate(61deg);}
+18% {background-color: black; transform: rotate(64deg);}
+19% {background-color: black; transform: rotate(68deg);}
+20% {background-color: black; transform: rotate(72deg);}
+21% {background-color: black; transform: rotate(75deg);}
+22% {background-color: black; transform: rotate(79deg);}
+23% {background-color: black; transform: rotate(82deg);}
+24% {background-color: black; transform: rotate(86deg);}
+25% {background-color: black; transform: rotate(90deg);}
+26% {background-color: black; transform: rotate(93deg);}
+27% {background-color: black; transform: rotate(97deg);}
+28% {background-color: black; transform: rotate(100deg);}
+29% {background-color: black; transform: rotate(104deg);}
+30% {background-color: black; transform: rotate(108deg);}
+31% {background-color: black; transform: rotate(111deg);}
+32% {background-color: black; transform: rotate(115deg);}
+33% {background-color: black; transform: rotate(118deg);}
+34% {background-color: black; transform: rotate(122deg);}
+35% {background-color: black; transform: rotate(126deg);}
+36% {background-color: black; transform: rotate(129deg);}
+37% {background-color: black; transform: rotate(133deg);}
+38% {background-color: black; transform: rotate(136deg);}
+39% {background-color: black; transform: rotate(140deg);}
+40% {background-color: black; transform: rotate(144deg);}
+41% {background-color: black; transform: rotate(147deg);}
+42% {background-color: black; transform: rotate(151deg);}
+43% {background-color: black; transform: rotate(154deg);}
+44% {background-color: black; transform: rotate(158deg);}
+45% {background-color: black; transform: rotate(162deg);}
+46% {background-color: black; transform: rotate(165deg);}
+47% {background-color: black; transform: rotate(169deg);}
+48% {background-color: black; transform: rotate(172deg);}
+49% {background-color: black; transform: rotate(176deg);}
+50% {background-color: black; transform: rotate(180deg);}
+51% {background-color: black; transform: rotate(176deg);}
+52% {background-color: black; transform: rotate(172deg);}
+53% {background-color: black; transform: rotate(169deg);}
+54% {background-color: black; transform: rotate(165deg);}
+55% {background-color: black; transform: rotate(162deg);}
+56% {background-color: black; transform: rotate(158deg);}
+57% {background-color: black; transform: rotate(154deg);}
+58% {background-color: black; transform: rotate(151deg);}
+59% {background-color: black; transform: rotate(147deg);}
+60% {background-color: black; transform: rotate(144deg);}
+61% {background-color: black; transform: rotate(140deg);}
+62% {background-color: black; transform: rotate(136deg);}
+63% {background-color: black; transform: rotate(133deg);}
+64% {background-color: black; transform: rotate(129deg);}
+65% {background-color: black; transform: rotate(126deg);}
+66% {background-color: black; transform: rotate(122deg);}
+67% {background-color: black; transform: rotate(118deg);}
+68% {background-color: black; transform: rotate(115deg);}
+69% {background-color: black; transform: rotate(111deg);}
+70% {background-color: black; transform: rotate(108deg);}
+71% {background-color: black; transform: rotate(104deg);}
+72% {background-color: black; transform: rotate(100deg);}
+73% {background-color: black; transform: rotate(97deg);}
+74% {background-color: black; transform: rotate(93deg);}
+75% {background-color: black; transform: rotate(90deg);}
+76% {background-color: black; transform: rotate(86deg);}
+77% {background-color: black; transform: rotate(82deg);}
+78% {background-color: black; transform: rotate(79deg);}
+79% {background-color: black; transform: rotate(75deg);}
+80% {background-color: black; transform: rotate(72deg);}
+81% {background-color: black; transform: rotate(68deg);}
+82% {background-color: black; transform: rotate(64deg);}
+83% {background-color: black; transform: rotate(61deg);}
+84% {background-color: black; transform: rotate(57deg);}
+85% {background-color: black; transform: rotate(54deg);}
+86% {background-color: black; transform: rotate(50deg);}
+87% {background-color: black; transform: rotate(46deg);}
+88% {background-color: black; transform: rotate(43deg);}
+89% {background-color: black; transform: rotate(39deg);}
+90% {background-color: black; transform: rotate(36deg);}
+91% {background-color: black; transform: rotate(32deg);}
+92% {background-color: black; transform: rotate(28deg);}
+93% {background-color: black; transform: rotate(25deg);}
+94% {background-color: black; transform: rotate(21deg);}
+95% {background-color: black; transform: rotate(18deg);}
+96% {background-color: black; transform: rotate(14deg);}
+97% {background-color: black; transform: rotate(10deg);}
+98% {background-color: black; transform: rotate(7deg);}
+99% {background-color: black; transform: rotate(3deg);}
+100% {background-color: black; transform: rotate(0deg);}
+}
author	Andrew Yu <andrew@andrewyu.org>	2022-01-11 19:03:59 +0800
committer	Andrew Yu <andrew@andrewyu.org>	2022-01-11 19:03:59 +0800
commit	a0d44fc9b49af8b581724c770338e5a3aa0bc8f5 (patch)
tree	9e85f8a1b8640a625a577a61ad2ce6ca0b4e3a6b
parent	a8e0a54394fd4527fc901b160c95a12a10ad6c66 (diff)
download	www-a0d44fc9b49af8b581724c770338e5a3aa0bc8f5.tar.gz