Skip to content

Commit 5e2fc35

Browse files
committed
simplified how sswg works. removed a bunch of tags and made tags require no space after '#'. added '# ' tag for h3 headings.
1 parent 0229f30 commit 5e2fc35

File tree

4 files changed

+503
-350
lines changed

4 files changed

+503
-350
lines changed

index.html

Lines changed: 62 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,88 @@
11
<!DOCTYPE HTML>
2-
<!--generated with sswg-->
3-
<html lang="en">
4-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
5-
<head>
6-
<title>index</title>
7-
<link rel="stylesheet" href="sswg.css">
8-
<link rel="stylesheet" href="style.css">
9-
<link rel="icon" type="image/x-icon" href="favicon.ico">
10-
</head>
11-
<body>
12-
<left><div style="font-weight: bold;max-width: 1000px; margin: auto;font-size: 100.0px;">
13-
Simple Static Website Generator<br>
14-
<div style="font-size: 30.0px;font-weight: normal;">
15-
<br>
16-
A Markdown inspired markup language.<br>
2+
<!--generated with sswg-->
3+
<html lang="en">
4+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
5+
<head>
6+
<title>index</title>
7+
<link rel="stylesheet" href="sswg.css">
8+
<link rel="stylesheet" href="style.css">
9+
<link rel="icon" type="image/x-icon" href="favicon.ico">
10+
</head>
11+
<body>
12+
<div style="max-width:1200px; margin:auto;">
13+
<div style="text-align:left;">
14+
</div>
15+
<div style="max-width:1000px; margin:auto;">
16+
<h1 id="Simple Static Website Generator">
17+
Simple Static Website Generator
18+
</h1>A Markdown inspired markup language.<br>
1719
Converts the text files in a folder into web pages.<br>
1820
Use the tags below to style it.<br>
1921
<br>
2022
<br>
21-
<h2><div id="Installation"/><br>
22-
Installation<br>
23-
</h2><br>
24-
<br>
25-
1) Install Python<br>
23+
<h2 id="Installation">
24+
Installation
25+
</h2>1) Install Python<br>
2626
<br>
2727
2) Install sswg:<br>
28+
<code_block id="code_block_0" style="margin:auto;">pip install https://github.com/pokepetter/sswg/archive/refs/heads/master.zip
29+
</code_block>
30+
<br>
31+
<h2 id="How to Run">
32+
How to Run
33+
</h2>cd into the folder where your text files are and run:<br>
34+
<br>
35+
<code_block id="code_block_1" style="margin:auto;">python -m sswg
36+
</code_block>
37+
<br>
2838
<br>
29-
<div class="code_block" id="code_block_0" style="margin-left: 0em;"><button class="copy_code_button" onclick="copy_to_clipboard(code_block_0)">copy</button>pip install <a href="https://github.com/pokepetter/sswg/archive/refs/heads/master.zip">https://github.com/pokepetter/sswg/archive/refs/heads/master.zip</a>
30-
</div><br>
31-
<h2><div id="How to Run"/><br>
32-
How to Run<br>
33-
</h2><br>
34-
<br>
35-
cd into the folder where your text files are and run:<br>
36-
<br>
37-
<div class="code_block" id="code_block_1" style="margin-left: 0em;"><button class="copy_code_button" onclick="copy_to_clipboard(code_block_1)">copy</button>python -m sswg
38-
</div><br>
39-
<br>
40-
<h2><div id="Tags"/><br>
41-
Tags<br>
42-
</h2><br>
43-
<br>
44-
<div class="code_block" id="code_block_2" style="margin-left: 0em;"><button class="copy_code_button" onclick="copy_to_clipboard(code_block_2)">copy</button> - <gray># size <yellow>1</yellow>.<yellow>2</yellow><yellow>5</yellow></gray>
45-
- <gray># width <yellow>9</yellow><yellow>0</yellow><yellow>0</yellow></gray>
46-
- <gray># left, right, center</gray>
47-
- <gray># normal, bold, bolder, lighter</gray>
48-
- <gray># image imagename</gray>
49-
- <gray># arial, times, helvetica, courier, verdana, tahoma, bookman, monospace</gray>
50-
- <gray># background colorname</gray>
51-
- <gray># code (start code block)</gray>
52-
- <gray># text (end code block)</gray>
53-
- <gray># insert some_file.txt</gray>
54-
- <gray>#<gray># (create header with size <yellow>2</yellow>)</gray>
55-
- <gray>#<gray>#<gray># (create header with size <yellow>3</yellow>)</gray>
56-
- <gray>#<gray>#<gray>#<gray># (create header with size <yellow>6</yellow>)</gray>
57-
- [Button Name, <a href="https://pokepetter.github.io/sswg/]">https://pokepetter.github.io/sswg/]</a>
58-
- [Button Name, <a href="https://pokepetter.github.io/sswg/,">https://pokepetter.github.io/sswg/,</a> image_name.jpg] (big button)
39+
<h2 id="Tags">
40+
Tags
41+
</h2><code_block id="code_block_2" style="margin:auto;"> - # size 1.25
42+
- # width 900
43+
- # left, right, center
44+
- # normal, bold, bolder, lighter
45+
- # image imagename
46+
47+
- #code (start code block)
48+
- #text (end code block)
49+
- #insert some_file.txt
50+
- ## (create header with size 2)
51+
- ### (create header with size 3)
52+
- #### (create header with size 6)
53+
- [Button Name, https://pokepetter.github.io/sswg/]
54+
- [Button Name, https://pokepetter.github.io/sswg/, image_name.jpg] (big button)
5955
- [Button Name, header name]
60-
- <gray># insert other_file.txt</gray>
61-
- <gray># index other_file.text (creates links to all the headers(<gray>#<gray>#) in the file)</gray>
62-
</div><br>
56+
- #insert other_file.txt
57+
- #index other_file.text (creates links to all the headers(##) in the file)
58+
</code_block>
6359
<br>
64-
<h2><div id="Style Override"/><br>
65-
Style Override<br>
66-
</h2><br>
6760
<br>
68-
Create a style.css file and it will get loaded automatically.<br>
61+
<h2 id="Style Override">
62+
Style Override
63+
</h2>Create a style.css file and it will get loaded automatically.<br>
6964
This will style all the pages in the project.<br>
7065
<br>
7166
To style a specific page, you can include the style inside < style > tags at<br>
7267
the top of the document<br>
7368
<br>
74-
<h2><div id="Example Website"/><br>
75-
Example Website<br>
76-
</h2><br>
77-
<br>
78-
<div class="code_block" id="code_block_3" style="margin-left: 0em;"><button class="copy_code_button" onclick="copy_to_clipboard(code_block_3)">copy</button><gray># center, bold, arial, size <yellow>5</yellow></gray>
79-
80-
ursina engine
81-
ʕ •ᴥ•ʔゝ□
82-
<gray># size <yellow>1</yellow>.<yellow>2</yellow><yellow>5</yellow>, bold</gray>
83-
--------------------------------------
84-
<gray># normal</gray>
85-
pip install ursina
86-
<gray># bold</gray>
87-
--------------------------------------
88-
89-
<gray># left, width <yellow>9</yellow><yellow>0</yellow><yellow>0</yellow>, size <yellow>2</yellow></gray>
90-
Powered by Python
91-
<gray># normal, size <yellow>1</yellow></gray>
69+
<h2 id="Example Website">
70+
Example Website
71+
</h2><code_block id="code_block_3" style="margin:auto;">### ursina engine ʕ •ᴥ•ʔゝ□
72+
`pip install ursina`
9273

74+
## Powered by Python
9375
Lorem Ipsum sit dolor et amet.
94-
</div><br>
95-
<img src="example_website.jpg"></img> <br>
96-
<br>
97-
<br>
98-
<h2><div id="Made with sswg"/><br>
99-
Made with sswg<br>
100-
</h2><br>
76+
</code_block>
10177
<br>
102-
<a href="https://www.ursinaengine.org/">https://www.ursinaengine.org/</a><br>
78+
<img src="example_website.jpg"></img> <br>
10379
<br>
80+
<h2 id="Made with sswg">
81+
Made with sswg
82+
</h2><a href="https://www.ursinaengine.org/">https://www.ursinaengine.org/</a><br>
10483
<a href="https://pokepetter.github.io/sswg/">https://pokepetter.github.io/sswg/</a><br>
105-
<br>
10684
<a href="https://pokepetter.github.io/taptapir/website/sunsnake.html">https://pokepetter.github.io/taptapir/website/sunsnake.html</a><br>
10785
<br>
108-
<br>
10986
<br>
11087
(\_/)<br>
11188
(>.<)<br>

index.sswg

Lines changed: 12 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,19 @@
1-
# left, bold, width 1000, size 5
2-
Simple Static Website Generator
3-
# size 1.5, normal
4-
1+
#width 1000
2+
### Simple Static Website Generator
53
A Markdown inspired markup language.
64
Converts the text files in a folder into web pages.
75
Use the tags below to style it.
86

97

108
## Installation
11-
129
1) Install Python
1310

1411
2) Install sswg:
15-
1612
```
1713
pip install https://github.com/pokepetter/sswg/archive/refs/heads/master.zip
1814
```
1915

2016
## How to Run
21-
2217
cd into the folder where your text files are and run:
2318

2419
```
@@ -27,71 +22,51 @@ python -m sswg
2722

2823

2924
## Tags
30-
3125
```
3226
- # size 1.25
3327
- # width 900
3428
- # left, right, center
3529
- # normal, bold, bolder, lighter
3630
- # image imagename
37-
- # arial, times, helvetica, courier, verdana, tahoma, bookman, monospace
38-
- # background colorname
39-
- # code (start code block)
40-
- # text (end code block)
41-
- # insert some_file.txt
31+
32+
- #code (start code block)
33+
- #text (end code block)
34+
- #insert some_file.txt
4235
- ## (create header with size 2)
4336
- ### (create header with size 3)
4437
- #### (create header with size 6)
4538
- [Button Name, https://pokepetter.github.io/sswg/]
4639
- [Button Name, https://pokepetter.github.io/sswg/, image_name.jpg] (big button)
4740
- [Button Name, header name]
48-
- # insert other_file.txt
49-
- # index other_file.text (creates links to all the headers(##) in the file)
41+
- #insert other_file.txt
42+
- #index other_file.text (creates links to all the headers(##) in the file)
5043
```
5144

5245

5346
## Style Override
54-
5547
Create a style.css file and it will get loaded automatically.
5648
This will style all the pages in the project.
5749

5850
To style a specific page, you can include the style inside < style > tags at
5951
the top of the document
6052

6153
## Example Website
62-
6354
```
64-
# center, bold, arial, size 5
65-
66-
ursina engine
67-
ʕ •ᴥ•ʔゝ□
68-
# size 1.25, bold
69-
--------------------------------------
70-
# normal
71-
pip install ursina
72-
# bold
73-
--------------------------------------
74-
75-
# left, width 900, size 2
76-
Powered by Python
77-
# normal, size 1
55+
### ursina engine ʕ •ᴥ•ʔゝ□
56+
`pip install ursina`
7857

58+
## Powered by Python
7959
Lorem Ipsum sit dolor et amet.
8060
```
8161

82-
# image example_website.jpg
83-
62+
#image example_website.jpg
8463

8564
## Made with sswg
86-
8765
https://www.ursinaengine.org/
88-
8966
https://pokepetter.github.io/sswg/
90-
9167
https://pokepetter.github.io/taptapir/website/sunsnake.html
9268

9369

94-
9570
(\_/)
9671
(>.<)
9772
(")_(")

sswg.css

Lines changed: 48 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,52 @@
11

2-
html {max-width: 100%; margin: auto; color: #333333;}
3-
h2 {font-size: 50px; margin-block-end:0px; margin-block-start:0px;}
2+
html {max-width: 100%; margin: auto; color: #333333;}
3+
body {
4+
font-size: 1em;
5+
line-height: 1.5;
6+
margin: auto;
7+
max-width: 100%;
8+
}
9+
h1 {
10+
font-size: 4em;
11+
line-height: 1;
12+
}
13+
h2 {
14+
font-size: 2em;
15+
font-weight: 600;
16+
line-height: 1;
17+
}
18+
h3 {
19+
font-size:1.5em;
20+
}
421

5-
a {transition: color .2s; color: #19405c; white-space: nowrap;}
6-
a:link, a:visited {color: #19405c;}
7-
a:hover {color: #7FDBFF;}
8-
a:active {transition: color .3s; color: #007BE6;}
9-
.link {text-decoration: none;}
22+
a {transition: color .2s; color: #19405c; white-space: nowrap;}
23+
a:link, a:visited {color: #19405c;}
24+
a:hover {color: #7FDBFF;}
25+
a:active {transition: color .3s; color: #007BE6;}
26+
.link {text-decoration: none;}
1027

11-
a.button {padding: 15px 32px; background-color: #555; border-radius: 2em; border-width: 0px; text-decoration: none; color: white; font-size: 25.0px; line-height: 2.5em;}
12-
a.button:hover {background-color: #777}
13-
a.button_big {padding: 0.5em; background-image: linear-gradient(to top, #427b0e, #9ba97d); background-color: lightgray; background-blend-mode: multiply; border-radius: .75em; border-width: 0px; text-decoration: none; min-width: 150px; max-width: 150px; min-height: 150px; max-height: 150px; display: inline-block; vertical-align: top; margin: 4px 4px 10px 4px; color: white; font-size: 25.0px; background-size: auto 100%; background-position-x: center;}
14-
a.button_big:hover {background-color: white; color: #e6d23f; text-decoration: underline;}
15-
mark {background: #ccff99;}
16-
span {background-color: rgba(0, 0, 0, 0.55); padding: .1em; line-height: 1.35em;}
17-
img {max-width: 100%; vertical-align: top;}
18-
.code_block {background-color: whitesmoke; padding: 10px; margin: 0; position: relative; font-family: monospace; font-size: 20px; font-weight: normal; white-space: pre; overflow: auto; border-radius:4px; scrollbar-color:red;}
19-
.copy_code_button {position:absolute; right:10px; border:none; border-radius:5px; font-family:inherit; color:gray; user-select:none; -webkit-user-select:none;}
20-
/* Hide scrollbar for Chrome, Safari and Opera */
21-
.code_block::-webkit-scrollbar {
22-
}
23-
.sidebar {position:fixed; z-index:1; left:1em; top:1em;}
24-
@media screen and (max-width: 1800px) {.sidebar {display:none;}}
25-
@media (max-width: 725px) {
26-
.button {display: block;}
27-
}
28+
a.button {padding: 15px 32px; font-size:.85em; background-color: #555; border-radius: 2em; border-width: 0px; text-decoration: none; color: white; font-size: 25.0px; line-height: 2.5em;}
29+
a.button:hover {background-color: #777}
30+
a.button_big {padding: 0.5em; background-image: linear-gradient(to top, #427b0e, #9ba97d); background-color: lightgray; background-blend-mode: multiply; border-radius: .75em; border-width: 0px; text-decoration: none; min-width: 150px; max-width: 150px; min-height: 150px; max-height: 150px; display: inline-block; vertical-align: top; margin: 4px 4px 10px 4px; color: white; font-size: 25.0px; background-size: auto 100%; background-position-x: center;}
31+
a.button_big:hover {background-color: white; color: #e6d23f; text-decoration: underline;}
32+
mark {background: #ccff99;}
33+
span {background-color: rgba(0, 0, 0, 0.55); padding: .1em; line-height: 1.35em;}
34+
img {max-width: 100%; vertical-align: top;}
35+
code_block {display: block;
36+
width: 100%; background-color: whitesmoke; padding: 10px; margin: 0; position: relative; font-family: monospace; font-size: 1em; font-weight: normal; white-space: pre; overflow: auto; border-radius:4px; scrollbar-color:red;}
37+
.copy_code_button {position:absolute; right:10px; border:none; border-radius:5px; font-family:inherit; color:gray; user-select:none; -webkit-user-select:none;}
38+
/* Hide scrollbar for Chrome, Safari and Opera */
39+
code_block::-webkit-scrollbar {
40+
}
41+
.sidebar {position:fixed; z-index:1; left:1em; top:1em;}
42+
@media screen and (max-width: 1800px) {.sidebar {display:none;}}
43+
@media (max-width: 725px) {
44+
.button {display: block;}
45+
}
2846

29-
purple {color: hsl(289.0, 50%, 50%);}
30-
gray {color: gray;}
31-
olive {color: olive;}
32-
yellow {color: darkgoldenrod;}
33-
green {color: seagreen;}
34-
blue {color: hsl(210, 50%, 50%);}
47+
purple {color: hsl(289.0, 50%, 50%);}
48+
gray {color: gray;}
49+
olive {color: olive;}
50+
yellow {color: darkgoldenrod;}
51+
green {color: seagreen;}
52+
blue {color: hsl(210, 50%, 50%);}

0 commit comments

Comments
 (0)