Browse Source

Games homepage.

master
Nicolas Hafner 4 months ago
parent
commit
d48ef60f67
Signed by: shinmera GPG Key ID: E12B14478BE4C922
4 changed files with 172 additions and 8 deletions
  1. +157
    -0
      games.html
  2. +1
    -0
      index.html
  3. +1
    -1
      main.css
  4. +13
    -7
      main.lass

+ 157
- 0
games.html View File

@ -0,0 +1,157 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Shirakumo</title>
<link rel="stylesheet" type="text/css" href="main.css" />
</head>
<body>
<header>
<h1>
<img src="logo.svg" alt="Shirakumo" id="logo" />
</h1>
<nav>
<a href="#about">About</a>
<a href="#team">Team</a>
<a href="#projects">Projects</a>
<a href="#contact">Contact</a>
</nav>
</header>
<main>
<section id="about">
<h2>About</h2>
<p>Shirakumo/Games is a small team working on independent video games.</p>
<p>This is a division of the <a href="index.html">open source collective</a> Shirakumo.</p>
</section>
<section id="team">
<h2>Team</h2>
<ul>
<li class="member vcard" data-member="nicolas hafner">
<div class="left">
<img class="photo" src="https://kandria.com/pitch/nicolas.png" />
</div>
<div class="right">
<h3>
<span class="fn">Nicolas Hafner</span>
<span class="nickname">Shinmera</span>
</h3>
<div class="linkage">
<a href="https://shinmera.com" class="url">shinmera.com</a>
<a href="https://twitter.com/shinmera" class="twitter">twitter.com/shinmera</a>
</div>
<div class="adr">
<span class="region">Zürich</span>,
<span class="country-name">Switzerland</span>
</div>
<p class="note">
Producer, programmer
</p>
</div>
</li>
<li class="member vcard" data-member="tim white">
<div class="left">
<img class="photo" src="https://kandria.com/pitch/tim.png" />
</div>
<div class="right">
<h3>
<span class="fn">Tim White</span>
</h3>
<div class="linkage">
<a href="https://timalanwhite.wordpress.com" class="url">timalanwhite.com</a>
<a href="https://twitter.com/timalanwhite" class="twitter">twitter.com/timalanhite</a>
</div>
<div class="adr">
<span class="region">Didcot</span>,
<span class="country-name">UK</span>
</div>
<p class="note">
Writer
</p>
</div>
</li>
<li class="member vcard" data-member="frederic tarabout">
<div class="left">
<img class="photo" src="https://kandria.com/pitch/fred.png" />
</div>
<div class="right">
<h3>
<span class="fn">Frederic Tarabout</span>
</h3>
<div class="linkage">
<a href="https://twitter.com/brobbeh" class="twitter">twitter.com/brobbeh</a>
</div>
<div class="adr">
<span class="region">San Francisco</span>,
<span class="country-name">USA</span>
</div>
<p class="note">
Artist
</p>
</div>
</li>
<li class="member vcard" data-member="mikel dale">
<div class="left">
<img class="photo" src="https://kandria.com/pitch/mikel.png" />
</div>
<div class="right">
<h3>
<span class="fn">Mikel Dale</span>
</h3>
<div class="linkage">
<a href="https://www.mikeldale.com" class="url">mikeldale.com</a>
<a href="https://twitter.com/MikelDaleMusic" class="twitter">twitter.com/mikeldalemusic</a>
</div>
<div class="adr">
<span class="region">London</span>,
<span class="country-name">UK</span>
</div>
<p class="note">
Composer
</p>
</div>
</li>
</ul>
</section>
<section id="projects">
<h2>Projects</h2>
<ul>
<li class="project">
<div class="left">
<img class="logo" src="https://kandria.com/media/large%20capsule.png" />
</div>
<div class="right">
<h3>Kandria</h3>
<div class="linkage">
<a class="steam" href="https://store.steampowered.com/app/1261430?utm_source=shirakumo.org">Steam</a>
<a class="url" href="https://kandria.com">Homepage</a>
</div>
<p class="note">
Explore a ruined open world of caverns and settlements. Hack and slash your way through missions: patrol borders, repair machines, scavenge supplies - choose your quests and dialogue. Or go fishing, forage mushrooms, and race the clock! The old world is gone - the future is up to you.
</p>
</div>
</li>
<li class="project">
<div class="left">
<img class="logo" src="https://kandria.com/eternia/media/library%20logo.png" />
</div>
<div class="right">
<h3>Eternia: Pet Whisperer</h3>
<div class="linkage">
<a class="steam" href="https://store.steampowered.com/app/1605720/Eternia_Pet_Whisperer/?utm_source=shirakumo.org">Steam</a>
<a class="url" href="https://kandria.com/eternia">Homepage</a>
</div>
<p class="note">
Tired of the daily churn, only to come home to an empty apartment? The Rainbow Dome shelter will help you find the perfect partner to spice up your life! Check out our exotic selection of pets and you'll surely find the piece of you you've always been missing!
</p>
</div>
</li>
</ul>
</section>
<section id="contact">
<h2>Contact</h2>
<p>You can reach us through email at <a href="mailto:[email protected]">[email protected]</a>.</p>
</section>
</main>
</body>
</html>

