SplendidBear-Websites/MineSeeker
Private
Public Access
1
0
Fork 0
Code Pull Requests 1 Releases Activity

chg: usr: refactor and redesign the gfx on front-end #4

Browse Source
This commit is contained in:
László Lang
2026-04-11 19:23:59 +02:00
parent 63a0f442ed
commit eff849549b
17 changed files with 745 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

140
templates/Game/index.html.twig
View File

@@ -3,93 +3,83 @@
{% block title %} - The Game{% endblock %}
{% block metas %}
<meta property="og:url" content="{{ url('MineSeekerBundle_homepage') }}"/>
<meta property="og:type" content="website"/>
<meta property="og:title" content="MineSeeker"/>
<meta property="og:description" content="A multiplayer minesweeper game"/>
<meta property="og:image"
content="{{ app.request.getSchemeAndHttpHost() }}{{ asset('images/images/mine-1600x627.png') }}"/>
<meta property="og:url" content="{{ url('MineSeekerBundle_homepage') }}"/>
<meta property="og:type" content="website"/>
<meta property="og:title" content="MineSeeker"/>
<meta property="og:description" content="A multiplayer minesweeper game"/>
<meta property="og:image"
content="{{ app.request.getSchemeAndHttpHost() }}{{ asset('images/mine-1600x627.png') }}"/>
{% endblock %}
{% block header %}
<section class="header-content">
<div class="logo">
<a href="{{ path('MineSeekerBundle_homepage') }}" target="_self">
<img src="{{ asset('images/mine-logo-txt.png') }}" alt="MineSeeker Logo w/ Txt"/>
</a>
</div>
<div>
<div id="id_welcome"{% if app.user.facebookId is defined and app.user.facebookId is not null %} style="margin-bottom:50px"{% endif %}>
{% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
{% if app.user.facebookId is not null %}
<div>
<img src="http://graph.facebook.com/{{ app.user.facebookId }}/picture?type=square&width=100&height=100"
alt="Facebook profile"/>
</div>
{% endif %}
<div>
<h2{% if app.user.facebookId is defined and app.user.facebookId is not null %} style="margin-top:0"{% endif %}>
Hello, {{ app.user.realName is not null ? app.user.realName : app.user.username }}!
</h2>
<h1>Let's play!! :D</h1>
</div>
{% else %}
<div>
<h2>A minesweeper game rethought...</h2>
<h1>...and you can play w/o register!!</h1>
</div>
{% endif %}
</div>
<div class="buttons">
<a href="{{ path('MineSeekerBundle_gamePlay') }}">Play NOW!</a>
{#
{% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
<a href="{{ path('fos_user_security_logout') }}" class="small">
{{ 'layout.logout'|trans({}, 'FOSUserBundle') }}
</a>
{% else %}
<a href="{{ path('fos_user_registration_register') }}" class="small">Sign up</a> &middot;
<a href="{{ path('fos_user_security_login') }}" class="small">Sign in</a>
{% endif %}
#}
</div>
<h3>
version {{ version }} &bull; MineSeeker &copy; {{ "now"|date("Y") }} &bull;
<a href="https://www.splendidbear.org">www.splendidbear.org</a>
</h3>
</div>
<img src="{{ asset('images/mine-logo-logo.png') }}" alt="MineSeeker Logo"/>
</section>
<section
class="hero{% if app.request.attributes.get('_route') != 'MineSeekerBundle_homepage' %} hero--compact{% endif %}">
<a class="hero-logo" href="{{ path('MineSeekerBundle_homepage') }}">
<img src="{{ asset('images/mine-logo-txt.png') }}" alt="MineSeeker"/>
</a>
<div class="hero-body">
{% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
<p class="hero-sub">
{% if app.user.facebookId is defined and app.user.facebookId is not null %}
<img class="hero-avatar"
src="http://graph.facebook.com/{{ app.user.facebookId }}/picture?type=square&width=80&height=80"
alt=""/>
{% endif %}
Welcome back, <strong>{{ app.user.realName is not null ? app.user.realName : app.user.username }}</strong>
</p>
<h1>Ready for another round?</h1>
{% else %}
<p class="hero-sub">Multiplayer minesweeper &mdash; reimagined</p>
<h1>No account needed.<br>Just play.</h1>
{% endif %}
<a href="{{ path('MineSeekerBundle_gamePlay') }}" class="hero-cta">Play Now</a>
</div>
</section>
{% endblock %}
{% block body %}
<div class="txt">
<div class="technologies">
<h1>Used technologies</h1>
<img src="{{ asset('images/technologies/websocket.png') }}" alt="Used Websocket"/>
<img src="{{ asset('images/technologies/react.png') }}" alt="Used React.js"/>
<img src="{{ asset('images/technologies/symfony.png') }}" alt="Used Symfony"/>
<img src="{{ asset('images/technologies/jquery.png') }}" alt="Used jQuery"/>
<img src="{{ asset('images/technologies/lets-encrypt.png') }}" alt="Used Let's Encrypt"/>
</div>
<div class="tech-section">
<p class="tech-label">Built with</p>
<div class="tech-logos">
<img src="{{ asset('images/technologies/symfony.svg') }}" alt="Symfony"/>
<img src="{{ asset('images/technologies/howler.svg') }}" alt="Howler.js"/>
<img src="{{ asset('images/technologies/tanstack-query.svg') }}" alt="TanStack Query"/>
<img src="{{ asset('images/technologies/mercure.svg') }}" alt="Mercure"/>
<img src="{{ asset('images/technologies/vite.svg') }}" alt="Vite"/>
<img src="{{ asset('images/technologies/bun.svg') }}" alt="Bun"/>
<img src="{{ asset('images/technologies/phpstorm.svg') }}" alt="PHPStorm"/>
</div>
</div>
{% endblock %}
{% block footer %}
<nav>
<ul>
<li><a href="{{ path('MineSeekerBundle_homepage') }}">Homepage</a></li>
<li>&bull;</li>
<li><a href="{{ path('MineSeekerBundle_terms') }}">Terms of Use</a></li>
<li>&bull;</li>
<li><a href="{{ path('MineSeekerBundle_privacy') }}">Privacy Policy</a></li>
<li>&bull;</li>
<li><a href="{{ path('MineSeekerBundle_contact') }}">Contact</a></li>
</ul>
<div class="footer-inner">
<div class="footer-brand">
<img src="{{ asset('images/mine-logo-logo.png') }}" alt="MineSeeker" class="footer-logo"/>
<p class="footer-name">MineSeeker</p>
<p class="footer-tagline">Multiplayer minesweeper &mdash; reimagined</p>
</div>
<nav class="footer-nav">
<p class="footer-nav-label">Navigate</p>
<ul>
<li><a href="{{ path('MineSeekerBundle_homepage') }}">Homepage</a></li>
<li><a href="{{ path('MineSeekerBundle_terms') }}">Terms of Use</a></li>
<li><a href="{{ path('MineSeekerBundle_privacy') }}">Privacy Policy</a></li>
<li><a href="{{ path('MineSeekerBundle_contact') }}">Contact</a></li>
</ul>
</nav>
</div>
<div class="footer-copy">
<p>&copy; {{ "now"|date("Y") }} MineSeeker &nbsp;&bull;&nbsp; All rights reserved &nbsp;&bull;&nbsp;
<a href="https://www.splendidbear.org">www.splendidbear.org</a>
</p>
</div>
{% endblock %}
{% block stylesheets %}
{{ parent() }}
{{ vite_entry_link_tags('homeStyle') }}
{{ parent() }}
{{ vite_entry_link_tags('homeStyle') }}
{% endblock %}