From 5e72008fe9859e93828f9a32a70c527ee920e406 Mon Sep 17 00:00:00 2001 From: EyeDaleHim <71162374+EyeDaleHim@users.noreply.github.com> Date: Wed, 27 Mar 2024 09:07:26 +0800 Subject: [PATCH] Game Showcase Section + Additional Fixes (#257) * game showcase section + additional fixes * prettier fixes --------- Co-authored-by: Cameron --- content/_layouts/demos-layout.liquid | 26 +-- content/_layouts/documentation-layout.liquid | 25 +-- content/_layouts/partials/footer.liquid | 19 +-- content/_layouts/showcase.liquid | 19 ++- content/_scss/sections/home.scss | 24 +-- content/demos.liquid | 1 - content/index.liquid | 170 ++++++++++--------- 7 files changed, 150 insertions(+), 134 deletions(-) diff --git a/content/_layouts/demos-layout.liquid b/content/_layouts/demos-layout.liquid index e1ad2e5e5..6dba5c741 100644 --- a/content/_layouts/demos-layout.liquid +++ b/content/_layouts/demos-layout.liquid @@ -1,17 +1,19 @@ --- layout: default.liquid --- -

{{ title }} - -

+

+ {{ title }} + +

{{ content }} diff --git a/content/_layouts/documentation-layout.liquid b/content/_layouts/documentation-layout.liquid index 1ae169c19..f1b3db0f7 100644 --- a/content/_layouts/documentation-layout.liquid +++ b/content/_layouts/documentation-layout.liquid @@ -1,21 +1,22 @@ --- layout: default --- -

{{ title }} +

+ {{ title }} - +

-

The HaxeFlixel documentation is provided from the flixel-docs repository and is open for diff --git a/content/_layouts/partials/footer.liquid b/content/_layouts/partials/footer.liquid index abf2e0d30..ba73609d9 100644 --- a/content/_layouts/partials/footer.liquid +++ b/content/_layouts/partials/footer.liquid @@ -6,27 +6,29 @@

@@ -45,7 +47,6 @@
  • API
  • - - - {{ content }} diff --git a/content/_scss/sections/home.scss b/content/_scss/sections/home.scss index dfd24b6af..387163f29 100644 --- a/content/_scss/sections/home.scss +++ b/content/_scss/sections/home.scss @@ -15,6 +15,7 @@ font-size: 30px; font-weight: 200; padding-bottom: 30px; + padding-top: 10px; } .lead-line-large { @@ -80,10 +81,20 @@ box-shadow: var(--bs-box-shadow); } +.games-home .showcase-list { + display: flex; + flex-wrap: wrap; + justify-content: space-evenly; +} + +.games-home a { + margin: 0.5em; + gap: 0.25em; +} + .platform-logos-home img { padding: 10px; @include opacityAll(0.7); - @include hover-scale-fx(1.1); @include grayscale(); } @@ -94,16 +105,6 @@ $color-mode-type: data; @include opacityAll(1); filter: invert(0.7); } - - .platform-logos-home img:hover { - @include opacityAll(1); - filter: invert(0.9); - } -} - -.platform-logos-home img:hover { - @include opacityAll(1); - @include nograyscale(); } .platform-demos-home img { @@ -117,6 +118,7 @@ $color-mode-type: data; .home-big-logo img { @include hover-scale-fx(1.1); + padding-bottom: 15px; } .navbar-fixed-top { diff --git a/content/demos.liquid b/content/demos.liquid index 4e475f2e6..c6fc061b0 100644 --- a/content/demos.liquid +++ b/content/demos.liquid @@ -4,7 +4,6 @@ layout: "demos-layout" ---
    {% for demo in collections['demo-item'] %} - diff --git a/content/index.liquid b/content/index.liquid index 9329ae4f0..49d5c1b17 100644 --- a/content/index.liquid +++ b/content/index.liquid @@ -21,20 +21,22 @@ title: 'Home' All with one codebase.

    -
    + @@ -127,7 +129,7 @@ title: 'Home' {{ collections['demo-item'].length }} demos:

    - + {% for demo in collections.homepage_demo %} {% capture imgURL %}content/_static/images/demos/{{ demo.data.title }}.png{% endcapture %} @@ -140,92 +142,102 @@ title: 'Home'
    -
    -

    Powered by open source cross-platform tech:

    - -
    -
    - Haxe Logo - - + - - OpenFL Logo - - - + - - - Flixel Logo - - - = - - - - HaxeFlixel logo - +
    +

    +

    These popular games use HaxeFlixel:

    +

    +
    + {% for showcase in collections['showcase-item'] reversed %} + {% if showcase.data.featured %} + + {% capture imgURL %}content/_static/images/showcase/{{showcase.fileSlug}}.png{% endcapture %} + {% liquid + image imgURL, showcase.data.title, 250, 130 + %} + + {% endif %} + {% endfor %}
    - - +
    - +
    +

    Powered by open source cross-platform tech:

    - +
    +
    + Haxe Logo + + + + + OpenFL Logo + + + + + + + Flixel Logo + + + = + + + + HaxeFlixel logo + +
    +
    +
    - +
    -
    -
    +
    +

    Our platinum and gold sponsors:

    -
    +