From 098efd194368f4548fa7f0592b47e05b5965a8b6 Mon Sep 17 00:00:00 2001
From: Pierre Jarriges <pierre.jarriges@tutanota.com>
Date: Wed, 3 Nov 2021 12:35:07 +0100
Subject: [PATCH] design game banner
---
.../games/fantom_quest/fantom_quest.txt | 3 +-
public/robots.txt | 3 +-
public/sitemap.xml | 10 +-
public/style/style.css | 4 +-
src/pages/games/games.scss | 284 +++++++++---------
5 files changed, 155 insertions(+), 149 deletions(-)
diff --git a/public/articles/games/fantom_quest/fantom_quest.txt b/public/articles/games/fantom_quest/fantom_quest.txt
index f68e4b8..a65a64c 100755
--- a/public/articles/games/fantom_quest/fantom_quest.txt
+++ b/public/articles/games/fantom_quest/fantom_quest.txt
@@ -1,7 +1,8 @@
Un petit fantôme en quête d'identité va devoir gravir chaque étage d'un donjon afin de rencontrer la sorcière qui lui révélera sa vraie nature.
Ce petit jeu de quête minimaliste en forme de labyrinthe sera jouable directement sur navigateur ou à télécharger sur pc.
-Sortie prévue : Mars 2021 (si on y arrive !)
+<s>Sortie prévue : Mars 2021 (si on y arrive !)</s>
+Ça arrive, ça arrive.
- Concept original et graphismes : Lucie Ventadour
diff --git a/public/robots.txt b/public/robots.txt
index bef4861..48511e4 100644
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -1,3 +1,4 @@
User-agent: *
Disallow: /articles/
-Disallow: /style/
\ No newline at end of file
+Disallow: /style/
+Sitemap: https://kuadrado-software.fr/sitemap.xml
\ No newline at end of file
diff --git a/public/sitemap.xml b/public/sitemap.xml
index b33203f..038e49c 100644
--- a/public/sitemap.xml
+++ b/public/sitemap.xml
@@ -2,18 +2,18 @@
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://kuadrado-software.fr</loc>
- <lastmod>2021-02-21</lastmod>
+ <lastmod>2021-11-21</lastmod>
</url>
<url>
<loc>https://kuadrado-software.fr/games/</loc>
- <lastmod>2021-05-25</lastmod>
+ <lastmod>2021-11-21</lastmod>
</url>
<url>
<loc>https://kuadrado-software.fr/education/</loc>
- <lastmod>2021-05-25</lastmod>
+ <lastmod>2021-11-21</lastmod>
</url>
- <url>
+ <url>
<loc>https://kuadrado-software.fr/software-development/</loc>
- <lastmod>2021-02-21</lastmod>
+ <lastmod>2021-11-21</lastmod>
</url>
</urlset>
\ No newline at end of file
diff --git a/public/style/style.css b/public/style/style.css
index 26da894..0a9f9e4 100644
--- a/public/style/style.css
+++ b/public/style/style.css
@@ -983,9 +983,10 @@ main #page-container #games-page .game-articles article.game-article .game-banne
flex-direction: column;
background-color: black;
overflow: hidden;
+ height: 300px;
}
main #page-container #games-page .game-articles article.game-article .game-banner img {
- height: 500px;
+ width: 100%;
}
main #page-container #games-page .game-articles article.game-article .game-tags {
display: flex;
@@ -1079,6 +1080,7 @@ main #page-container #games-page .game-articles article.placeholder * {
main #page-container #games-page .game-articles article.game-article .game-banner {
grid-column: 1;
margin: 0 -20px;
+ height: 200px;
}
main #page-container #games-page .game-articles article.game-article .image-carousel {
grid-column: 1;
diff --git a/src/pages/games/games.scss b/src/pages/games/games.scss
index f6e1f14..cdabdcc 100644
--- a/src/pages/games/games.scss
+++ b/src/pages/games/games.scss
@@ -1,149 +1,151 @@
#games-page {
- .game-articles {
- article {
- display: grid;
- grid-template-columns: 0.7fr 1fr;
- gap: 30px 50px;
- margin: 20px 0;
- &.game-article {
- grid-template-rows: repeat(7, auto);
- width: 100%;
- .game-title {
- grid-column: 1 / span 2;
- margin: 0;
- padding: 30px 20px;
- color: $light_2;
- font-size: 35px;
- font-style: italic;
- }
+ .game-articles {
+ article {
+ display: grid;
+ grid-template-columns: 0.7fr 1fr;
+ gap: 30px 50px;
+ margin: 20px 0;
+ &.game-article {
+ grid-template-rows: repeat(7, auto);
+ width: 100%;
+ .game-title {
+ grid-column: 1 / span 2;
+ margin: 0;
+ padding: 30px 20px;
+ color: $light_2;
+ font-size: 35px;
+ font-style: italic;
+ }
- .game-banner {
- grid-column: 1 / span 2;
- @include flex-center-col;
- background-color: black;
- overflow: hidden;
- img {
- height: 500px;
- }
- }
+ .game-banner {
+ grid-column: 1 / span 2;
+ @include flex-center-col;
+ background-color: black;
+ overflow: hidden;
+ height: 300px;
+ img {
+ width: 100%;
+ }
+ }
- .game-tags {
- display: flex;
- gap: 10px;
- flex-wrap: wrap;
- margin: 10px 20px;
- span {
- font-size: 12px;
- padding: 4px;
- background-color: $light_0;
- color: $medium_grey;
- border-radius: 5px;
- font-weight: 600;
- }
- }
+ .game-tags {
+ display: flex;
+ gap: 10px;
+ flex-wrap: wrap;
+ margin: 10px 20px;
+ span {
+ font-size: 12px;
+ padding: 4px;
+ background-color: $light_0;
+ color: $medium_grey;
+ border-radius: 5px;
+ font-weight: 600;
+ }
+ }
- .game-subtitle {
- grid-column: 1;
- margin: 10px 20px;
- color: $medium_grey;
- }
- .game-description {
- grid-column: 1;
- text-align: justify;
- margin: 10px 20px 30px;
- }
+ .game-subtitle {
+ grid-column: 1;
+ margin: 10px 20px;
+ color: $medium_grey;
+ }
+ .game-description {
+ grid-column: 1;
+ text-align: justify;
+ margin: 10px 20px 30px;
+ }
- .image-carousel {
- grid-column: 2;
- grid-row: 3 / span 4;
- height: 100%;
- }
- .game-team {
- grid-column: 1 / span 2;
- h2 {
- color: $medium_grey;
- padding: 10px 20px;
- font-style: italic;
- font-size: 20px;
- margin: 0;
- }
- .team-members {
- display: flex;
- flex-direction: column;
- .team-member {
- display: grid;
- grid-template-columns: 80px 1fr;
- grid-template-rows: auto auto 1fr;
- margin: 10px;
- .team-member-img {
- grid-row: 1 / span 3;
- overflow: hidden;
- img {
- width: 100%;
- padding: 0 10px 0 0;
- }
- }
- .team-member-title {
- margin: 0 0 5px;
- color: $medium_grey;
- }
- .team-member-subtitle {
- margin: 0 10px;
- font-size: 14px;
- color: $light_1;
- font-style: italic;
- }
- .team-member-body {
- margin: 10px 10px 20px 20px;
- text-align: justify;
- }
- }
- }
- }
- }
- &.placeholder {
- * {
- background-color: $light_0;
- }
- height: 400px;
- }
- @media screen and (max-width: $screen_l) {
- grid-template-columns: 1fr;
- &.game-article {
- grid-template-rows: repeat(6, auto);
- .game-title {
- grid-column: 1;
- padding: 0;
- font-size: 25px;
- }
+ .image-carousel {
+ grid-column: 2;
+ grid-row: 3 / span 4;
+ height: 100%;
+ }
+ .game-team {
+ grid-column: 1 / span 2;
+ h2 {
+ color: $medium_grey;
+ padding: 10px 20px;
+ font-style: italic;
+ font-size: 20px;
+ margin: 0;
+ }
+ .team-members {
+ display: flex;
+ flex-direction: column;
+ .team-member {
+ display: grid;
+ grid-template-columns: 80px 1fr;
+ grid-template-rows: auto auto 1fr;
+ margin: 10px;
+ .team-member-img {
+ grid-row: 1 / span 3;
+ overflow: hidden;
+ img {
+ width: 100%;
+ padding: 0 10px 0 0;
+ }
+ }
+ .team-member-title {
+ margin: 0 0 5px;
+ color: $medium_grey;
+ }
+ .team-member-subtitle {
+ margin: 0 10px;
+ font-size: 14px;
+ color: $light_1;
+ font-style: italic;
+ }
+ .team-member-body {
+ margin: 10px 10px 20px 20px;
+ text-align: justify;
+ }
+ }
+ }
+ }
+ }
+ &.placeholder {
+ * {
+ background-color: $light_0;
+ }
+ height: 400px;
+ }
+ @media screen and (max-width: $screen_l) {
+ grid-template-columns: 1fr;
+ &.game-article {
+ grid-template-rows: repeat(6, auto);
+ .game-title {
+ grid-column: 1;
+ padding: 0;
+ font-size: 25px;
+ }
- .game-banner {
- grid-column: 1;
- margin: 0 -20px;
- }
+ .game-banner {
+ grid-column: 1;
+ margin: 0 -20px;
+ height: 200px;
+ }
- .image-carousel {
- grid-column: 1;
- grid-row: 3;
- height: 400px;
- margin: 0 -20px;
- }
- .game-team {
- grid-column: 1;
- .team-members {
- .team-member {
- grid-template-columns: 70px 1fr;
- .team-member-img {
- grid-row: 1 / span 2;
- }
- .team-member-body {
- grid-column: 1 / span 2;
- }
- }
- }
- }
- }
- }
- }
- }
+ .image-carousel {
+ grid-column: 1;
+ grid-row: 3;
+ height: 400px;
+ margin: 0 -20px;
+ }
+ .game-team {
+ grid-column: 1;
+ .team-members {
+ .team-member {
+ grid-template-columns: 70px 1fr;
+ .team-member-img {
+ grid-row: 1 / span 2;
+ }
+ .team-member-body {
+ grid-column: 1 / span 2;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
}
--
GitLab