new web in cs
@@ -0,0 +1,2 @@
|
||||
.DS_Store
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
|
||||
<div class="not-found">
|
||||
<h1>404</h1>
|
||||
<p>Page not found :(</p>
|
||||
</div>
|
||||
@@ -0,0 +1,27 @@
|
||||
source "https://rubygems.org"
|
||||
|
||||
# Hello! This is where you manage which Jekyll version is used to run.
|
||||
# When you want to use a different version, change it below, save the
|
||||
# file and run `bundle install`. Run Jekyll with `bundle exec`, like so:
|
||||
#
|
||||
# bundle exec jekyll serve
|
||||
#
|
||||
# This will help ensure the proper Jekyll version is running.
|
||||
# Happy Jekylling!
|
||||
# gem "jekyll", "~> 3.6.2"
|
||||
|
||||
# This is the default theme for new Jekyll sites. You may change this to anything you like.
|
||||
gem "minima", "~> 2.0"
|
||||
|
||||
# If you want to use GitHub Pages, remove the "gem "jekyll"" above and
|
||||
# uncomment the line below. To upgrade, run `bundle update github-pages`.
|
||||
gem "github-pages", group: :jekyll_plugins
|
||||
|
||||
# If you have any plugins, put them here!
|
||||
group :jekyll_plugins do
|
||||
gem "jekyll-feed", "~> 0.6"
|
||||
end
|
||||
|
||||
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
|
||||
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
|
||||
|
||||
@@ -0,0 +1,229 @@
|
||||
GEM
|
||||
remote: https://rubygems.org/
|
||||
specs:
|
||||
activesupport (4.2.9)
|
||||
i18n (~> 0.7)
|
||||
minitest (~> 5.1)
|
||||
thread_safe (~> 0.3, >= 0.3.4)
|
||||
tzinfo (~> 1.1)
|
||||
addressable (2.5.2)
|
||||
public_suffix (>= 2.0.2, < 4.0)
|
||||
coffee-script (2.4.1)
|
||||
coffee-script-source
|
||||
execjs
|
||||
coffee-script-source (1.11.1)
|
||||
colorator (1.1.0)
|
||||
concurrent-ruby (1.0.5)
|
||||
ethon (0.11.0)
|
||||
ffi (>= 1.3.0)
|
||||
execjs (2.7.0)
|
||||
faraday (0.13.1)
|
||||
multipart-post (>= 1.2, < 3)
|
||||
ffi (1.9.18)
|
||||
forwardable-extended (2.6.0)
|
||||
gemoji (3.0.0)
|
||||
github-pages (171)
|
||||
activesupport (= 4.2.9)
|
||||
github-pages-health-check (= 1.3.5)
|
||||
jekyll (= 3.6.2)
|
||||
jekyll-avatar (= 0.5.0)
|
||||
jekyll-coffeescript (= 1.0.2)
|
||||
jekyll-default-layout (= 0.1.4)
|
||||
jekyll-feed (= 0.9.2)
|
||||
jekyll-gist (= 1.4.1)
|
||||
jekyll-github-metadata (= 2.9.3)
|
||||
jekyll-mentions (= 1.2.0)
|
||||
jekyll-optional-front-matter (= 0.3.0)
|
||||
jekyll-paginate (= 1.1.0)
|
||||
jekyll-readme-index (= 0.2.0)
|
||||
jekyll-redirect-from (= 0.12.1)
|
||||
jekyll-relative-links (= 0.5.2)
|
||||
jekyll-remote-theme (= 0.2.3)
|
||||
jekyll-sass-converter (= 1.5.0)
|
||||
jekyll-seo-tag (= 2.3.0)
|
||||
jekyll-sitemap (= 1.1.1)
|
||||
jekyll-swiss (= 0.4.0)
|
||||
jekyll-theme-architect (= 0.1.0)
|
||||
jekyll-theme-cayman (= 0.1.0)
|
||||
jekyll-theme-dinky (= 0.1.0)
|
||||
jekyll-theme-hacker (= 0.1.0)
|
||||
jekyll-theme-leap-day (= 0.1.0)
|
||||
jekyll-theme-merlot (= 0.1.0)
|
||||
jekyll-theme-midnight (= 0.1.0)
|
||||
jekyll-theme-minimal (= 0.1.0)
|
||||
jekyll-theme-modernist (= 0.1.0)
|
||||
jekyll-theme-primer (= 0.5.2)
|
||||
jekyll-theme-slate (= 0.1.0)
|
||||
jekyll-theme-tactile (= 0.1.0)
|
||||
jekyll-theme-time-machine (= 0.1.0)
|
||||
jekyll-titles-from-headings (= 0.5.0)
|
||||
jemoji (= 0.8.1)
|
||||
kramdown (= 1.14.0)
|
||||
liquid (= 4.0.0)
|
||||
listen (= 3.0.6)
|
||||
mercenary (~> 0.3)
|
||||
minima (= 2.1.1)
|
||||
rouge (= 2.2.1)
|
||||
terminal-table (~> 1.4)
|
||||
github-pages-health-check (1.3.5)
|
||||
addressable (~> 2.3)
|
||||
net-dns (~> 0.8)
|
||||
octokit (~> 4.0)
|
||||
public_suffix (~> 2.0)
|
||||
typhoeus (~> 0.7)
|
||||
html-pipeline (2.7.1)
|
||||
activesupport (>= 2)
|
||||
nokogiri (>= 1.4)
|
||||
i18n (0.9.1)
|
||||
concurrent-ruby (~> 1.0)
|
||||
jekyll (3.6.2)
|
||||
addressable (~> 2.4)
|
||||
colorator (~> 1.0)
|
||||
jekyll-sass-converter (~> 1.0)
|
||||
jekyll-watch (~> 1.1)
|
||||
kramdown (~> 1.14)
|
||||
liquid (~> 4.0)
|
||||
mercenary (~> 0.3.3)
|
||||
pathutil (~> 0.9)
|
||||
rouge (>= 1.7, < 3)
|
||||
safe_yaml (~> 1.0)
|
||||
jekyll-avatar (0.5.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-coffeescript (1.0.2)
|
||||
coffee-script (~> 2.2)
|
||||
coffee-script-source (~> 1.11.1)
|
||||
jekyll-default-layout (0.1.4)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-feed (0.9.2)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-gist (1.4.1)
|
||||
octokit (~> 4.2)
|
||||
jekyll-github-metadata (2.9.3)
|
||||
jekyll (~> 3.1)
|
||||
octokit (~> 4.0, != 4.4.0)
|
||||
jekyll-mentions (1.2.0)
|
||||
activesupport (~> 4.0)
|
||||
html-pipeline (~> 2.3)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-optional-front-matter (0.3.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-paginate (1.1.0)
|
||||
jekyll-readme-index (0.2.0)
|
||||
jekyll (~> 3.0)
|
||||
jekyll-redirect-from (0.12.1)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-relative-links (0.5.2)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-remote-theme (0.2.3)
|
||||
jekyll (~> 3.5)
|
||||
rubyzip (>= 1.2.1, < 3.0)
|
||||
typhoeus (>= 0.7, < 2.0)
|
||||
jekyll-sass-converter (1.5.0)
|
||||
sass (~> 3.4)
|
||||
jekyll-seo-tag (2.3.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-sitemap (1.1.1)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-swiss (0.4.0)
|
||||
jekyll-theme-architect (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-cayman (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-dinky (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-hacker (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-leap-day (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-merlot (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-midnight (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-minimal (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-modernist (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-primer (0.5.2)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-github-metadata (~> 2.9)
|
||||
jekyll-seo-tag (~> 2.2)
|
||||
jekyll-theme-slate (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-tactile (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-theme-time-machine (0.1.0)
|
||||
jekyll (~> 3.5)
|
||||
jekyll-seo-tag (~> 2.0)
|
||||
jekyll-titles-from-headings (0.5.0)
|
||||
jekyll (~> 3.3)
|
||||
jekyll-watch (1.5.0)
|
||||
listen (~> 3.0, < 3.1)
|
||||
jemoji (0.8.1)
|
||||
activesupport (~> 4.0, >= 4.2.9)
|
||||
gemoji (~> 3.0)
|
||||
html-pipeline (~> 2.2)
|
||||
jekyll (>= 3.0)
|
||||
kramdown (1.14.0)
|
||||
liquid (4.0.0)
|
||||
listen (3.0.6)
|
||||
rb-fsevent (>= 0.9.3)
|
||||
rb-inotify (>= 0.9.7)
|
||||
mercenary (0.3.6)
|
||||
mini_portile2 (2.3.0)
|
||||
minima (2.1.1)
|
||||
jekyll (~> 3.3)
|
||||
minitest (5.10.3)
|
||||
multipart-post (2.0.0)
|
||||
net-dns (0.8.0)
|
||||
nokogiri (1.8.1)
|
||||
mini_portile2 (~> 2.3.0)
|
||||
octokit (4.7.0)
|
||||
sawyer (~> 0.8.0, >= 0.5.3)
|
||||
pathutil (0.16.0)
|
||||
forwardable-extended (~> 2.6)
|
||||
public_suffix (2.0.5)
|
||||
rb-fsevent (0.10.2)
|
||||
rb-inotify (0.9.10)
|
||||
ffi (>= 0.5.0, < 2)
|
||||
rouge (2.2.1)
|
||||
rubyzip (1.2.1)
|
||||
safe_yaml (1.0.4)
|
||||
sass (3.5.3)
|
||||
sass-listen (~> 4.0.0)
|
||||
sass-listen (4.0.0)
|
||||
rb-fsevent (~> 0.9, >= 0.9.4)
|
||||
rb-inotify (~> 0.9, >= 0.9.7)
|
||||
sawyer (0.8.1)
|
||||
addressable (>= 2.3.5, < 2.6)
|
||||
faraday (~> 0.8, < 1.0)
|
||||
terminal-table (1.8.0)
|
||||
unicode-display_width (~> 1.1, >= 1.1.1)
|
||||
thread_safe (0.3.6)
|
||||
typhoeus (0.8.0)
|
||||
ethon (>= 0.8.0)
|
||||
tzinfo (1.2.4)
|
||||
thread_safe (~> 0.1)
|
||||
unicode-display_width (1.3.0)
|
||||
|
||||
PLATFORMS
|
||||
ruby
|
||||
|
||||
DEPENDENCIES
|
||||
github-pages
|
||||
jekyll-feed (~> 0.6)
|
||||
minima (~> 2.0)
|
||||
tzinfo-data
|
||||
|
||||
BUNDLED WITH
|
||||
1.16.0
|
||||
@@ -0,0 +1,45 @@
|
||||
# Welcome to Jekyll!
|
||||
#
|
||||
# This config file is meant for settings that affect your whole blog, values
|
||||
# which you are expected to set up once and rarely edit after that. If you find
|
||||
# yourself editing this file very often, consider using Jekyll's data files
|
||||
# feature for the data you need to update frequently.
|
||||
#
|
||||
# For technical reasons, this file is *NOT* reloaded automatically when you use
|
||||
# 'bundle exec jekyll serve'. If you change this file, please restart the server process.
|
||||
|
||||
# Site settings
|
||||
# These are used to personalize your new site. If you look in the HTML files,
|
||||
# you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
|
||||
# You can create any custom variable you would like, and they will be accessible
|
||||
# in the templates via {{ site.myvariable }}.
|
||||
title: Qniverse
|
||||
email: joseph.schwarz@ibm.com
|
||||
description: >- # this means to ignore newlines until "baseurl:"
|
||||
The World’s First Open Source Quantum Board Game.
|
||||
Master New Galaxies in Your Quest to Construct a Quantum Computer!
|
||||
baseurl: "" # the subpath of your site, e.g. /blog
|
||||
url: "" # the base hostname & protocol for your site, e.g. http://example.com
|
||||
twitter_username: jekyllrb
|
||||
github_username: jekyll
|
||||
|
||||
# Build settings
|
||||
markdown: kramdown
|
||||
|
||||
sass:
|
||||
style: compressed
|
||||
|
||||
plugins:
|
||||
- jekyll-seo-tag
|
||||
|
||||
# Exclude from processing.
|
||||
# The following items will not be processed, by default. Create a custom list
|
||||
# to override the default setting.
|
||||
# exclude:
|
||||
# - Gemfile
|
||||
# - Gemfile.lock
|
||||
# - node_modules
|
||||
# - vendor/bundle/
|
||||
# - vendor/cache/
|
||||
# - vendor/gems/
|
||||
# - vendor/ruby/
|
||||
@@ -0,0 +1,3 @@
|
||||
<footer>
|
||||
IBM <span>Research</span>
|
||||
</footer>
|
||||
@@ -0,0 +1,3 @@
|
||||
<header>
|
||||
Want your own copy of Entanglion? <a href="http://github.com/Entanglion/entanglion">Visit Github</a> to build your own!
|
||||
</header>
|
||||
@@ -0,0 +1,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<!-- stylesheets -->
|
||||
<link rel="stylesheet" href="{{ '/assets/main.css' | relative_url }}">
|
||||
</head>
|
||||
@@ -0,0 +1,8 @@
|
||||
<!-- Global site tag (gtag.js) - Google Analytics -->
|
||||
<script async src=“https://www.googletagmanager.com/gtag/js?id=UA-77195460-2“></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
function gtag(){dataLayer.push(arguments);}
|
||||
gtag('js', new Date());
|
||||
gtag('config', 'UA-77195460-2');
|
||||
</script>
|
||||
@@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ page.lang | default: site.lang | default: en }}">
|
||||
<!-- head -->
|
||||
{% include html-head.html %}
|
||||
<body>
|
||||
<!-- header -->
|
||||
{% include header.html %}
|
||||
|
||||
<!-- main content -->
|
||||
<main class="container" role="main">
|
||||
{{ content }}
|
||||
</main>
|
||||
|
||||
<!-- footer -->
|
||||
{% include footer.html %}
|
||||
|
||||
<!-- scripts -->
|
||||
{% include scripts.html %}
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,70 @@
|
||||
---
|
||||
layout: default
|
||||
---
|
||||
<section id="1">
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<img src={{ '/assets/images/logo.png' | relative_url }} />
|
||||
<div class="description">
|
||||
<h3>The World’s First Open Source Quantum Board Game. Master New Galaxies in Your Quest to Construct a Quantum Computer!</h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img src={{ '/assets/images/game-box.png' | relative_url }} />
|
||||
</div>
|
||||
<div class="stats">
|
||||
<div class="stat">
|
||||
<img src={{ '/assets/images/icons/2-players.png' | relative_url }} />
|
||||
<p>2 Players</p>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<img src={{ '/assets/images/icons/user.png' | relative_url }} />
|
||||
<p>Ages 14+</p>
|
||||
</div>
|
||||
<div class="stat">
|
||||
<img src={{ '/assets/images/icons/timer.png' | relative_url }} />
|
||||
<p>~45 Minutes</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="2">
|
||||
<div class="content">
|
||||
<div class="right">
|
||||
<h1>Welcome to the Quantum Universe, Captain!</h1>
|
||||
<p>Congratulations, your captain has retired and left you in charge of his galactic shipping business! Now it’s time to make some upgrades as you embark on a journey to reconstruct a quantum computer developed by an ancient race.</p>
|
||||
<p>Entanglion is a cooperative board game designed for two players. Learn about quantum computing as you work together with your teammate to navigate the three galaxies of the quantum universe, avoid detection by the defense mechanisms left behind by the ancients, and rebuild the quantum computer.</p>
|
||||
<p>Think you’re up for the challenge?</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="3">
|
||||
<div class="content">
|
||||
<div class="left">
|
||||
<h1>Build Your Own Quantum Universe</h1>
|
||||
<p>Visit <a href="https://github.com/Entanglion/entanglion">GitHub</a> to download the design files and print your own copy of Entanglion, or purchase a boxed copy at <a href="https://www.thegamecrafter.com/games/entanglion1">The Game Crafter</a>.</p>
|
||||
<p>If you are an educator looking to use Entanglion as a classroom activity, please <a href="mailto:entanglion@us.ibm.com">contact us</a>.</p>
|
||||
</div>
|
||||
<div class="right">
|
||||
<img src={{ '/assets/images/game-board.png' | relative_url }} />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="4">
|
||||
<div class="content">
|
||||
<h1>About Entanglion</h1>
|
||||
<div class="left">
|
||||
<p>Entanglion was designed at <a href="http://www.research.ibm.com"> IBM Research</a> to expose players to several fundamental concepts in quantum computing, including qubits, superposition, entanglement, measurement, and error. Entanglion also exposes players to the different kinds of hardware and software components involved in building a real quantum computer.</p>
|
||||
</div>
|
||||
<div class="right">
|
||||
<h3>Credits</h3>
|
||||
<p>Game Design: <a href="https://twitter.com/MaryamAshoori">Maryam Ashoori</a> & <a href="https://github.com/jweisz">Justin D. Weisz</a></p>
|
||||
<p>Illustration: <a href="https://twitter.com/aarrccooxx">Aaron Cox</a>, <a href="https://www.linkedin.com/in/michaelleekenney/">Michael L. Kenney</a></p>
|
||||
<p>Quantum Science: <a href="https://github.com/jaygambetta">Jay M. Gambetta</a>, <a href="https://github.com/jerrymchow">Jerry M. Chow</a>, <a href="https://github.com/levbishop">Lev S. Bishop</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -0,0 +1,59 @@
|
||||
main {
|
||||
padding: 0 20px;
|
||||
min-height: calc(100vh - 98px);
|
||||
background-color: #131821;
|
||||
color: white;
|
||||
font-family: 'IBMPlexSansExtraLight';
|
||||
|
||||
section {
|
||||
margin: auto -20px;
|
||||
padding: 0 30px;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
.content {
|
||||
padding: 30px;
|
||||
border-bottom: 1px solid #3A3655;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
|
||||
.left {
|
||||
padding-right: 30px;
|
||||
}
|
||||
.right {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
& > div {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:first-of-type) {
|
||||
@media screen and (max-width: $ipad) {
|
||||
.content {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile) {
|
||||
.content {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@import 'section1';
|
||||
@import 'section2';
|
||||
@import 'section3';
|
||||
@import 'section4';
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,96 @@
|
||||
&[id="1"] {
|
||||
background-image: url($baseurl + '/assets/images/bg1.png');
|
||||
|
||||
.left {
|
||||
flex: 1;
|
||||
padding-top: 100px;
|
||||
|
||||
img {
|
||||
max-width: 900px;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin: 50px 0 90px 0;
|
||||
width: 70%;
|
||||
|
||||
h3 {
|
||||
font-size: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
max-width: 386px;
|
||||
max-height: 448px;
|
||||
}
|
||||
}
|
||||
|
||||
.stats {
|
||||
display: flex;
|
||||
flex: 100%;
|
||||
padding-bottom: 60px;
|
||||
|
||||
.stat {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
padding-right: 25px;
|
||||
align-items: center;
|
||||
|
||||
&:last-of-type {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #7DD3F1;
|
||||
font-size: 16px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad-horizontal) {
|
||||
.left {
|
||||
.description {
|
||||
width: 100%;
|
||||
h3 {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.stats .stat img {
|
||||
width: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad) {
|
||||
.left {
|
||||
flex: 100%;
|
||||
order: 2;
|
||||
text-align: center;
|
||||
padding-right: 0;
|
||||
padding-top: 70px;
|
||||
}
|
||||
.right {
|
||||
flex: 100%;
|
||||
order: 1;
|
||||
padding-left: 0;
|
||||
}
|
||||
.stats {
|
||||
order: 3;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,57 @@
|
||||
&[id="2"] {
|
||||
background-image: url($baseurl + '/assets/images/bg2.png');
|
||||
background-position-y: bottom;
|
||||
background-position-x: -30px;
|
||||
background-size: 1462px;
|
||||
|
||||
.content {
|
||||
min-height: 500px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.right {
|
||||
padding: 0;
|
||||
width: 40%;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad-horizontal) {
|
||||
background-position-x: -100px;
|
||||
background-size: 1100px;
|
||||
|
||||
.right {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad) {
|
||||
background-image: url($baseurl + '/assets/images/bg2-reverse.png');
|
||||
background-position: right -100px bottom;
|
||||
background-size: 900px;
|
||||
|
||||
.content {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.right {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile) {
|
||||
background-image: url($baseurl + '/assets/images/bg2-reverse.png');
|
||||
background-position: right -80px bottom;
|
||||
background-size: 700px;
|
||||
|
||||
.content {
|
||||
justify-content: flex-start;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
|
||||
.right {
|
||||
width: 100%;
|
||||
padding-bottom: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,71 @@
|
||||
&[id="3"] {
|
||||
background-image: url($baseurl + '/assets/images/bg3.png');
|
||||
.content {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.left {
|
||||
flex: 3;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.right {
|
||||
padding-left: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex: 5;
|
||||
img {
|
||||
max-width: 736px;
|
||||
max-height: 703px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad-horizontal) {
|
||||
.left {
|
||||
flex: 4;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 6;
|
||||
img {
|
||||
max-width: 428px;
|
||||
max-height: 409px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad) {
|
||||
.left {
|
||||
flex: 100%;
|
||||
* {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 100%;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $mobile) {
|
||||
.left {
|
||||
flex: 100%;
|
||||
* {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 100%;
|
||||
justify-content: center;
|
||||
img {
|
||||
max-width: 380px;
|
||||
max-height: 362px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
&[id="4"] {
|
||||
|
||||
& > .content > h1 {
|
||||
flex: 100%;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding-top: 30px;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
|
||||
.left {
|
||||
flex: 3;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 5;
|
||||
|
||||
h3 {
|
||||
font-family: 'IBMPlexSansRegular';
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: $ipad) {
|
||||
.left {
|
||||
flex: 100%;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 100%;
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 460px) {
|
||||
.right {
|
||||
p {
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
@font-face {
|
||||
font-family: 'IBMPlexMonoRegular';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexMono/IBMPlexMono-Regular-Latin1.woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'IBMPlexSansRegular';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexSans/IBMPlexSans-Regular-V01.1.woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'IBMPlexSansMedium';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexSans/IBMPlexSans-Medium-V01.1.woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'IBMPlexSansLight';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexSans/IBMPlexSans-Light-V01.1.woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'IBMPlexSansExtraLight';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexSans/IBMPlexSans-ExtraLight-V01.1.woff");
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'IBMPlexSansSemiBold';
|
||||
src: url($baseurl + "/assets/fonts/IBMPlexSans/IBMPlexSans-SemiBold-V01.1.woff");
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
$ipad-horizontal: 1024px;
|
||||
$ipad: 768px;
|
||||
$mobile: 550px;
|
||||
|
||||
@import 'mixins/mixins';
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: #061689;
|
||||
color: white;
|
||||
padding: 15px;
|
||||
text-align: center;
|
||||
font-family: 'IBMPlexMonoRegular';
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #80D3EF;
|
||||
padding: 15px;
|
||||
text-align: right;
|
||||
font-family: 'IBMPlexSansRegular';
|
||||
|
||||
span {
|
||||
font-family: 'IBMPlexSansSemiBold';
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: #4DAAFA;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
h2, h3, h4, h5, h6 {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'IBMPlexSansRegular';
|
||||
font-size: 40px;
|
||||
|
||||
@media screen and (max-width: $ipad-horizontal) {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
p, h3 {
|
||||
font-size: 20px;
|
||||
|
||||
@media screen and (max-width: $ipad-horizontal) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.not-found {
|
||||
display: flex;
|
||||
flex-flow: column wrap;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding-top: 50px;
|
||||
}
|
||||
|
||||
@import 'layout/_home.scss';
|
||||
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 966 KiB |
|
After Width: | Height: | Size: 278 KiB |
|
After Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 376 KiB |
|
After Width: | Height: | Size: 1.1 MiB |
|
After Width: | Height: | Size: 3.1 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 60 KiB |
@@ -0,0 +1,4 @@
|
||||
---
|
||||
---
|
||||
$baseurl: "{{ site.baseurl }}";
|
||||
@import "theme";
|
||||
@@ -0,0 +1,6 @@
|
||||
---
|
||||
# You don't need to edit this file, it's empty on purpose.
|
||||
# Edit theme's home layout instead if you wanna make some changes
|
||||
# See: https://jekyllrb.com/docs/themes/#overriding-theme-defaults
|
||||
layout: home
|
||||
---
|
||||