show.html.twig 3.17 KiB
{# Created by Firas Bouzazi and Mohammed Oun #}
{% extends 'base.html.twig' %}
{% block title %}Item Details{% endblock %}
{% block stylesheets %}
{{ parent() }}
<style>
body {
font-family: Arial, sans-serif;
background: linear-gradient(135deg, #00B8DE, #99CC33) fixed;
color: white;
text-align: center;
padding: 20px;
}
.container {
max-width: 800px;
margin: auto;
}
.item-container {
background: rgba(255, 255, 255, 0.2);
border: 2px solid #99CC33;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
backdrop-filter: blur(10px);
padding: 20px;
margin-top: 20px;
}
h1 {
margin-bottom: 20px;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
padding: 12px;
border: 2px solid #99CC33;
border-radius: 4px;
}
th {
background-color: rgba(153, 204, 51, 0.5);
}
a.button {
display: inline-block;
margin: 10px 5px;
padding: 10px 20px;
text-decoration: none;
border: 2px solid #00B8DE;
background-color: white;
color: #00B8DE;
border-radius: 4px;
transition: all 0.3s ease;
}
a.button:hover {
background-color: #99CC33;
color: white;
border-color: #99CC33;
}
@media (max-width: 768px) {
.item-container {
width: 90%;
}
table, th, td {
font-size: 0.9rem;
}
}
</style>