More CSS fix

This commit is contained in:
2024-03-04 09:24:13 -05:00
parent e0b2334c93
commit 27180ae9d6
3 changed files with 68 additions and 42 deletions

View File

@@ -20,6 +20,19 @@ th {
table {
}
#data {
width: 100%;
border-collapse: collapse;
}
#data th:nth-child(3),
#data td:nth-child(3) {
max-width: 300px; /* Adjust as needed */
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.center-table {
}
@@ -136,6 +149,32 @@ td img{
height: 100%;
background-color: rgba(0,0,0,0.5);
}
.lightbox-wrapper {
position: relative;
width: 100%;
height: 100%;
}
.lightbox-content {
max-width: 90%;
max-height: 90%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
#lightbox-text {
position: absolute;
bottom: 20px; /* Adjust as needed */
left: 50%;
transform: translateX(-50%);
padding: 10px;
background-color: rgba(0, 0, 0, 0.5); /* Adjust background color and opacity */
color: white;
text-align: center;
}
#lightbox-modal .close {
position: absolute;
@@ -153,12 +192,14 @@ td img{
max-height: 90%;
}
</style>
</head>
<body>
<button style="background-color: white;color: black;border: 1px dotted black;width: 98%;margin: 1%;" onclick="goToPage('/')">Home</button>
<div class="container">
<h1 style="margin: 20px 0px 0px 0px;">{{ title }}</h1>
<h2 style="margin: 20px 0px 0px 0px;">{{ title }}</h2>
<hr>
{% block content %}{% endblock %}
</div>