Style media embeds

This commit is contained in:
Ben Goldsworthy 2022-11-28 22:24:04 +00:00
parent ea35ca38c1
commit 428645245b
3 changed files with 8 additions and 6 deletions

View file

@ -195,7 +195,8 @@ body {
width: auto !important;
}
.popup__image {
.popup__image,
.popup__video {
width: auto;
height: auto;
max-width: 70vw;
@ -274,7 +275,8 @@ body {
min-width: 350px;
}
.popup__image {
.popup__image,
.popup__video {
max-width: 100%;
max-height: 60vh;
margin-top: 1em;

View file

@ -8,12 +8,12 @@
@if($checkin->note)
@if(preg_match("/\[\[([^\]]+)\]\]/", $checkin->note, $filepath))
@if(preg_match("/\.webm/", $filepath[1]))
<video controls>
<video class="popup__video" controls>
<source src="/videos/{{ $filepath[1] }}" type="video/webm">
<p>Your browser doesn't support HTML video. Here is a <a href="/{{ $filepath[1] }}">link to the video</a> instead.</p>
</video>
@elseif(preg_match("/\.ogg/", $filepath[1]))
<audio controls>
<audio class="popup__audio" controls>
<source src="/audio/{{ $filepath[1] }}" type="audio/ogg">
<p>Download <a href="/{{ $filepath[1] }}">OGG</a> audio.</p>
</audio>

View file

@ -94,7 +94,7 @@
@if(preg_match("/\[\[([^\]]+)\]\]/", $checkin->note, $filepath))
@if(preg_match("/\.webm/", $filepath[1]))
@php
$popupContent = '<video controls><source src="/videos/';
$popupContent = '<video class="popup__video" controls><source src="/videos/';
$popupContent .= $filepath[1];
$popupContent .= '" type="video/webm">';
$popupContent .= '<p>Your browser doesn\'t support HTML video. Here is a <a href="/';
@ -103,7 +103,7 @@
@endphp
@elseif(preg_match("/\.ogg/", $filepath[1]))
@php
$popupContent = '<audio controls><source src="/audio/';
$popupContent = '<audio class="popup__audio" controls><source src="/audio/';
$popupContent .= $filepath[1];
$popupContent .= '" type="audio/ogg">';
$popupContent .= '<p>Download <a href="/';