Ellpeck/TinyLifeWeb
1
0
Fork 0
mirror of https://github.com/Ellpeck/TinyLifeWeb.git synced 2024-11-22 11:23:29 +01:00
Code Issues Projects Releases Wiki Activity

added some more content to the website

Browse source
This commit is contained in:
Ell 2022-01-23 15:58:04 +01:00
parent 2b3e5c444e
commit 9a211c0e33
19 changed files with 326 additions and 107 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
.gitignore vendored
View file

@ -1,7 +1,3 @@
/**/DROP/
/**/TEMP/
/**/packages/
/**/bin/
/**/obj/
_site
tools
.jekyll-cache
obj

7
Jenkinsfile vendored
View file

@ -6,8 +6,11 @@ pipeline {
branch 'main'
}
steps {
sh '''cd web
bundle
bundle exec jekyll build'''
sh 'rm -rf /var/www/tinylifegame/*'
sh 'cp web/. /var/www/tinylifegame/ -r'
sh 'cp -r web/_site/. /var/www/tinylifegame/'
}
}
stage('Docs') {
@ -17,7 +20,7 @@ pipeline {
steps {
sh 'cd docs; docfx.exe'
sh 'rm -rf /var/www/tinylifedocs/*'
sh 'cp docs/_site/. /var/www/tinylifedocs/ -r'
sh 'cp -r docs/_site/. /var/www/tinylifedocs/'
}
}
}

8
web/Gemfile Normal file
View file

@ -0,0 +1,8 @@
# frozen_string_literal: true
source "https://rubygems.org"
git_source(:github) { |repo_name| "https://github.com/#{repo_name}" }
gem "jekyll"
gem "webrick"

69
web/Gemfile.lock Normal file
View file

@ -0,0 +1,69 @@
GEM
remote: https://rubygems.org/
specs:
addressable (2.8.0)
public_suffix (>= 2.0.2, < 5.0)
colorator (1.1.0)
concurrent-ruby (1.1.9)
em-websocket (0.5.3)
eventmachine (>= 0.12.9)
http_parser.rb (~> 0)
eventmachine (1.2.7-x64-mingw32)
ffi (1.15.5-x64-mingw32)
forwardable-extended (2.6.0)
http_parser.rb (0.8.0)
i18n (1.8.11)
concurrent-ruby (~> 1.0)
jekyll (4.2.1)
addressable (~> 2.4)
colorator (~> 1.0)
em-websocket (~> 0.5)
i18n (~> 1.0)
jekyll-sass-converter (~> 2.0)
jekyll-watch (~> 2.0)
kramdown (~> 2.3)
kramdown-parser-gfm (~> 1.0)
liquid (~> 4.0)
mercenary (~> 0.4.0)
pathutil (~> 0.9)
rouge (~> 3.0)
safe_yaml (~> 1.0)
terminal-table (~> 2.0)
jekyll-sass-converter (2.1.0)
sassc (> 2.0.1, < 3.0)
jekyll-watch (2.2.1)
listen (~> 3.0)
kramdown (2.3.1)
rexml
kramdown-parser-gfm (1.1.0)
kramdown (~> 2.0)
liquid (4.0.3)
listen (3.7.1)
rb-fsevent (~> 0.10, >= 0.10.3)
rb-inotify (~> 0.9, >= 0.9.10)
mercenary (0.4.0)
pathutil (0.16.2)
forwardable-extended (~> 2.6)
public_suffix (4.0.6)
rb-fsevent (0.11.0)
rb-inotify (0.10.1)
ffi (~> 1.0)
rexml (3.2.5)
rouge (3.27.0)
safe_yaml (1.0.5)
sassc (2.4.0-x64-mingw32)
ffi (~> 1.9)
terminal-table (2.0.0)
unicode-display_width (~> 1.1, >= 1.1.1)
unicode-display_width (1.8.0)
webrick (1.7.0)
PLATFORMS
x64-mingw32
DEPENDENCIES
jekyll
webrick
BUNDLED WITH
2.2.26

