#1 First commit

It do be uglyyyyy
This commit is contained in:
glax 2023-05-22 22:25:50 +02:00
parent eddf50483f
commit b6ac2682f6
2 changed files with 113 additions and 0 deletions

27
Website/index.html Normal file
View File

@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Tranga</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<topbar>
<titlebox>Tranga</titlebox>
</topbar>
<viewport>
<sidebar>
</sidebar>
<content>
<publication>
<connector class="pill">Connector Name</connector>
<publication-name>Publication Name</publication-name>
</publication>
</content>
<settingstab>
</settingstab>
</viewport>
</body>
</html>

86
Website/style.css Normal file
View File

@ -0,0 +1,86 @@
body{
padding: 0;
margin: 0;
display: flex;
flex-flow: column;
flex-wrap: nowrap;
height: 100vh;
background-color: orange;
}
topbar {
display: flex;
align-items: center;
background-color: red;
height: 4rem;
}
titlebox {
font-size: 20pt;
font-weight: bold;
margin: 20px;
}
viewport {
display: flex;
background-color: blue;
flex-flow: row;
flex-wrap: nowrap;
flex-grow: 1;
}
sidebar{
background-color: green;
width: 20rem;
margin-bottom: 10px;
border-radius: 0 0 5px 0;
}
content {
background-color: yellow;
flex-grow: 1;
margin: 10px;
padding: 5px;
border-radius: 5px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
settingstab{
background-color: green;
width: 20rem;
margin-bottom: 10px;
border-radius: 0 0 5px 0;
}
publication{
background-color: gray;
width: 200px;
height: 300px;
border-radius: 5px;
margin: 10px 10px;
position: relative;
}
.pill {
height: 14pt;
font-size: 12pt;
border-radius: 7pt;
background-color: white;
padding: 1pt 20px;
}
connector{
position: absolute;
top: 10px;
left: 10px;
}
publication-name{
position: absolute;
font-size: 16pt;
font-weight: bold;
top: 35px;
left: 15px;
}