first commit

This commit is contained in:
Xaloc 2022-09-23 15:58:23 +02:00
commit 22a70dc0a2
8 changed files with 115 additions and 0 deletions

5
LICENSE Normal file
View File

@ -0,0 +1,5 @@
"THE NON-ALCOHOLIC-BEVERAGE-WARE LICENSE":
<xaloc@tutanota.com> wrote this. As long as you retain this notice you can
do whatever you want with this stuff. If we meet some day, and you think this
stuff is worth it, you can buy me a non-alcoholic beverage in return Xaloc

7
README.md Normal file
View File

@ -0,0 +1,7 @@
## GNLT is NOT LinkTree
This is a very crude way of generating a static website to list multiple links to other websites. Edit the csv files to put the links (DO NOT CHANGE THE FIRST LINE) or the description. To add a logo/image in the link button put the name of the image in the logo column and make sure the image is in the same folder as index.html.
To generate the code just run ```python gencode.py``` after modifying the csv files.
#### Customisation
The looks of the page can be modified by changing the styles.css files. If you make changes to either script.js or index.html they will be rewritten the next time the python script is run.

18
gencode.py Normal file
View File

@ -0,0 +1,18 @@
import pandas as pd
titleDF = pd.read_csv("title.csv")
linksDF = pd.read_csv("links.csv")
html = open("index.html", "w")
html.write("<!DOCTYPE html>\n<html lang='en'>\n<head>\n\t<title>Your Links</title>\n\t<meta charset='UTF-8'>\n\t<meta name='viewport' content='width=device-width, initial-scale=1'/>\n\t<link rel='stylesheet' href='styles.css'>\n</head>\n<body>\n")
html.write(f"<img src='{titleDF['logo'][0]}' class='top-logo'>\n\t<h2>{titleDF['description'][0]}</h2>\n<br>\n")
for i,x in linksDF.iterrows():
html.write(f"<div>\n<button class='menu' onclick='{x['name'].replace(' ','').lower()}.show()'><img src='{x['logo']}' class='small-logo'>&emsp; {x['name']}</button>\n\t</div>\n\t<br>\n")
html.write("\t<script src='script.js'></script>\n</body>\n</html>")
html.close()
script = open("script.js", "w")
script.write("class link{\n\tconstructor(url){\n\t\tthis.url= url;\n\t}\n\tshow(){\n\t\tvar win=window.open(this.url, '_blank');\n\t\twin.focus();\n\t}\n}")
for i,x in linksDF.iterrows():
script.write(f"var {x['name'].replace(' ','').lower()} = new link('{x['link']}')\n")
script.close()

27
index.html Normal file
View File

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Your Links</title>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1'/>
<link rel='stylesheet' href='styles.css'>
</head>
<body>
<img src='logo.png' class='top-logo'>
<h2>Add here a description for people using this links</h2>
<br>
<div>
<button class='menu' onclick='firstlink.show()'><img src='logo.png' class='small-logo'>&emsp; First Link</button>
</div>
<br>
<div>
<button class='menu' onclick='secondlink.show()'><img src='logo.png' class='small-logo'>&emsp; Second Link</button>
</div>
<br>
<div>
<button class='menu' onclick='thirdlink.show()'><img src='logo.png' class='small-logo'>&emsp; Third Link</button>
</div>
<br>
<script src='script.js'></script>
</body>
</html>

4
links.csv Normal file
View File

@ -0,0 +1,4 @@
name,link,logo
First Link,https://git.xaloc.space,logo.png
Second Link,https://fsf.org,logo.png
Third Link,https://fedi.cat,logo.png
1 name link logo
2 First Link https://git.xaloc.space logo.png
3 Second Link https://fsf.org logo.png
4 Third Link https://fedi.cat logo.png

11
script.js Normal file
View File

@ -0,0 +1,11 @@
class link{
constructor(url){
this.url= url;
}
show(){
var win=window.open(this.url, '_blank');
win.focus();
}
}var firstlink = new link('https://git.xaloc.space')
var secondlink = new link('https://fsf.org')
var thirdlink = new link('https://fedi.cat')

41
styles.css Normal file
View File

@ -0,0 +1,41 @@
body {
font-family: URW Gothic L, sans-serif;
background-color: #f2f3f4;
color: black;
font-size: 2vw;
}
h2 {
margin: auto;
text-align: center;
max-width: 60%;
font-size: 2vw;
}
.menu {
margin: auto;
width: 70%;
background-color: #B4BAC0;
border-radius: 10px 10px;
padding: 1vw;
display: block;
text-align: center;
font-size: 1.5vw;
}
.menu:hover{
transition: 1s all;
color: #f2f3f4;
background-color: #0b00ac;
border-top-right-radius: 10px 10px;
border-bottom-right-radius: 10px 10px;
cursor: pointer;
}
.top-logo{
margin: auto;
display: block;
max-width: 15%;
}
.small-logo{
max-width: 2vw;
vertical-align: top;
}

2
title.csv Normal file
View File

@ -0,0 +1,2 @@
description,logo
Add here a description for people using this links,logo.png
1 description logo
2 Add here a description for people using this links logo.png