2
web/_config.yaml Normal file
View file

@ -0,0 +1,2 @@
kramdown:
header_offset: 1

25
web/_data/devlogs.json Normal file
View file

@ -0,0 +1,25 @@
[{
"name": "0.19.0: Ui, Sound and Improvements Abound",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/330680/0190-ui-sound-and-improvements-abound",
"steam": "https://store.steampowered.com/news/app/1651490/view/3109171219652255208"
}, {
"name": "0.18.0: Animations, Food and Sources",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/317472/0180-animations-food-and-sources",
"steam": "https://store.steampowered.com/news/app/1651490/view/3111419849470831533"
}, {
"name": "0.17.0: Life Goals, Reward Personalities and Daily Tasks",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/303915/0170-life-goals-reward-personalities-and-daily-tasks",
"steam": "https://store.steampowered.com/news/app/1651490/view/4244072077610086379"
}, {
"name": "0.16.0: Woodlands and Visitors",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/289260/0160-woodlands-and-visitors",
"steam": "https://store.steampowered.com/news/app/1651490/view/2949282742498975401"
}, {
"name": "0.15.0: Barbecue Trash Cleaning",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/277913/0150-barbecue-trash-cleaning",
"steam": "https://store.steampowered.com/news/app/1651490/view/2968419780808932932"
}, {
"name": "0.14.0: Lamps, Lot Movement, Speech Sounds!",
"itch": "https://ellpeck.itch.io/tiny-life/devlog/274082/0140-lamps-lot-movement-speech-sounds",
"steam": "https://store.steampowered.com/news/app/1651490/view/4430963222678444595"
}]

16
web/_data/screenshots.json Normal file
View file

@ -0,0 +1,16 @@
[{
"value": "CharacterCreator",
"text": "Create your own characters with unique personalities and skills and dress them however you like"
}, {
"value": "Map",
"text": "Build houses and community spaces like parks and cafés and watch households inhabit them"
}, {
"value": "Gameplay",
"text": "Control your household and tell your characters what to do, from cooking food to learning complex skills like programming and painting"
}, {
"value": "Relationships",
"text": "Have your characters interact, build relationships, grow families and live unique lives"
}, {
"value": "Lighting",
"text": "Share your creations with the community by exporting lots and households from your game"
}]

15
web/_includes/about.html Normal file
View file

@ -0,0 +1,15 @@
<div class="section">
<span id="about"></span>
<h1>About Tiny Life</h1>
<p>Tiny Life is a fun simulation game that aims to capture the essence of games like The Sims, but in an isometric pixelart style.</p>
<p>In the game, you control a set of people that live together in a household. You take care of their daily needs, build their skills, forge new relationships... or just mess up their entire life in whatever way you can think of!</p>
{% for item in site.data.screenshots %}
<div class="screenshot">
<img src="media/screenshots/{{ item.value }}.png" width="100%" class="screen">
<div class="feature feature-{{ forloop.index0 | modulo: 2 }}">
<p>{{ item.text }}</p>
</div>
</div>
{% endfor %}
</div>

16
web/_includes/devlogs.html Normal file
View file

@ -0,0 +1,16 @@
<div class="section">
<span id="devlogs"></span>
<h1>Devlogs</h1>
<p>Along with every major update, we publish a devlog that features additional information as well as some screenshots. You can read them on itch or on Steam. You can also read <a href="https://docs.tinylifegame.com/Changelog">the full changelog</a>.</p>
<div class="devlogs">
{% for item in site.data.devlogs %}
<div class="devlog">
<h4>{{ item.name }}</h4>
<div class="devlog-buttons">
<a href="{{ item.itch }}">Read on itch</a> &ndash; <a href="{{ item.steam }}">Read on Steam</a>
</div>
</div>
{% endfor %}
</div>
</div>