+ 1
- 0
index.html View File

@ -21,6 +21,7 @@
<section id="about">
<h2>About</h2>
<p>Shirakumo is a small collective writing open source software.</p>
<p>There is also a <a href="games.html">separate games team</a> working on several indie titles.</p>
</section>
<section id="members">
<h2>Members</h2>

+ 1
- 1
main.css View File

@ -1 +1 @@
html{font-family:sans-serif;font-size:14pt;color:#333333;background:#EEEEEE;}html body{padding:0;max-width:800px;min-width:500px;margin:0 auto 0 auto;}html body a{text-decoration:none;color:#888888;}html body a:hover{color:#0088EE;}html body header h1{text-align:center;}html body header h1 img{max-height:128px;}html body header h1 img path{fill:orange;}html body header nav{border-top:1px solid #CCCCCC;display:flex;justify-content:center;}html body header nav a{padding:2px 5px 2px 5px;font-size:1.5em;}html body main{padding:10px;}html body main section{clear:both;}html body main section h2{font-size:2.0em;margin:0;color:#888888;padding:0 0 0 10px;font-weight:normal;}html body main #members ul{list-style:none;margin:0;padding:0 0 0 1em;}html body main #members ul .member{clear:both;display:flex;align-items:flex-start;}html body main #members ul .member .photo{border-radius:128px;float:left;margin:1em;}html body main #members ul .member h3{font-weight:normal;margin:5px;}html body main #members ul .member .nickname:before{content:" - ";}html body main #members ul .member .linkage,html body main #members ul .member .adr{font-size:0.9em;}
html{font-family:sans-serif;font-size:14pt;color:#333333;background:#EEEEEE;}html body{padding:0;max-width:800px;min-width:500px;margin:0 auto 0 auto;}html body a{text-decoration:none;color:#888888;}html body a:hover{color:#0088EE;}html body header h1{text-align:center;}html body header h1 img{max-height:128px;}html body header h1 img path{fill:orange;}html body header nav{border-top:1px solid #CCCCCC;display:flex;justify-content:center;}html body header nav a{padding:2px 5px 2px 5px;font-size:1.5em;}html body main{padding:10px;}html body main section{clear:both;}html body main section h2{font-size:2.0em;margin:0;color:#888888;padding:0 0 0 10px;font-weight:normal;}html body main ul{list-style:none;margin:0;padding:0 0 0 1em;}html body main ul .member{clear:both;display:flex;align-items:flex-start;}html body main ul .member .photo{max-width:128px;float:left;margin:1em;}html body main ul .member .nickname:before{content:" - ";}html body main ul .member .linkage,html body main ul .member .adr{font-size:0.9em;}html body main ul h3{font-weight:normal;margin:5px;}html body main ul .project{display:flex;align-items:flex-start;}html body main ul .project .logo{float:left;max-width:10em;margin:1em;}

+ 13
- 7
main.lass View File

@ -43,8 +43,7 @@
:color #(link)
:padding 0 0 0 10px
:font-weight normal))
("#members"
(ul
(ul
:list-style none
:margin 0
:padding 0 0 0 1em
@ -53,13 +52,20 @@
:display flex
:align-items flex-start
(.photo
:border-radius 128px
:max-width 128px
:float left
:margin 1em)
(h3
:font-weight normal
:margin 5px)
((:and .nickname :before)
:content "' - '")
((:or .linkage .adr)
:font-size 0.9em))))))))
:font-size 0.9em))
(h3
:font-weight normal
:margin 5px)
(.project
:display flex
:align-items flex-start
(.logo
:float left
:max-width 10em
:margin 1em)))))))

Loading…
Cancel
Save