diff --git a/package-lock.json b/package-lock.json index d8d1f2b31..b5c856635 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "stremio", - "version": "5.0.0-beta.13", + "version": "5.0.0-beta.14", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "stremio", - "version": "5.0.0-beta.13", + "version": "5.0.0-beta.14", "license": "gpl-2.0", "dependencies": { "@babel/runtime": "7.26.0", diff --git a/package.json b/package.json index 14e7dff48..2dd83b86d 100755 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "stremio", "displayName": "Stremio", - "version": "5.0.0-beta.13", + "version": "5.0.0-beta.14", "author": "Smart Code OOD", "private": true, "license": "gpl-2.0", diff --git a/src/common/BottomSheet/BottomSheet.less b/src/common/BottomSheet/BottomSheet.less index e0d756477..4ac68ead6 100644 --- a/src/common/BottomSheet/BottomSheet.less +++ b/src/common/BottomSheet/BottomSheet.less @@ -87,7 +87,13 @@ } } -@media only screen and (min-width: @xsmall) { +@media only screen and (min-width: @small) and (orientation: portait) { + .bottom-sheet { + display: none; + } +} + +@media only screen and (min-width: @xsmall) and (orientation: landscape) { .bottom-sheet { display: none; } diff --git a/src/common/Button/styles.less b/src/common/Button/styles.less index 6a26b3b7f..6baf8b7aa 100644 --- a/src/common/Button/styles.less +++ b/src/common/Button/styles.less @@ -6,6 +6,7 @@ outline-width: var(--focus-outline-size); outline-color: @color-surface-light5; outline-offset: calc(-1 * var(--focus-outline-size)); + -webkit-tap-highlight-color: transparent; cursor: pointer; &:focus { diff --git a/src/common/ColorInput/styles.less b/src/common/ColorInput/styles.less index 7ed494061..56bd1f601 100644 --- a/src/common/ColorInput/styles.less +++ b/src/common/ColorInput/styles.less @@ -17,7 +17,6 @@ align-items: center; justify-content: center; padding: 0 0.5rem; - border: thin solid @color-surface-light5-20; pointer-events: none; .transparent-label { diff --git a/src/common/RadioButton/RadioButton.less b/src/common/RadioButton/RadioButton.less index 7e414a521..4f3380147 100644 --- a/src/common/RadioButton/RadioButton.less +++ b/src/common/RadioButton/RadioButton.less @@ -24,6 +24,7 @@ outline-width: var(--focus-outline-size); outline-color: @color-surface-light5; outline-offset: calc(-1 * var(--focus-outline-size)); + -webkit-tap-highlight-color: transparent; input[type='radio'] { opacity: 0; diff --git a/src/common/TextInput/TextInput.tsx b/src/common/TextInput/TextInput.tsx index b409f229c..573f69c7d 100644 --- a/src/common/TextInput/TextInput.tsx +++ b/src/common/TextInput/TextInput.tsx @@ -1,32 +1,25 @@ // Copyright (C) 2017-2024 Smart code 203358507 -import React from 'react'; +import React, { forwardRef, useCallback } from 'react'; +import { type KeyboardEvent, type InputHTMLAttributes } from 'react'; import classnames from 'classnames'; import styles from './styles.less'; -type Props = React.InputHTMLAttributes & { +type Props = InputHTMLAttributes & { className?: string; disabled?: boolean; - onKeyDown?: (event: React.KeyboardEvent) => void; - onSubmit?: (event: React.KeyboardEvent) => void; + onKeyDown?: (event: KeyboardEvent) => void; + onSubmit?: (event: KeyboardEvent) => void; }; -const TextInput = React.forwardRef((props, ref) => { - const { onSubmit, className, disabled, ...rest } = props; +const TextInput = forwardRef((props, ref) => { + const onKeyDown = useCallback((event: KeyboardEvent) => { + props.onKeyDown && props.onKeyDown(event); - const onKeyDown = React.useCallback((event: React.KeyboardEvent) => { - if (typeof props.onKeyDown === 'function') { - props.onKeyDown(event); + if (event.key === 'Enter' ) { + props.onSubmit && props.onSubmit(event); } - - if ( - event.key === 'Enter' && - !(event.nativeEvent as any).submitPrevented && - typeof onSubmit === 'function' - ) { - onSubmit(event); - } - }, [props.onKeyDown, onSubmit]); + }, [props.onKeyDown, props.onSubmit]); return ( ((props, ref) => { autoComplete={'off'} spellCheck={false} tabIndex={0} + {...props} ref={ref} - className={classnames(className, styles['text-input'], { disabled })} + className={classnames(props.className, styles['text-input'], { 'disabled': props.disabled })} onKeyDown={onKeyDown} - {...rest} /> ); }); diff --git a/src/routes/Calendar/Table/Cell/Cell.less b/src/routes/Calendar/Table/Cell/Cell.less index 1d54855bc..1a0f16d7e 100644 --- a/src/routes/Calendar/Table/Cell/Cell.less +++ b/src/routes/Calendar/Table/Cell/Cell.less @@ -128,8 +128,10 @@ border-color: var(--primary-foreground-color); } - &:not(.active):hover { - border-color: var(--overlay-color); + @media (pointer: fine) { + &:not(.active):hover { + border-color: var(--overlay-color); + } } } diff --git a/src/routes/Settings/styles.less b/src/routes/Settings/styles.less index a8dd1a990..37103540f 100644 --- a/src/routes/Settings/styles.less +++ b/src/routes/Settings/styles.less @@ -286,7 +286,6 @@ } .multiselect-menu-container { - max-height: calc(3.2rem * 7); overflow: auto; } } @@ -316,7 +315,14 @@ } &.color-input-container { - padding: 1.75rem 1rem; + padding: 1.3rem 1rem; + border-radius: 3rem; + border: 2px solid transparent; + transition: 0.3s all ease-in-out; + + &:hover { + border-color: var(--overlay-color); + } } &.info-container {