47
web/_includes/top.html Normal file
View file

@ -0,0 +1,47 @@
<div class="top d-flex justify-content-center align-items-center vh-100">
<div class="top-content">
<image src="media/logo.png" width="100%" height="auto" alt="Tiny Life"></image>
<h4>A fun simulation game where you mess with people's lives</h4>
<div class="container">
<div class="row">
<div class="col site">
<h3>Play the free alpha</h3>
<a href="https://ellpeck.itch.io/tiny-life">
<image src="media/itch.png" alt="itch.io" width="200px" height="auto"></image>
</a>
</div>
<div class="col site">
<h3>Wishlist and play</h3>
<a href="https://store.steampowered.com/app/1651490/Tiny_Life/">
<image src="media/steam.png" alt="Steam" width="200px" height="auto"></image>
</a>
</div>
</div>
<a class="link" href="https://twitter.com/TinyLifeGame">Follow on Twitter</a>
<a class="link" href="https://ellpeck.de/discord">Join the Discord</a>
<a class="link" href="https://docs.tinylifegame.com">See Modding Docs</a>
<a class="link" href="https://press.ellpeck.de/tinylife/">Get Press Kit</a>
</div>
</div>
</div>
<script>
let x = Math.random() * 100;
let y = Math.random() * 100;
let angle = Math.random() * 2 * Math.PI;
let addX = Math.cos(angle) * 0.02;
let addY = Math.sin(angle) * 0.02;
let background = $(".top");
background.css("background-position", `${x}% ${y}%`);
setInterval(function () {
x += addX;
y += addY;
if (x < 0 || x > 100)
addX *= -1;
if (y < 0 || y > 100)
addY *= -1;
background.css("background-position", `${x}% ${y}%`);
}, 30);
</script>

47
web/_layouts/default.html Normal file
View file

@ -0,0 +1,47 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ page.title }}</title>
<meta name="author" content="Ellpeck">
<meta name="description" content="{{ page.summary }}">
<meta name="keywords" content="Ellpeck, Tiny Life, Steam, itch, itch.io, Sandbox, Life Simulator, Simulator, Sim, Isometric, Pixelart, Pixel Art, Retro">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto&display=swap">
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.ico">
<meta property="og:title" content="{{ page.title }}">
<meta property="og:description" content="{{ page.summary }}">
<meta property="og:image" content="https://tinylifegame.com/media/icon.png">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@Ellpeck">
<meta name="twitter:creator" content="@Ellpeck">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-87WTXFSCL7"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-87WTXFSCL7');
</script>
</head>
<body>
{{ content }}
<p class="footer"><a href="https://github.com/Ellpeck/TinyLifeWeb">&copy; 2021 Ellpeck</a> &ndash; <a href="https://ellpeck.de/impressum">Impressum</a> &ndash; <a href="https://ellpeck.de/privacy">Privacy</a></p>
</body>
</html>

81
web/index.html
View file

