Small fixes
This commit is contained in:
DrMint
parent
f12d5b0525
commit
3e979c4005
|
|
@ -26,9 +26,8 @@ SMTP_PASSWORD=mypassword123
|
|||
|
||||
NEXT_PUBLIC_URL_CMS=https://url-to.strapi-accords-library.com
|
||||
NEXT_PUBLIC_URL_IMG=https://url-to.img-accords-library.com
|
||||
NEXT_PUBLIC_URL_SELF=https://url-to-front-accords-library.com
|
||||
NEXT_PUBLIC_URL_SCANS=https://url-to.scans-accords-library.com/
|
||||
NEXT_PUBLIC_URL_VIDEOS=https://url-to.videos-accords-library.com/
|
||||
NEXT_PUBLIC_URL_SELF=https://url-to.front-accords-library.com
|
||||
NEXT_PUBLIC_URL_ASSETS=https://url-to.assets-accords-library.com
|
||||
|
||||
## MEILISEARCH
|
||||
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ export const Chip = ({ className, text }: Props): JSX.Element => (
|
|||
<div
|
||||
className={cJoin(
|
||||
`grid place-content-center place-items-center whitespace-nowrap rounded-full border
|
||||
border-black/70 text-black/70 px-1.5 pb-[0.14rem] text-xs`,
|
||||
border-black/70 px-1.5 pb-[0.14rem] text-xs text-black/70`,
|
||||
className
|
||||
)}>
|
||||
{text}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import { cJoin } from "helpers/className";
|
|||
|
||||
/*
|
||||
* ╭─────────────╮
|
||||
* ────────────────────────────────────────╯ CONSTANTS ╰──────────────────────────────────────────
|
||||
* ────────────────────────────────────────╯ COMPONENT ╰──────────────────────────────────────────
|
||||
*/
|
||||
|
||||
interface Props {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { getAssetURL, getImgSizesByQuality, ImageQuality } from "helpers/img";
|
|||
|
||||
/*
|
||||
* ╭─────────────╮
|
||||
* ────────────────────────────────────────╯ CONSTANTS ╰──────────────────────────────────────────
|
||||
* ────────────────────────────────────────╯ COMPONENT ╰──────────────────────────────────────────
|
||||
*/
|
||||
|
||||
interface Props
|
||||
|
|
|
|||
|
|
@ -10,9 +10,10 @@ import { isDefined } from "helpers/asserts";
|
|||
* ───────────────────────────────────────╯ COMPONENT ╰───────────────────────────────────────────
|
||||
*/
|
||||
|
||||
interface Props {
|
||||
export interface ButtonGroupProps {
|
||||
className?: string;
|
||||
buttonsProps: (Parameters<typeof Button>[0] & {
|
||||
visible?: boolean;
|
||||
tooltip?: React.ReactNode | null | undefined;
|
||||
tooltipPlacement?: Placement;
|
||||
})[];
|
||||
|
|
@ -20,7 +21,14 @@ interface Props {
|
|||
|
||||
// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
|
||||
|
||||
export const ButtonGroup = ({ buttonsProps, className }: Props): JSX.Element => (
|
||||
export const ButtonGroup = ({ buttonsProps, className }: ButtonGroupProps): JSX.Element => (
|
||||
<FilteredButtonGroup
|
||||
buttonsProps={buttonsProps.filter((button) => button.visible !== false)}
|
||||
className={className}
|
||||
/>
|
||||
);
|
||||
|
||||
const FilteredButtonGroup = ({ buttonsProps, className }: ButtonGroupProps) => (
|
||||
<div className={cJoin("grid grid-flow-col", className)}>
|
||||
{buttonsProps.map((buttonProps, index) => (
|
||||
<ConditionalWrapper
|
||||
|
|
|
|||
|
|
@ -215,7 +215,7 @@ export const prettyDuration = (seconds: number): string => {
|
|||
let result = "";
|
||||
if (hours) result += `${hours.toString().padStart(2, "0")}:`;
|
||||
result += `${minutes.toString().padStart(2, "0")}:`;
|
||||
result += remainingSeconds.toString().padStart(2, "0");
|
||||
result += Math.floor(remainingSeconds).toString().padStart(2, "0");
|
||||
return result;
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -15,4 +15,4 @@ export const isUntangibleGroupItem = (
|
|||
metadata.subtype?.data?.attributes?.slug === "relation-set");
|
||||
|
||||
export const getScanArchiveURL = (slug: string): string =>
|
||||
`${process.env.NEXT_PUBLIC_URL_SCANS}/${slug}.zip`;
|
||||
`${process.env.NEXT_PUBLIC_URL_ASSETS}/library/scans/${slug}.zip`;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
export const getVideoThumbnailURL = (uid: string): string =>
|
||||
`${process.env.NEXT_PUBLIC_URL_VIDEOS}/${uid}.webp`;
|
||||
`${process.env.NEXT_PUBLIC_URL_ASSETS}/videos/${uid}.webp`;
|
||||
|
||||
export const getVideoFile = (uid: string): string =>
|
||||
`${process.env.NEXT_PUBLIC_URL_VIDEOS}/${uid}.mp4`;
|
||||
`${process.env.NEXT_PUBLIC_URL_ASSETS}/videos/${uid}.mp4`;
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export const useFullscreen = (
|
|||
const [isFullscreen, setIsFullscreen] = useState(false);
|
||||
const isClient = useIsClient();
|
||||
|
||||
const elem = isClient ? document.querySelector(`#${id}`) : null;
|
||||
const elem = isClient ? document.querySelector(`#${CSS.escape(id)}`) : null;
|
||||
|
||||
const requestFullscreen = useCallback(async () => elem?.requestFullscreen(), [elem]);
|
||||
const exitFullscreen = useCallback(
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ export const useOnResize = (
|
|||
|
||||
useEffect(() => {
|
||||
logger.log(`Creating observer for ${id}`);
|
||||
const elem = isClient ? document.querySelector(`#${id}`) : null;
|
||||
const elem = isClient ? document.querySelector(`#${CSS.escape(id)}`) : null;
|
||||
const ro = new ResizeObserver((resizeObserverEntry) => {
|
||||
const entry = resizeObserverEntry[0];
|
||||
if (isDefined(entry)) {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Ids } from "types/ids";
|
|||
|
||||
export const useOnScroll = (id: Ids, onScroll: (scroll: number) => void): void => {
|
||||
const isClient = useIsClient();
|
||||
const elem = isClient ? document.querySelector(`#${id}`) : null;
|
||||
const elem = isClient ? document.querySelector(`#${CSS.escape(id)}`) : null;
|
||||
const listener = useCallback(() => {
|
||||
if (elem?.scrollTop) {
|
||||
onScroll(elem.scrollTop);
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ export const useScrollTopOnChange = (id: Ids, deps: DependencyList, enabled = tr
|
|||
useEffect(() => {
|
||||
if (enabled) {
|
||||
logger.log("Change detected. Scrolling to top");
|
||||
document.querySelector(`#${id}`)?.scrollTo({ top: 0, behavior: "smooth" });
|
||||
document.querySelector(`#${CSS.escape(id)}`)?.scrollTo({ top: 0, behavior: "smooth" });
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [id, ...deps, enabled]);
|
||||
|
|
|
|||
|
|
@ -409,6 +409,7 @@ const RelatedContentsSection = ({
|
|||
open={isOpened}
|
||||
onClosing={() => setOpened(false)}
|
||||
onOpening={() => setOpened(true)}
|
||||
overflowWhenOpen="visible"
|
||||
trigger={
|
||||
<div className="flex place-content-center place-items-center gap-4">
|
||||
<h2 className="text-center text-2xl">{title}</h2>
|
||||
|
|
@ -416,7 +417,7 @@ const RelatedContentsSection = ({
|
|||
</div>
|
||||
}
|
||||
contentInnerClassName={cJoin(
|
||||
cIf(contents.length > 1, "px-4 py-10", "px-4 py-6"),
|
||||
cIf(contents.length > 1, "py-10", "py-6"),
|
||||
"flex w-full flex-wrap place-content-center items-start gap-x-6 gap-y-8"
|
||||
)}
|
||||
easing="ease-in-out"
|
||||
|
|
|
|||
|
|
@ -520,11 +520,13 @@ const LibrarySlug = ({
|
|||
<div className="flex gap-2">
|
||||
<Button
|
||||
icon={isGalleryMode ? "expand_more" : "expand_less"}
|
||||
active={isGalleryMode}
|
||||
onClick={() => setIsGalleryMode((current) => !current)}
|
||||
size="small"
|
||||
/>
|
||||
<Button
|
||||
icon={isFullscreen ? "fullscreen_exit" : "fullscreen"}
|
||||
active={isFullscreen}
|
||||
onClick={toggleFullscreen}
|
||||
size="small"
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
width: 100%;
|
||||
}
|
||||
.rc-slider-track {
|
||||
@apply h-2 rounded-full bg-dark/20 bg-mid shadow-inner-sm shadow-shade;
|
||||
@apply h-2 rounded-full bg-dark/50 shadow-inner-sm shadow-shade;
|
||||
position: absolute;
|
||||
}
|
||||
.rc-slider-handle {
|
||||
|
|
|
|||
Loading…
Reference in New Issue