40 lines
2.1 KiB
Twig
40 lines
2.1 KiB
Twig
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}{{ ship.name }}{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="my-4 px-8">
|
|
<a class="bg-white hover:bg-gray-200 rounded-xl p-2 text-black" href="#">
|
|
<svg class="inline text-black" xmlns="http://www.w3.org/2000/svg" height="16" width="14" viewBox="0 0 448 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="#000" d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.2 288 416 288c17.7 0 32-14.3 32-32s-14.3-32-32-32l-306.7 0L214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>
|
|
Back
|
|
</a>
|
|
</div>
|
|
<div class="md:flex justify-center space-x-3 mt-5 px-4 lg:px-8">
|
|
<div class="flex justify-center">
|
|
<img class="max-h-[300px] md:max-h-[500px]" src="{{ asset('images/purple-rocket.png') }}" alt="purple ship launching">
|
|
</div>
|
|
<div class="space-y-5">
|
|
<div class="mt-8 max-w-xl mx-auto">
|
|
<div class="px-8 pt-8">
|
|
<div class="rounded-2xl py-1 px-3 flex justify-center w-32 items-center bg-amber-400/10">
|
|
<div class="rounded-full h-2 w-2 bg-amber-400 blur-[1px] mr-2"></div>
|
|
<p class="uppercase text-xs">{{ ship.status }}</p>
|
|
</div>
|
|
|
|
<h1 class="text-[32px] font-semibold border-b border-white/10 pb-5 mb-5">
|
|
{{ ship.name }}
|
|
</h1>
|
|
<h4 class="text-xs text-slate-300 font-semibold mt-2 uppercase">Spaceship Captain</h4>
|
|
<p class="text-[22px] font-semibold">{{ ship.captain }}</p>
|
|
|
|
<h4 class="text-xs text-slate-300 font-semibold mt-2 uppercase">Class</h4>
|
|
<p class="text-[22px] font-semibold">{{ ship.class }}</p>
|
|
|
|
<h4 class="text-xs text-slate-300 font-semibold mt-2 uppercase">Ship Status</h4>
|
|
<p class="text-[22px] font-semibold">30,000 lys to next service</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|