@ -1,74 +1,9 @@
<!DOCTYPE html>
<html lang="en">
---
layout: default
title: Tiny Life
summary: A fun simulation game where you mess with people's lives
---
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Tiny Life</title>
<meta name="author" content="Ellpeck">
<meta name="description" content="A fun simulation game where you mess with people's lives">
<meta name="keywords" content="Ellpeck, Tiny Life, Steam, itch, itch.io, Sandbox, Life Simulator, Simulator, Sim, Isometric, Pixelart, Pixel Art, Retro">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto&display=swap">
<link rel="stylesheet" href="style.css">
<link rel="icon" href="favicon.ico">
<meta property="og:title" content="Tiny Life">
<meta property="og:description" content="A fun simulation game where you mess with people's lives">
<meta property="og:image" content="https://tinylifegame.com/media/icon.png">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@Ellpeck">
<meta name="twitter:creator" content="@Ellpeck">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-87WTXFSCL7"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-87WTXFSCL7');
</script>
</head>
<body>
<div class="top d-flex justify-content-center align-items-center vh-100">
<div class="main">
<image src="media/logo.png" width="100%" height="auto" alt="Tiny Life"></image>
<h4>A fun simulation game where you mess with people's lives</h4>
<div class="container">
<div class="row">
<div class="col site">
<h3>Play the free alpha</h3>
<a href="https://ellpeck.itch.io/tiny-life">
<image src="media/itch.png" alt="itch.io" width="200px" height="auto"></image>
</a>
</div>
<div class="col site">
<h3>Wishlist and play</h3>
<a href="https://store.steampowered.com/app/1651490/Tiny_Life/">
<image src="media/steam.png" alt="Steam" width="200px" height="auto"></image>
</a>
</div>
</div>
<a class="link" href="https://twitter.com/TinyLifeGame">Follow on Twitter</a>
<a class="link" href="https://ellpeck.de/discord">Join the Discord</a>
<a class="link" href="https://docs.tinylifegame.com">See Modding Docs</a>
<a class="link" href="https://press.ellpeck.de/tinylife/">Get Press Kit</a>
</div>
</div>
</div>
<script src="scroll.js"></script>
<p class="footer"><a href="https://github.com/Ellpeck/TinyLifeWeb">&copy; 2021 Ellpeck</a> &ndash; <a href="https://ellpeck.de/impressum">Impressum</a> &ndash; <a href="https://ellpeck.de/privacy">Privacy</a></p>
</body>
</html>
{% include top.html %}
{% include about.html %}
{% include devlogs.html %}

BIN
web/media/screenshots/CharacterCreator.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 53 KiB

BIN
web/media/screenshots/Gameplay.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 353 KiB

BIN
web/media/screenshots/Lighting.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 385 KiB

BIN
web/media/screenshots/Map.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 459 KiB

BIN
web/media/screenshots/Relationships.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 283 KiB

18
web/scroll.js
View file

@ -1,18 +0,0 @@
let x = Math.random() * 100;
let y = Math.random() * 100;
let angle = Math.random() * 2 * Math.PI;
let addX = Math.cos(angle) * 0.02;
let addY = Math.sin(angle) * 0.02;
let background = $(".top");
background.css("background-position", `${x}% ${y}%`);
setInterval(function () {
x += addX;
y += addY;
if (x < 0 || x > 100)
addX *= -1;
if (y < 0 || y > 100)
addY *= -1;
background.css("background-position", `${x}% ${y}%`);
}, 30);

74
web/style.css
View file

@ -8,20 +8,22 @@
color: lightsteelblue;
}
.footer {
margin-top: 15px;
margin-bottom: 15px;
width: 100%;
text-align: center;
}
.main {
.top-content {
text-align: center;
color: white;
padding-top: 20px;
padding-bottom: 60px;
}
.section {
width: 95%;
max-width: 950px;
margin-top: 50px;
margin-bottom: 50px;
margin-left: auto;
margin-right: auto;
}
.site {
padding-bottom: 20px;
}
@ -38,3 +40,59 @@
display: inline-block;
width: 150px;
}
.screenshot {
position: relative;
margin-top: 40px;
margin-bottom: 40px;
}
.feature {
margin: 10px;
padding: 10px;
max-width: 60%;
color: white;
background: rgb(0, 0, 0, 0.7);
border-radius: 8px;
position: absolute;
top: 0;
}
.feature p {
margin-bottom: 0;
}
.feature-0 {
text-align: left;
left: 0;
}
.feature-1 {
text-align: right;
right: 0;
}
.footer {
margin-top: 15px;
margin-bottom: 15px;
width: 100%;
text-align: center;
}
.devlog {
margin-bottom: 20px;
min-width: 250px;
width: 45%;
display: inline-block;
}
.changelog img {
width: 100%;
}
.changelog blockquote {
margin-left: 2em;
margin-right: 2em;
font-style: italic;
font-size: 18px;
}