Fijxu
/
librex
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: rework the videos page

This commit is contained in:
flowfield 2022-12-24 18:57:38 +01:00
parent d95ccfc71d
commit affd324ac5
No known key found for this signature in database
GPG Key ID: FFBDB54A7F59ABB4
3 changed files with 30 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
engines/brave/video.php
View File

@ -51,12 +51,15 @@
$thumbnail = $result["thumbnail"];
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 "<h2>$title</h2>";
echo "<img class=\"video-img\" src=\"image_proxy.php?url=$thumbnail\">";
echo "<br>";
echo "<span>$date - $views</span>";
echo "</div>";
echo "</a>";
echo "</div>";
}

2
search.php
View File

@ -51,7 +51,7 @@
$config = require "config.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;

25
static/css/styles.css
View File

@ -242,6 +242,11 @@ a:hover,
flex-direction: column;
}
/* Allow the video wrapper to be a bit bigger */
.result-container[data-type="2"] .text-result-wrapper {
max-width: 700px;
}
#time {
font-size: 13px;
opacity: 0.65;
@ -303,9 +308,12 @@ a:hover,
color: var(--result-fg);
}
.video-img {
height: 115px;
.video-thumbnail {
min-height: 96px;
max-height: 96px;
background-color: var(--search-container-background-color);
border-radius: 12px;
aspect-ratio: 4 / 3;
}
.text-result-wrapper h2 {
@ -405,6 +413,19 @@ a[title] .image-properties {
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 {
right: 0;
}