Catching up with neocities main published page
This commit is contained in:
AlejandroS
commit
7dcfceeafe
BIN
img/heart.png
Normal file
BIN
img/heart.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 585 B |
28
index.html
Normal file
28
index.html
Normal file
@ -0,0 +1,28 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="Content-Style-Type" content="text/css" />
|
||||
<meta name="generator" content="pandoc" />
|
||||
<title></title>
|
||||
<style type="text/css">code{white-space: pre;}</style>
|
||||
<link rel="stylesheet" href="style.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
<p><a href="./index.html"><img src="./img/heart.png" alt="Alt Text" /></a></p>
|
||||
<h1 id="shockrahs-not-a-blog">Shockrah's Not-a-Blog</h1>
|
||||
<blockquote>
|
||||
<p><strong>HEY I am currently trying to port my entire site out of a previous location so things might look really weird here for a minute.</strong></p>
|
||||
</blockquote>
|
||||
<p><code>stay a while and listen</code></p>
|
||||
<h3 id="website-construction-philosophy"><strong><a href="./post/phil.html">Website Construction philosophy</a></strong></h3>
|
||||
<blockquote>
|
||||
<p>JS is bloat prove me wrong<br />
|
||||
But no Seriously why do so many sites have to load 6000 js scripts and why are half of them obfuscated</p>
|
||||
</blockquote>
|
||||
<h3 id="mapping-in-reflex"><strong><a href="./post/mapping.html">Mapping in Reflex</a></strong></h3>
|
||||
<blockquote>
|
||||
<p>Making maps is hard fam</p>
|
||||
</blockquote>
|
||||
</body>
|
||||
</html>
|
||||
16
index.md
Normal file
16
index.md
Normal file
@ -0,0 +1,16 @@
|
||||
[](./index.html)
|
||||
|
||||
# Shockrah's Not-a-Blog
|
||||
|
||||
> __HEY I am currently trying to port my entire site out of a previous location so things might look really weird here for a minute.__
|
||||
|
||||
`stay a while and listen`
|
||||
|
||||
### **[Website Construction philosophy](./post/phil.html)**
|
||||
> JS is bloat prove me wrong \
|
||||
> But no Seriously why do so many sites have to load 6000 js scripts and why are half of them obfuscated
|
||||
|
||||
### **[Mapping in Reflex](./post/mapping.html)**
|
||||
> Making maps is hard fam
|
||||
|
||||
|
||||
40
markdown/mapping.md
Normal file
40
markdown/mapping.md
Normal file
@ -0,0 +1,40 @@
|
||||
[](../index.html)
|
||||
|
||||
[Link to the map I discuss here](https://steamcommunity.com/sharedfiles/filedetails/?id=1329660201)
|
||||
|
||||
## FeverStrafe
|
||||
|
||||
To clear up some confusion, _feverStrafe_ is a Reflex Race map I made a few months ago but never got around to finishing due to some issues with time, and motivation. After a few months I came back to see what I had made so far and realized if this was to ever be release worthy it would have to go through a through cleaning.
|
||||
|
||||
## Cleaning Up
|
||||
|
||||
In terms of what needed to be re-done, it seemed that spacing was the main issue so get past. I realized this since most of the map’s spacing seemed to be heavily derived from what CS:Source style spacing which would work there but Reflex is weird in that air control is nowhere near as flexible as in CS:Source. Of course there had to be some kind of method to make the map fun to play and satisfying to speed-run; after deliberation a solution was found.
|
||||
|
||||
### Modifying spacing with casual runs in mind to give competitive runners more room
|
||||
|
||||
The idea here is simple: speed-runners will break the map so instead of worrying about what they might think of it I focus more on casual players, making sure that the map is fun. Simply put, if the map isn’t fun to play normally, there is no chance that it will be fun to run. To make sure that the gameplay was fun I turned to the one type of race map I personally despise, strafe maps.
|
||||
|
||||
> strafe map: mostly flat race map with little variations in gameplay
|
||||
|
||||
A good strafe map is hard to come by, which isn’t because they are hard to make but rather that it must be very clever in its use mechanics to actually be interesting. One of the additional problems strafe maps face is the inherent design of its gameplay, being flat this means that a mapper typically has to come up with some theme or a gameplay gimmick to make it memorable. The good thing about them is that the whole map is available to nearly any kind of player since they are also very easy maps to complete as a player. Making more of _feverStrafe_ available to everyone is exactly what the map needed to feel more complete and flow more easily. The map already had multiple levels, some meant for speed, some technically challenging, others were a mix of both. This meant that instead of changing what gameplay I already had, I simply added easy and hard routes. I kept in mind what the world record runs might look like, and essentially filled in the gaps that most players would probably fall into. To me these maps suffer from nearly the same issue auto-hop maps had (and still do sometimes) in CS:Source. To quote Badges:
|
||||
|
||||
> The map itself pretty much dictates the route and doesn’t allow the player much room to find faster ways around the map, resulting in banal, braindead gameplay. Maps like this aren’t very competitive and result in most of the top times being very similar. bhop_muchfast is a good example of this. Creating maps with more route options by adding more bhop blocks with less space between them will make your map more popular and competitive by allowing newer players to experience them, seasoned players to speedrun them, and normal / scroll players to play them. The top times will have much more variety and every run of the map will be different. bhop_cw_journey, for example.
|
||||
|
||||
[Full quote/post here](https://gamebanana.com/maps/182909)
|
||||
|
||||
For _feverStrafe_ this meant trying to get a balance where the map would be fun to play in general for everyone while providing memorable gameplay. I think after looking at what _feverStrafe_ turned into I can fully say that I am actually somewhat proud of what it is now.
|
||||
|
||||
------
|
||||
|
||||
## After thoughts and future maps
|
||||
|
||||
As a final say to Reflex, I’m only leaving because the game has favored competitive duel for so long that every other gamemode apart from race is nearly dead, even for Reflex’s standards. Because I don't actually play or enjoy duel anymore it means there’s really nothing left to do besides make maps which I can do for any game, so why not one where there’s more going on. Maybe it will get better but it doesn’t seem to be going anywhere, looking at Reflex as a passion project however, it’s doing great and cant’ wait to see what the guys at Pixel come up with.
|
||||
|
||||
_p.s. dubs4lyfe_
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
34
markdown/phil.md
Normal file
34
markdown/phil.md
Normal file
@ -0,0 +1,34 @@
|
||||
[](../index.html)
|
||||
|
||||
# No Non-free JS here
|
||||
|
||||
To explain succintly, I don't like Javascript, especially considering how much power it has on a user's browser.
|
||||
Namely the issue being that while it used to mainly be focused around making websites look pretty it now also serves to execute malicious code; luckily I don't think that is too common but that fact alone makes JS for me, something which should be avoided.
|
||||
|
||||
It's JS's non-free abilities which I don't like and is why I am not going to be using it for any of my projects, unless it is a client-side only project where it is running on some local server.
|
||||
|
||||
There are of course a few *tangent* reasons why I decided to fully make the switch from using the Hugo static site generator:
|
||||
|
||||
* Performace
|
||||
|
||||
Loading a bunch of JS/php is rather cumbersome at time which can often be tracked down to the js being obfuscatedpoorly, creating a file which is sometimes hundreds of times larger than normal.
|
||||
I'll show by example - namely using *r-markdown* and then my own technique to make a page with identical content:
|
||||
|
||||
```
|
||||
# This is an example header
|
||||
|
||||
With a small paragraph
|
||||
|
||||
* a
|
||||
|
||||
* List
|
||||
|
||||
> and a quote
|
||||
```
|
||||
|
||||
* Dev time/ Convenience
|
||||
|
||||
To be completely honest I'm reall not interested by web-development much at all, so finding a flow to make creating content easier is just perfect for me. *Also I dont have to deal with running wine/windows or dealing with hundreds of dependencies with __Hugo__.*
|
||||
|
||||
Hopefully this explains some of my thought process behind this site's design, and if you like, check out some of my other stuff that I post here.
|
||||
|
||||
18
notes.md
Normal file
18
notes.md
Normal file
@ -0,0 +1,18 @@
|
||||
# Building
|
||||
|
||||
using pandoc script `make.sh`
|
||||
bash make.sh inputFile styleSheet outputFile
|
||||
|
||||
1. Full path to the file from the script location \
|
||||
|
||||
2. Path to style sheet relative to where the output file *will be* located \
|
||||
|
||||
3. Full path to the output file \
|
||||
|
||||
|
||||
# Todo section
|
||||
|
||||
* site banner which is easier to click on for mobile users, also so that it looks pretty for the site in general
|
||||
|
||||
* Housekeeping - updating site css as time goes on so that I looks good and whatnot
|
||||
|
||||
327
post/bstyle.css
Normal file
327
post/bstyle.css
Normal file
@ -0,0 +1,327 @@
|
||||
html {
|
||||
font-size: 100%;
|
||||
overflow-y: scroll;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #444;
|
||||
font-family: Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif;
|
||||
font-size: 12px;
|
||||
line-height: 1.7;
|
||||
padding: 1em;
|
||||
margin: auto;
|
||||
max-width: 42em;
|
||||
background: lightgrey;
|
||||
}
|
||||
|
||||
a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #0b0080;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #06e;
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: #faa700;
|
||||
}
|
||||
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
*::-moz-selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
*::selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
a::-moz-selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #0645ad;
|
||||
}
|
||||
|
||||
a::selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #0645ad;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: #111;
|
||||
line-height: 125%;
|
||||
margin-top: 2em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
color: #666666;
|
||||
margin: 0;
|
||||
padding-left: 3em;
|
||||
border-left: 0.5em red solid;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 2px;
|
||||
border: 0;
|
||||
border-top: 1px solid #aaa;
|
||||
border-bottom: 1px solid #eee;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre, code, kbd, samp {
|
||||
background-color: lightblue;
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
color: #000;
|
||||
font-family: monospace, monospace;
|
||||
_font-family: 'courier new', monospace;
|
||||
font-size: 0.98em;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
b, strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
ins {
|
||||
background: #ff9;
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
sub, sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
margin: 1em 0;
|
||||
padding: 0 0 0 2em;
|
||||
}
|
||||
|
||||
li p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
ul ul, ol ol {
|
||||
margin: .3em 0;
|
||||
}
|
||||
|
||||
dl {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
margin-bottom: .8em;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin: 0 0 .8em 2em;
|
||||
}
|
||||
|
||||
dd:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
figure {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
figure img {
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: 0.8em;
|
||||
font-style: italic;
|
||||
margin: 0 0 .8em;
|
||||
}
|
||||
|
||||
table {
|
||||
margin-bottom: 2em;
|
||||
border-bottom: 1px solid #ddd;
|
||||
border-right: 1px solid #ddd;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table th {
|
||||
padding: .2em 1em;
|
||||
background-color: #eee;
|
||||
border-top: 1px solid #ddd;
|
||||
border-left: 1px solid #ddd;
|
||||
}
|
||||
|
||||
table td {
|
||||
padding: .2em 1em;
|
||||
border-top: 1px solid #ddd;
|
||||
border-left: 1px solid #ddd;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.author {
|
||||
font-size: 1.2em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 480px) {
|
||||
body {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 768px) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
* {
|
||||
background: transparent !important;
|
||||
color: black !important;
|
||||
filter: none !important;
|
||||
-ms-filter: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 12pt;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre, blockquote {
|
||||
border: 1px solid #999;
|
||||
padding-right: 1em;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
tr, img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
@page :left {
|
||||
margin: 15mm 20mm 15mm 10mm;
|
||||
}
|
||||
|
||||
@page :right {
|
||||
margin: 15mm 10mm 15mm 20mm;
|
||||
}
|
||||
|
||||
p, h2, h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
34
post/mapping.html
Normal file
34
post/mapping.html
Normal file
@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="Content-Style-Type" content="text/css" />
|
||||
<meta name="generator" content="pandoc" />
|
||||
<title></title>
|
||||
<style type="text/css">code{white-space: pre;}</style>
|
||||
<link rel="stylesheet" href="bstyle.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
<p><a href="../index.html"><img src="../img/heart.png" alt="HomePage" /></a></p>
|
||||
<p><a href="https://steamcommunity.com/sharedfiles/filedetails/?id=1329660201">Link to the map I discuss here</a></p>
|
||||
<h2 id="feverstrafe">FeverStrafe</h2>
|
||||
<p>To clear up some confusion, <em>feverStrafe</em> is a Reflex Race map I made a few months ago but never got around to finishing due to some issues with time, and motivation. After a few months I came back to see what I had made so far and realized if this was to ever be release worthy it would have to go through a through cleaning.</p>
|
||||
<h2 id="cleaning-up">Cleaning Up</h2>
|
||||
<p>In terms of what needed to be re-done, it seemed that spacing was the main issue so get past. I realized this since most of the map’s spacing seemed to be heavily derived from what CS:Source style spacing which would work there but Reflex is weird in that air control is nowhere near as flexible as in CS:Source. Of course there had to be some kind of method to make the map fun to play and satisfying to speed-run; after deliberation a solution was found.</p>
|
||||
<h3 id="modifying-spacing-with-casual-runs-in-mind-to-give-competitive-runners-more-room">Modifying spacing with casual runs in mind to give competitive runners more room</h3>
|
||||
<p>The idea here is simple: speed-runners will break the map so instead of worrying about what they might think of it I focus more on casual players, making sure that the map is fun. Simply put, if the map isn’t fun to play normally, there is no chance that it will be fun to run. To make sure that the gameplay was fun I turned to the one type of race map I personally despise, strafe maps.</p>
|
||||
<blockquote>
|
||||
<p>strafe map: mostly flat race map with little variations in gameplay</p>
|
||||
</blockquote>
|
||||
<p>A good strafe map is hard to come by, which isn’t because they are hard to make but rather that it must be very clever in its use mechanics to actually be interesting. One of the additional problems strafe maps face is the inherent design of its gameplay, being flat this means that a mapper typically has to come up with some theme or a gameplay gimmick to make it memorable. The good thing about them is that the whole map is available to nearly any kind of player since they are also very easy maps to complete as a player. Making more of <em>feverStrafe</em> available to everyone is exactly what the map needed to feel more complete and flow more easily. The map already had multiple levels, some meant for speed, some technically challenging, others were a mix of both. This meant that instead of changing what gameplay I already had, I simply added easy and hard routes. I kept in mind what the world record runs might look like, and essentially filled in the gaps that most players would probably fall into. To me these maps suffer from nearly the same issue auto-hop maps had (and still do sometimes) in CS:Source. To quote Badges:</p>
|
||||
<blockquote>
|
||||
<p>The map itself pretty much dictates the route and doesn’t allow the player much room to find faster ways around the map, resulting in banal, braindead gameplay. Maps like this aren’t very competitive and result in most of the top times being very similar. bhop_muchfast is a good example of this. Creating maps with more route options by adding more bhop blocks with less space between them will make your map more popular and competitive by allowing newer players to experience them, seasoned players to speedrun them, and normal / scroll players to play them. The top times will have much more variety and every run of the map will be different. bhop_cw_journey, for example.</p>
|
||||
</blockquote>
|
||||
<p><a href="https://gamebanana.com/maps/182909">Full quote/post here</a></p>
|
||||
<p>For <em>feverStrafe</em> this meant trying to get a balance where the map would be fun to play in general for everyone while providing memorable gameplay. I think after looking at what <em>feverStrafe</em> turned into I can fully say that I am actually somewhat proud of what it is now.</p>
|
||||
<hr />
|
||||
<h2 id="after-thoughts-and-future-maps">After thoughts and future maps</h2>
|
||||
<p>As a final say to Reflex, I’m only leaving because the game has favored competitive duel for so long that every other gamemode apart from race is nearly dead, even for Reflex’s standards. Because I don't actually play or enjoy duel anymore it means there’s really nothing left to do besides make maps which I can do for any game, so why not one where there’s more going on. Maybe it will get better but it doesn’t seem to be going anywhere, looking at Reflex as a passion project however, it’s doing great and cant’ wait to see what the guys at Pixel come up with.</p>
|
||||
<p><em>p.s. dubs4lyfe</em></p>
|
||||
</body>
|
||||
</html>
|
||||
36
post/phil.html
Normal file
36
post/phil.html
Normal file
@ -0,0 +1,36 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="Content-Style-Type" content="text/css" />
|
||||
<meta name="generator" content="pandoc" />
|
||||
<title></title>
|
||||
<style type="text/css">code{white-space: pre;}</style>
|
||||
<link rel="stylesheet" href="bstyle.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
<p><a href="../index.html"><img src="../img/heart.png" alt="Homepage" /></a></p>
|
||||
<h1 id="no-non-free-js-here">No Non-free JS here</h1>
|
||||
<p>To explain succintly, I don't like Javascript, especially considering how much power it has on a user's browser. Namely the issue being that while it used to mainly be focused around making websites look pretty it now also serves to execute malicious code; luckily I don't think that is too common but that fact alone makes JS for me, something which should be avoided.</p>
|
||||
<p>It's JS's non-free abilities which I don't like and is why I am not going to be using it for any of my projects, unless it is a client-side only project where it is running on some local server.</p>
|
||||
<p>There are of course a few <em>tangent</em> reasons why I decided to fully make the switch from using the Hugo static site generator:</p>
|
||||
<ul>
|
||||
<li>Performace</li>
|
||||
</ul>
|
||||
<p>Loading a bunch of JS/php is rather cumbersome at time which can often be tracked down to the js being obfuscatedpoorly, creating a file which is sometimes hundreds of times larger than normal. I'll show by example - namely using <em>r-markdown</em> and then my own technique to make a page with identical content:</p>
|
||||
<pre><code># This is an example header
|
||||
|
||||
With a small paragraph
|
||||
|
||||
* a
|
||||
|
||||
* List
|
||||
|
||||
> and a quote</code></pre>
|
||||
<ul>
|
||||
<li>Dev time/ Convenience</li>
|
||||
</ul>
|
||||
<p>To be completely honest I'm reall not interested by web-development much at all, so finding a flow to make creating content easier is just perfect for me. <em>Also I dont have to deal with running wine/windows or dealing with hundreds of dependencies with <strong>Hugo</strong>.</em></p>
|
||||
<p>Hopefully this explains some of my thought process behind this site's design, and if you like, check out some of my other stuff that I post here.</p>
|
||||
</body>
|
||||
</html>
|
||||
327
style.css
Normal file
327
style.css
Normal file
@ -0,0 +1,327 @@
|
||||
html {
|
||||
font-size: 100%;
|
||||
overflow-y: scroll;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #444;
|
||||
font-family: Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif;
|
||||
font-size: 12px;
|
||||
line-height: 1.7;
|
||||
padding: 1em;
|
||||
margin: auto;
|
||||
max-width: 42em;
|
||||
background: lightgrey;
|
||||
}
|
||||
|
||||
a {
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: #0b0080;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #06e;
|
||||
}
|
||||
|
||||
a:active {
|
||||
color: #faa700;
|
||||
}
|
||||
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
*::-moz-selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
*::selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #000;
|
||||
}
|
||||
|
||||
a::-moz-selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #0645ad;
|
||||
}
|
||||
|
||||
a::selection {
|
||||
background: rgba(255, 255, 0, 0.3);
|
||||
color: #0645ad;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: #111;
|
||||
line-height: 125%;
|
||||
margin-top: 2em;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
h4, h5, h6 {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
color: #666666;
|
||||
margin: 0;
|
||||
padding-left: 3em;
|
||||
border-left: 0.5em red solid;
|
||||
}
|
||||
|
||||
hr {
|
||||
display: block;
|
||||
height: 2px;
|
||||
border: 0;
|
||||
border-top: 1px solid #aaa;
|
||||
border-bottom: 1px solid #eee;
|
||||
margin: 1em 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre, code, kbd, samp {
|
||||
background-color: lightblue;
|
||||
border-radius: 8px;
|
||||
padding: 8px;
|
||||
color: #000;
|
||||
font-family: monospace, monospace;
|
||||
_font-family: 'courier new', monospace;
|
||||
font-size: 0.98em;
|
||||
}
|
||||
|
||||
pre {
|
||||
white-space: pre;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
b, strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
ins {
|
||||
background: #ff9;
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
font-style: italic;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
sub, sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
margin: 1em 0;
|
||||
padding: 0 0 0 2em;
|
||||
}
|
||||
|
||||
li p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
ul ul, ol ol {
|
||||
margin: .3em 0;
|
||||
}
|
||||
|
||||
dl {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: bold;
|
||||
margin-bottom: .8em;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin: 0 0 .8em 2em;
|
||||
}
|
||||
|
||||
dd:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
border: 0;
|
||||
-ms-interpolation-mode: bicubic;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
figure {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
figure img {
|
||||
border: none;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: 0.8em;
|
||||
font-style: italic;
|
||||
margin: 0 0 .8em;
|
||||
}
|
||||
|
||||
table {
|
||||
margin-bottom: 2em;
|
||||
border-bottom: 1px solid #ddd;
|
||||
border-right: 1px solid #ddd;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table th {
|
||||
padding: .2em 1em;
|
||||
background-color: #eee;
|
||||
border-top: 1px solid #ddd;
|
||||
border-left: 1px solid #ddd;
|
||||
}
|
||||
|
||||
table td {
|
||||
padding: .2em 1em;
|
||||
border-top: 1px solid #ddd;
|
||||
border-left: 1px solid #ddd;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.author {
|
||||
font-size: 1.2em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 480px) {
|
||||
body {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
@media only screen and (min-width: 768px) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
* {
|
||||
background: transparent !important;
|
||||
color: black !important;
|
||||
filter: none !important;
|
||||
-ms-filter: none !important;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 12pt;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
a, a:visited {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
|
||||
a[href]:after {
|
||||
content: " (" attr(href) ")";
|
||||
}
|
||||
|
||||
abbr[title]:after {
|
||||
content: " (" attr(title) ")";
|
||||
}
|
||||
|
||||
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
pre, blockquote {
|
||||
border: 1px solid #999;
|
||||
padding-right: 1em;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
tr, img {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
@page :left {
|
||||
margin: 15mm 20mm 15mm 10mm;
|
||||
}
|
||||
|
||||
@page :right {
|
||||
margin: 15mm 10mm 15mm 20mm;
|
||||
}
|
||||
|
||||
p, h2, h3 {
|
||||
orphans: 3;
|
||||
widows: 3;
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user