changed look and created about page (WIP)

This commit is contained in:
edwark43 2023-04-06 23:43:58 +00:00
parent 07d3cf3a05
commit 76ce02d04c
7 changed files with 118 additions and 100 deletions

View File

@ -36,7 +36,10 @@
<body> <body>
<h1 style="font-size: 60px">500 Internal Server Error</h1> <h1 style="font-size: 60px">500 Internal Server Error</h1>
<p style="font-size: 30px"> <p style="font-size: 30px">
The server encountered an internal error and was unable to complete your request.<br> Try to <a href="/">refresh</a> and see if that fixes the issue.<br>If not then try again later. The server encountered an internal error and was unable to complete your
request.<br />
Try to <a href="/">refresh</a> and see if that fixes the issue.<br />If
not then try again later.
</p> </p>
</body> </body>
</html> </html>

View File

@ -35,8 +35,6 @@
</head> </head>
<body> <body>
<h1 style="font-size: 60px">502 Bad Gateway</h1> <h1 style="font-size: 60px">502 Bad Gateway</h1>
<p style="font-size: 30px"> <p style="font-size: 30px">The server returned an incomplete request.</p>
The server returned an incomplete request.
</p>
</body> </body>
</html> </html>

View File

@ -4,7 +4,7 @@
body { body {
padding: px; padding: px;
background: #868686; background: #989898;
margin: 0; margin: 0;
overflow-x: hidden; overflow-x: hidden;
font-family: sans-serif; font-family: sans-serif;
@ -27,6 +27,8 @@ body {
#content-wrap { #content-wrap {
padding-bottom: 2.5rem; padding-bottom: 2.5rem;
margin-top: 15px;
margin-left: 20px;
} }
#footer { #footer {
@ -82,22 +84,71 @@ body {
} }
.material-symbols-rounded { .material-symbols-rounded {
font-variation-settings: font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 200, "opsz" 48;
'FILL' 0,
'wght' 700,
'GRAD' 200,
'opsz' 48
} }
.materialtext{ .materialtext {
font-size: 19.2px; font-size: 19.2px;
} }
.imglink { .imglink {
width: 51.5px; width: 50px;
height: 51.5px; height: 50px;
background-color: rgb(255, 255, 255); margin-left: 10px;
float: right;
} }
.img { .img {
width: 51.5px; height: 50px;
height: 51.5px; width: 50px;
}
.about {
background-color: white;
width: 250px;
height: 250px;
border-radius: 50px;
float: right;
margin-right: 40px;
}
.aboutext {
font-size: x-large;
text-align: center;
}
#aboutpg {
background-color: white;
width: 70%;
height: 100%;
border-radius: 25px;
float: left;
}
#pgt {
margin-left: 25px;
margin-right: 25px;
}
ul {
list-style-type: none;
margin: auto;
padding: auto;
overflow: hidden;
background-color: hsl(0, 0%, 0%);
width: 98%;
border-radius: 50px;
margin-top: 5px;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: hsl(241, 85%, 18%);
}
.active {
background-color: hsl(244, 100%, 52%);
} }

View File

@ -1,34 +0,0 @@
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: hsl(0, 0%, 0%);
position: fixed;
top: 0;
width: 100%;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: hsl(241, 85%, 18%);
}
.active {
background-color: hsl(244, 100%, 52%);
}
body {
margin: 0px;
}

View File

@ -33,7 +33,6 @@
<link rel="stylesheet" href="/assets/styles/button.css" /> <link rel="stylesheet" href="/assets/styles/button.css" />
<link rel="stylesheet" href="/assets/styles/backround.css" /> <link rel="stylesheet" href="/assets/styles/backround.css" />
<link rel="stylesheet" href="/assets/styles/noscroll.css" /> <link rel="stylesheet" href="/assets/styles/noscroll.css" />
<link rel="stylesheet" href="/assets/styles/navbar.css" />
<link rel="stylesheet" href="/assets/styles/main.css" /> <link rel="stylesheet" href="/assets/styles/main.css" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
</head> </head>
@ -46,13 +45,9 @@
</li> </li>
<li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li> <li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li>
<li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li> <li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li>
<li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li> <li class="materialtext"><a href="/p/about/" title="WIP">WIP</a></li>
</ul> </ul>
<br />
<br />
<br />
<div id="content-wrap"> <div id="content-wrap">
&nbsp;
<img <img
src="/assets/imgs/zuck.jpg" src="/assets/imgs/zuck.jpg"
alt="zuck" alt="zuck"
@ -60,7 +55,7 @@
srcset="" srcset=""
class="borderimg" class="borderimg"
/> />
<p class="welcome">&nbsp;&nbsp;<span class="auto-type"></span></p> <p class="welcome"><span class="auto-type"></span></p>
</div> </div>
<!--<div id="footer"></div>--> <!--<div id="footer"></div>-->
</div> </div>

