Compare commits

...

3 Commits

Author SHA1 Message Date
Sophie Marie db956c4ba4
WIP: Add characters page
todo: fix display when multiple windows, mobile support, move images to img.system64.dev
2024-03-03 16:22:35 -06:00
Sophie Marie 742cac0ef8
change recommended contact 2024-03-03 16:21:42 -06:00
Sophie Marie b7def23926
Rename oc refs button, update link 2024-03-03 16:20:16 -06:00
6 changed files with 120 additions and 4 deletions

55
characters/index.html Normal file
View File

@ -0,0 +1,55 @@
<!DOCTYPE HTML>
<head>
<link rel="stylesheet" type="text/css" href="/styles/main_style.css"> <!-- Import main styling -->
<link rel="stylesheet" type="text/css" href="/styles/button_style.css"> <!-- Button styling -->
<link rel="stylesheet" type="text/css" href="/styles/window_style.css"> <!-- Window Styling -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>system64.dev - OCs</title>
<!-- embed -->
<meta content="system64.dev" property="og:title" />
<meta content="The site of IDeletedSystem64 on the World Wide Web thingamajig" property="og:description" />
<meta content="https://system64.dev" property="og:url" />
<meta content="https://system64.dev/img/blueberry.png" property="og:image" />
<meta content="#2452b5" data-react-helmet="true" name="theme-color" />
</head>
<body>
<div class="taskbar">
<input class="start" type="button" onclick="location.href='/';" value="system64.dev">
<input class="taskbar" type="button" onclick="location.href='/artwork/index.html';" value="Artwork">
<input class="taskbar" type="button" onclick="location.href='/projects/index.html';" value="Projects">
<input class="taskbar" type="button" onclick="location.href='/characters/index.html';" value="Characters">
<input class="taskbar" type="button" onclick="location.href='https://git.system64.dev'" value="Code (Gitea)">
</div>
<div class="container">
<div class="window">
<div class="window_titlebar"><h3 class="window">Technocolor (Pony)</h3></div>
<img src="./preview/ponytown_technocolor.png">
<h1>Technocolor</h1>
<p>there's supposed to be a snippet of oc lore here ok plz be patient with me</p>
<ul>
<li>Trans (FtM)</li>
<li>Alicorn</li>
<li>Music pony</li>
</ul>
<input type="button" onclick="location.href='./refsheet/technocolor_refsheetv1.png';" value="Get the refsheet">
</div>
<!-- trying something with putting this outside the flexbox.. -->
<div class="window" style="width:45vh; float:right;">
<div class="window_titlebar"><h3 class="window">Can I draw your characters?</h3></div>
<h1>Absolutely!</h1>
<p>Anyone can draw my characters, there's not much that makes me happier than seeing art of my characters. It doesn't even have to be the greatest!</p>
<p>What you can do with my characters:</p>
<ul>
<li>Draw them with your own character</li>
<li>Ship them with their canon ships</li>
</ul>
<p>You CANNOT do this with my characters:</p>
<ul>
<li>Draw gore of them</li>
<li>Ship them with your own characters</li>
<li>Draw NSFW content</li>
</ul>
<p>If there's something you aren't sure about, feel free to ask me!</p>
<p>Additionally, you can send your drawings to me via one of my contacts on my <a href="../socials.html" style="color:blue">contacts page.</a></p>
</div>
</body>

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 MiB

View File

@ -15,7 +15,7 @@
<input class="start" type="button" onclick="location.href='/';" value="system64.dev">
<input class="taskbar" type="button" onclick="location.href='/artwork/index.html';" value="Artwork">
<input class="taskbar" type="button" onclick="location.href='/projects/index.html';" value="Projects">
<input class="taskbar" type="button" onclick="location.href='/ocs/index.html';" value="Characters">
<input class="taskbar" type="button" onclick="location.href='/characters/index.html';" value="Characters">
<input class="taskbar" type="button" onclick="location.href='https://git.system64.dev'" value="Code (Gitea)">
</div>
<div class="container">

View File

@ -15,7 +15,7 @@
<input class="start" type="button" onclick="location.href='/';" value="system64.dev">
<input class="taskbar" type="button" onclick="location.href='/artwork/index.html';" value="Artwork">
<input class="taskbar" type="button" onclick="location.href='/projects/index.html';" value="Projects">
<input class="taskbar" type="button" onclick="location.href='/ocs/index.html';" value="Characters">
<input class="taskbar" type="button" onclick="location.href='/characters/index.html';" value="Characters">
<input class="taskbar" type="button" onclick="location.href='https://git.system64.dev'" value="Code (Gitea)">
</div>
<div class="container">
@ -34,8 +34,8 @@
<p>Steam: <a href='https://steamcommunity.com/id/system64_/'>IDeletedSystem64</a></p>
<p>Bandcamp: <a href='https://bandcamp.com/ideletedsystem64'>IDeletedSystem64</a></p>
<h2>Contact</h2>
<p>Email: <a href='mailto:ideleted@system64.dev'>ideleted@system64.dev</a></p>
<p>Matrix: @technomancer:littlepony.horse (recommended)</p>
<p>Email: <a href='mailto:ideleted@system64.dev'>ideleted@system64.dev (Recommended)</a></p>
<p>Matrix: @technomancer:littlepony.horse (Recommended)</p>
</div>
<img loading="lazy" class="home" src="https://img.system64.dev/web/banners/TheInternet.png" alt="MS Paint showing the Windows 95 browser icon">

61
styles/window_style.css Normal file
View File

@ -0,0 +1,61 @@
/* Moving window stuff here to make it easier to work with */
@font-face { font-family: 'Share Tech'; src: url(../fonts/Share-Tech/ShareTech-Regular.ttf) format('woff2'); }
@font-face { font-family: 'Share Tech Mono'; src: url(../fonts/Share-Tech/ShareTechMono-Regular.ttf) format('woff2'); }
@font-face { font-family: 'Bitter'; src: url(../fonts/Bitter/Bitter-VariableFont_wght.ttf) format('woff2'); }
/* Probably not the right way to do it, but eh. We can come back to this later.*/
div.window_titlebar {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 22px;
background: navy;
}
div.window {
position: relative;
border-style: ridge;
border-width: 5px;
border-color: #e9e9e9;
overflow-y: auto;
width: 40vw;
max-width: 80vw;
padding-top: 4vh;
padding-bottom: 1vh;
padding-left: 1vh;
max-height: 60vh;
background-color: #e9e9e9;
margin: 10vh 1vh auto 25vh;
}
img {
float: right;
}
/* Fonts */
h1 {
font-family: 'Bitter', serif;
font-size: 20pt;
color: black
}
p { color: black }
li { color: black }
h3.window {
color: white;
display: inline;
padding-left: 2px;
font-family: 'Bitter', serif;
font-size: 11pt;
}