refactor: begin redesign of tab errors

This commit is contained in:
alexsparkes
2024-08-17 23:50:13 +01:00
parent 7178983a36
commit bf64f56f7c
15 changed files with 98 additions and 81 deletions

View File

@@ -354,7 +354,9 @@ const ItemPage = () => {
};
useEffect(() => {
document.querySelector('#modal').scrollTop = 0;
if (document.querySelector('#modal')) {
document.querySelector('#modal').scrollTop = 0;
}
});
return (

View File

@@ -72,7 +72,9 @@ class ItemPage extends PureComponent {
componentDidMount() {
this.getCurator(this.props.data.author);
document.querySelector('#modal').scrollTop = 0;
if (document.querySelector('#modal')) {
document.querySelector('#modal').scrollTop = 0;
}
this.setState({
button: this.props.data.local.installed ? this.buttons.uninstall : this.buttons.install,
});

View File

@@ -57,7 +57,7 @@ function Modals() {
onRequestClose={() => toggleModal('main', false)}
isOpen={main}
id="#modal"
className="z-[100] h-[80vh] w-modal border-3 border-modal ease-in-out duration-800 transition-all backdrop-blur-3xl bg-modal-light dark:bg-modal-dark text-black dark:text-white overflow-y-auto shadow-xl rounded"
className="overflow-y-hidden z-[100] h-[80vh] w-modal border-3 border-modal ease-in-out duration-800 transition-all backdrop-blur-3xl bg-modal-light dark:bg-modal-dark text-black dark:text-white shadow-xl rounded"
overlayClassName="grid place-content-center absolute top-0 left-0 h-screen w-screen"
ariaHideApp={false}
>

View File

@@ -1,8 +1,7 @@
import variables from 'config/variables';
import { memo } from 'react';
import Added from '../../marketplace/views/Library';
import Create from '../../marketplace/views/Create';
import Library from '../../marketplace/views/Library';
function Addons(props) {
return (
@@ -16,8 +15,8 @@ function Addons(props) {
</Tabs>*/
},
(
<div className="w-full rounded min-h-[69vh] bg-modal-content-light dark:bg-modal-content-dark p-10 flex flex-col">
<Added />
<div className="w-full rounded h-[calc(78vh-80px)] bg-modal-content-light dark:bg-modal-content-dark p-10 flex flex-col overflow-scroll">
<Library />
</div>
)
);

View File

@@ -54,7 +54,7 @@ function Marketplace() {
return (
<AnimatePresence mode="wait">
<motion.div
className="w-full rounded min-h-[69vh] bg-modal-content-light dark:bg-modal-content-dark p-10 flex flex-col"
className="w-full rounded h-[calc(78vh-80px)] bg-modal-content-light dark:bg-modal-content-dark p-10 flex flex-col overflow-scroll"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}