mirror of
https://github.com/hnhx/librex.git
synced 2025-04-29 14:09:27 -04:00
feat: rework the videos page
This commit is contained in:
parent
d95ccfc71d
commit
affd324ac5
3 changed files with 30 additions and 6 deletions
|
@ -51,12 +51,15 @@
|
||||||
$thumbnail = $result["thumbnail"];
|
$thumbnail = $result["thumbnail"];
|
||||||
|
|
||||||
echo "<div class=\"text-result-wrapper\">";
|
echo "<div class=\"text-result-wrapper\">";
|
||||||
echo "<a href=\"$url\">";
|
echo "<a class=\"video-link\" href=\"$url\">";
|
||||||
|
echo "<div class=\"video-thumbnail\">";
|
||||||
|
echo "<img class=\"video-img\" src=\"image_proxy.php?url=$thumbnail\">";
|
||||||
|
echo "</div>";
|
||||||
|
echo "<div class=\"video-properties\">";
|
||||||
echo "$base_url";
|
echo "$base_url";
|
||||||
echo "<h2>$title</h2>";
|
echo "<h2>$title</h2>";
|
||||||
echo "<img class=\"video-img\" src=\"image_proxy.php?url=$thumbnail\">";
|
|
||||||
echo "<br>";
|
|
||||||
echo "<span>$date - $views</span>";
|
echo "<span>$date - $views</span>";
|
||||||
|
echo "</div>";
|
||||||
echo "</a>";
|
echo "</a>";
|
||||||
echo "</div>";
|
echo "</div>";
|
||||||
}
|
}
|
||||||
|
|
|
@ -51,7 +51,7 @@
|
||||||
$config = require "config.php";
|
$config = require "config.php";
|
||||||
require "misc/tools.php";
|
require "misc/tools.php";
|
||||||
|
|
||||||
echo "<div class=\"result-container\">";
|
echo "<div class=\"result-container\" data-type=\"$type\">";
|
||||||
|
|
||||||
$page = isset($_REQUEST["p"]) ? (int) $_REQUEST["p"] : 0;
|
$page = isset($_REQUEST["p"]) ? (int) $_REQUEST["p"] : 0;
|
||||||
|
|
||||||
|
|
|
@ -242,6 +242,11 @@ a:hover,
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Allow the video wrapper to be a bit bigger */
|
||||||
|
.result-container[data-type="2"] .text-result-wrapper {
|
||||||
|
max-width: 700px;
|
||||||
|
}
|
||||||
|
|
||||||
#time {
|
#time {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
opacity: 0.65;
|
opacity: 0.65;
|
||||||
|
@ -303,9 +308,12 @@ a:hover,
|
||||||
color: var(--result-fg);
|
color: var(--result-fg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-img {
|
.video-thumbnail {
|
||||||
height: 115px;
|
min-height: 96px;
|
||||||
|
max-height: 96px;
|
||||||
|
background-color: var(--search-container-background-color);
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
|
aspect-ratio: 4 / 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-result-wrapper h2 {
|
.text-result-wrapper h2 {
|
||||||
|
@ -405,6 +413,19 @@ a[title] .image-properties {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.video-link {
|
||||||
|
display: inline-flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.video-link .video-img {
|
||||||
|
max-height: 96px;
|
||||||
|
background-color: var(--search-container-background-color);
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
.git-container {
|
.git-container {
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue