Fix: improved minimum chat width.

This commit is contained in:
John Livingston 2024-09-02 14:39:26 +02:00
parent 0e98cbaba5
commit 9ee4476f4d
No known key found for this signature in database
GPG Key ID: B17B5640CE66CDBC
3 changed files with 3 additions and 17 deletions

View File

@ -29,6 +29,7 @@ The cyberpunk theme was removed from ConverseJS. If you had it set in the plugin
* Fix: increase chat height on small screens, try to better detect the device viewport size and orientation. * Fix: increase chat height on small screens, try to better detect the device viewport size and orientation.
* Converse theme: removed concord, added cyberpunk * Converse theme: removed concord, added cyberpunk
* Fixed Converse theme settings localization. * Fixed Converse theme settings localization.
* Fix: improved minimum chat width.
## 10.3.3 ## 10.3.3

View File

@ -28,13 +28,14 @@
border: 1px solid black; border: 1px solid black;
min-height: max(30vh, 300px); // Always at least 200px, and ideally at least 30% of viewport. min-height: max(30vh, 300px); // Always at least 200px, and ideally at least 30% of viewport.
height: 100%; height: 100%;
min-width: min(400px, 25vw);
converse-muc { converse-muc {
min-height: max(30vh, 300px); min-height: max(30vh, 300px);
} }
@media screen and (orientation: portrait) and (max-width: 767px) { @media screen and (orientation: portrait) and (max-width: 767px) {
/* On small screen, and when portrait mode, we are givint the chat more vertical space. /* On small screen, and when portrait mode, we are giving the chat more vertical space.
It should go under the video. It should go under the video.
*/ */
min-height: max(50vh, 300px); min-height: max(50vh, 300px);

View File

@ -16,8 +16,6 @@ import { localizedHelpUrl } from '../../utils/help'
import { getBaseRoute } from '../../utils/uri' import { getBaseRoute } from '../../utils/uri'
import { displayConverseJS } from '../../utils/conversejs' import { displayConverseJS } from '../../utils/conversejs'
let savedMyPluginFlexGrow: string | undefined
/** /**
* Initialize the chat for the current video * Initialize the chat for the current video
* @param video the video * @param video the video
@ -25,7 +23,6 @@ let savedMyPluginFlexGrow: string | undefined
async function initChat (video: Video): Promise<void> { async function initChat (video: Video): Promise<void> {
const ptContext = getPtContext() const ptContext = getPtContext()
const logger = ptContext.logger const logger = ptContext.logger
savedMyPluginFlexGrow = undefined
if (!video) { if (!video) {
logger.error('No video provided') logger.error('No video provided')
@ -355,19 +352,6 @@ function _hackStyles (on: boolean): void {
buttons.classList.remove('peertube-plugin-livechat-buttons-open') buttons.classList.remove('peertube-plugin-livechat-buttons-open')
} }
}) })
const myPluginPlaceholder: HTMLElement | null = document.querySelector('my-plugin-placeholder')
if (on) {
// Saving current style attributes and maximazing space for the chat
if (myPluginPlaceholder) {
savedMyPluginFlexGrow = myPluginPlaceholder.style.flexGrow // Should be "", but can be anything else.
myPluginPlaceholder.style.flexGrow = '1'
}
} else {
// restoring values...
if (savedMyPluginFlexGrow !== undefined && myPluginPlaceholder) {
myPluginPlaceholder.style.flexGrow = savedMyPluginFlexGrow
}
}
} catch (err) { } catch (err) {
getPtContext().logger.error(`Failed hacking styles: '${err as string}'`) getPtContext().logger.error(`Failed hacking styles: '${err as string}'`)
} }