mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enhance media inlays with consistent styling and structure for images, videos, and audio

Browse Source
This commit is contained in:
Kwaroran
2024-12-12 08:42:10 +09:00
parent 5174082796
commit bb082f96bc
2 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/styles.css
View File

@@ -248,7 +248,15 @@ html, body{
@apply w-full flex justify-center
}
.x-risu-risu-inlay-image > img{
.x-risu-risu-inlay-image img{
@apply rounded-lg focus:outline-none max-w-80 w-full
}
.x-risu-risu-inlay-image video{
@apply rounded-lg focus:outline-none max-w-80 w-full
}
.x-risu-risu-inlay-image audio{
@apply rounded-lg focus:outline-none max-w-80 w-full
}

6
src/ts/parser.svelte.ts
View File

@@ -435,13 +435,13 @@ async function parseInlayAssets(data:string){
const id = inlay.substring(9, inlay.length - 2)
const asset = await getInlayAsset(id)
if(asset?.type === 'image'){
data = data.replace(inlay, `<img src="${asset.data}"/>`)
data = data.replace(inlay, `<div class="risu-inlay-image"><img src="${asset.data}"/></div>`)
}
if(asset?.type === 'video'){
data = data.replace(inlay, `<video controls><source src="${asset.data}" type="video/mp4"></video>`)
data = data.replace(inlay, `<div class="risu-inlay-image"><video controls><source src="${asset.data}" type="video/mp4"></video></div>`)
}
if(asset?.type === 'audio'){
data = data.replace(inlay, `<audio controls><source src="${asset.data}" type="audio/mpeg"></audio>`)
data = data.replace(inlay, `<div class="risu-inlay-image"><audio controls><source src="${asset.data}" type="audio/mpeg"></audio></div>`)
}
}