summaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorRay <[email protected]>2022-01-19 17:46:33 +0100
committerGitHub <[email protected]>2022-01-19 17:46:33 +0100
commitb72ca61ffabcb5ac2f362aabc98ce642141cfe73 (patch)
treefa7050acd4d4514a4e194227e261a6f30e9dd139
parent319384984f79dc1aefe88c0207f55310db1565fb (diff)
parentd420cf304666e65af21bbe4609db8d2cce1f77e1 (diff)
downloadraylib.com-b72ca61ffabcb5ac2f362aabc98ce642141cfe73.tar.gz
raylib.com-b72ca61ffabcb5ac2f362aabc98ce642141cfe73.zip
Merge pull request #28 from michaelfiber/gamejam-2022-banner
Gamejam 2022 banner
-rw-r--r--common/banner.css91
-rw-r--r--images/gamejam-2022-banner.pngbin0 -> 5476 bytes
-rw-r--r--index.html27
3 files changed, 117 insertions, 1 deletions
diff --git a/common/banner.css b/common/banner.css
new file mode 100644
index 0000000..17d45f1
--- /dev/null
+++ b/common/banner.css
@@ -0,0 +1,91 @@
+.gamejam-2022-banner {
+ background-color: white;
+ padding: 1em;
+ display: flex;
+ justify-content: center;
+ flex-direction: row;
+}
+
+.gamejam-2022-banner * {
+ box-sizing: border-box;
+}
+
+.gamejam-2022-banner .banner-content {
+ width: 835.5px;
+ display: flex;
+ flex-direction: row;
+ align-items: flex-start;
+ justify-content: flex-start;
+}
+
+.gamejam-2022-banner .banner-image {
+ height: 205px;
+ width: auto;
+}
+
+.gamejam-2022-banner .end-cap .big {
+ font-size: 26px;
+}
+
+.gamejam-2022-banner .column {
+ width: 100px;
+ display: flex;
+ flex-direction: column;
+ margin-left: 5px;
+}
+
+.gamejam-2022-banner .block:first-child, .gamejam-2022-banner .color-block:first-child {
+ margin-bottom: 5px;
+}
+
+.gamejam-2022-banner .block, .gamejam-2022-banner .color-block {
+ width: 100px;
+ height: 100px;
+ margin: 0;
+ display: flex;
+ align-items: flex-end;
+ justify-content: flex-end;
+ padding: 5px;
+ flex-direction: column;
+}
+
+.gamejam-2022-banner .block *, .gamejam-2022-banner .color-block * {
+ text-align: right;
+}
+
+.gamejam-2022-banner .block .big, .gamejam-2022-banner .color-block .big {
+ font-size: 300%;
+}
+
+.gamejam-2022-banner .color-block {
+
+ border: 6.25px solid #0e0e0e;
+ background-color: white;
+ font-size: 13px;
+ font-weight: bold;
+}
+
+.gamejam-2022-banner .color-block.red {
+ border-color: #b50000;
+ color: #b50000;
+}
+
+.gamejam-2022-banner .color-block.wasm {
+ border-color: #654ff0;
+ color: #654ff0;
+}
+
+.gamejam-2022-banner .color-block.green {
+ border-color: green;
+ color: green;
+}
+
+.gamejam-2022-banner .color-block.yellow {
+ border-color: rgb(211, 166, 16);
+ color: rgb(211, 166, 16);
+}
+
+.gamejam-2022-banner .color-block.turquoise {
+ border-color: turquoise;
+ color: turquoise;
+} \ No newline at end of file
diff --git a/images/gamejam-2022-banner.png b/images/gamejam-2022-banner.png
new file mode 100644
index 0000000..eba334a
--- /dev/null
+++ b/images/gamejam-2022-banner.png
Binary files differ
diff --git a/index.html b/index.html
index f364e02..53f35d5 100644
--- a/index.html
+++ b/index.html
@@ -25,12 +25,37 @@
<meta name="twitter:description" content="raylib is a simple and easy-to-use library to enjoy videogames programming." />
<meta name="twitter:image" content="https://www.raylib.com/common/img/raylib_logo_card.png" />
<meta name="twitter:url" content="https://www.raylib.com" />
-
+ <link rel="stylesheet" href="common/banner.css">
<link rel="stylesheet" href="common/main.css">
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body>
+ <div class="gamejam-2022-banner">
+ <div class="banner-content">
+ <a href="https://itch.io/jam/raylib-5k-gamejam" target="_blank">
+ <img class="banner-image" src="images/gamejam-2022-banner.png" />
+ </a>
+ <div class="column">
+ <div class="color-block wasm">wasm</div>
+ <div class="color-block turquoise">priZes</div>
+ </div>
+ <div class="column">
+ <div class="color-block green">900px</div>
+ <div class="color-block">
+ <div>JAN</div>
+ <div>21-29</div>
+ </div>
+ </div>
+ <div class="column">
+ <div class="color-block yellow">32MB</div>
+ <a class="color-block red" href="https://itch.io/jam/raylib-5k-gamejam" target="_blank">
+ <div class="big">&rarr;</div>
+ <div>More Info</div>
+ </a>
+ </div>
+ </div>
+ </div>
<div class="page">
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> or <a href="https://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>