View File

@ -33,29 +33,34 @@
<link rel="stylesheet" href="/assets/styles/button.css" /> <link rel="stylesheet" href="/assets/styles/button.css" />
<link rel="stylesheet" href="/assets/styles/backround.css" /> <link rel="stylesheet" href="/assets/styles/backround.css" />
<link rel="stylesheet" href="/assets/styles/noscroll.css" /> <link rel="stylesheet" href="/assets/styles/noscroll.css" />
<link rel="stylesheet" href="/assets/styles/navbar.css" />
<link rel="stylesheet" href="/assets/styles/main.css" /> <link rel="stylesheet" href="/assets/styles/main.css" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
</head> </head>
<body> <body>
<p> <div id="page-container">
Aliqua elit nostrud nulla esse dolor duis ad in. Laboris dolore in nulla <div class="bg"></div>
velit. Excepteur sint laborum cupidatat minim ex tempor laboris proident <ul>
amet sint cupidatat. Quis excepteur laboris voluptate enim ipsum laboris <li class="material-symbols-rounded">
eiusmod ex nostrud id ut aliquip. Officia sint minim labore mollit. Anim <a title="Home" href="/">Home</a>
nulla ea do eu sit. Est qui mollit cupidatat ullamco pariatur aliquip </li>
laborum nisi labore commodo veniam. Dolor mollit minim et reprehenderit <li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li>
excepteur ullamco proident reprehenderit aute aute ad. Anim officia <li class="materialtext"><a href="/p/wip/" title="WIP">WIP</a></li>
cupidatat occaecat Lorem ullamco do ex tempor. Labore do labore culpa <li class="materialtext">
aliqua. Sint dolor proident eu Lorem ex. Elit eu nulla aliquip non sit <a class="active" href="/p/about/" title="WIP">WIP</a>
anim qui sunt reprehenderit ullamco. Sit nulla excepteur nulla irure </li>
cupidatat cillum id. Eu magna ex sit cillum aute incididunt aliquip mollit </ul>
incididunt mollit exercitation. Et nulla dolor labore veniam esse eu culpa <div id="content-wrap">
ullamco laboris ut. Ut ex aliqua pariatur amet esse adipisicing velit <div id="aboutpg">
officia aliquip proident non. <p id="pgt">
</p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin efficitur vulputate orci vel posuere. In consectetur enim turpis, quis sagittis enim luctus sed. Maecenas scelerisque dignissim viverra. Cras ullamcorper dictum ultrices. Quisque iaculis consequat neque. Mauris ut lacus ut mi sodales iaculis quis hendrerit nunc. Sed volutpat accumsan leo, eget lacinia dui faucibus ut. Maecenas sagittis bibendum tellus, in egestas mi. Donec efficitur ex ipsum, a aliquam neque pellentesque id. Donec aliquam vitae purus non tincidunt. Integer sed semper ex. Maecenas faucibus lorem facilisis metus tempor, vitae rutrum quam iaculis. Quisque hendrerit eget est tristique cursus. Integer consectetur, velit non pulvinar semper, nunc enim dictum lacus, quis ultricies odio mauris sed lectus. Aliquam erat volutpat. Mauris id enim felis. Aliquam sollicitudin, nunc a sodales iaculis, ipsum nunc luctus quam, sed maximus sem magna sit amet nisl. Phasellus porta dui ac magna eleifend viverra. Aliquam sem ipsum, rutrum non vehicula nec, pellentesque a sapien. Nulla consequat mattis facilisis. Sed tincidunt, neque id euismod dictum, magna diam tempor lacus, vitae condimentum turpis lacus lobortis metus. Nam ut mattis mi. Donec et auctor sem, vitae feugiat nibh. Sed et efficitur ligula, feugiat fermentum elit. Cras vulputate pulvinar tincidunt. In bibendum dolor nec leo venenatis, in fermentum augue mattis. Mauris varius auctor tortor sed gravida. Ut diam nisl, interdum eu tellus quis, semper bibendum leo. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras tortor libero, congue nec risus sit amet, eleifend pretium lorem. Quisque justo enim, malesuada et eros vel, sollicitudin molestie nibh. Cras pulvinar ex id ligula convallis vestibulum. Pellentesque velit augue, consequat a ipsum at, elementum ullamcorper augue. Maecenas volutpat turpis in mauris congue rutrum. Vivamus ultricies diam sit amet tortor laoreet, in malesuada orci facilisis. Vestibulum justo diam, posuere vehicula mi vitae, fringilla malesuada felis. Sed vehicula nunc ut leo luctus, id commodo quam gravida. Donec at lacinia ex. Cras laoreet dui eget ex ultricies suscipit in id neque. Vestibulum consequat turpis quis eleifend condimentum. Nulla tortor tortor, aliquet vel urna ac, tincidunt tincidunt est. Vivamus vestibulum efficitur luctus. Praesent porttitor dolor euismod diam eleifend, porttitor pellentesque nisl dapibus. Nulla vitae magna blandit, lobortis elit vitae, lacinia lacus. In eget tempor eros. Curabitur scelerisque lorem lectus, et posuere augue dictum vel. Nunc mollis, nunc at rutrum tincidunt, ligula ipsum finibus mi, nec efficitur urna augue eget lacus. Praesent at arcu porta, pharetra arcu vehicula, tempus neque. Curabitur luctus risus a eros aliquam, et elementum elit dignissim. Quisque in dui porta, finibus nisl eu, pellentesque ante. Morbi ac rutrum quam.
<a class="imglink" href="https://github.com/edwark43" </p>
><img class="img" src="/assets/imgs/github.png" alt="github" </div>
/></a> <div class="about">
<p class="aboutext">Links</p>
<a class="imglink" href="https://github.com/edwark43"
><img class="img" src="/assets/imgs/github.png" alt="github"
/></a>
</div>
</div>
</body> </body>
</html> </html>

View File

@ -33,30 +33,30 @@
<link rel="stylesheet" href="/assets/styles/button.css" /> <link rel="stylesheet" href="/assets/styles/button.css" />
<link rel="stylesheet" href="/assets/styles/backround.css" /> <link rel="stylesheet" href="/assets/styles/backround.css" />
<link rel="stylesheet" href="/assets/styles/noscroll.css" /> <link rel="stylesheet" href="/assets/styles/noscroll.css" />
<link rel="stylesheet" href="/assets/styles/navbar.css" />
<link rel="stylesheet" href="/assets/styles/main.css" /> <link rel="stylesheet" href="/assets/styles/main.css" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
</head> </head>
<body> <body>
<div class="bg"></div> <div id="page-container">
<ul> <div class="bg"></div>
<li class="material-symbols-rounded"> <ul>
<a href="/" title="Home">Home</a> <li class="material-symbols-rounded">
</li> <a href="/" title="Home">Home</a>
<li class="materialtext"> </li>
<a class="active" href="/p/wip/" title="WIP">WIP</a> <li class="materialtext">
</li> <a class="active" href="/p/wip/" title="WIP">WIP</a>
<li class="materialtext"> </li>
<a class="active" href="/p/wip/" title="WIP">WIP</a> <li class="materialtext">
</li> <a class="active" href="/p/wip/" title="WIP">WIP</a>
<li class="materialtext"> </li>
<a class="active" href="/p/wip/" title="WIP">WIP</a> <li class="materialtext">
</li> <a href="/p/about/" title="WIP">WIP</a>
</ul> </li>
<br /> </ul>
<br /> <div id="content-wrap">
<br /> <h1>WIP</h1>
<h1>WIP</h1> <p>This page is going to be worked on eventually.</p>
<p>This page is going to be worked on eventually.</p> </div>
</div>
</body> </body>
</html> </html>