BetterSEQTA/BetterSEQTA-Plus
1
0
Fork 0
mirror of https://github.com/BetterSEQTA/BetterSEQTA-Plus.git synced 2026-06-06 03:34:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

clean up shortcuts formatting style

Browse Source
This commit is contained in:
SethBurkart123
2024-03-28 06:57:25 +11:00
parent 2af1aa5bd8
commit 8219ae33c3
1 changed files with 15 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/interface/pages/Shortcuts.tsx
+15 -18
View File
@@ -1,4 +1,4 @@
import { useState } from "react"; import { useState, memo } from "react";
import Switch from "../components/Switch"; import Switch from "../components/Switch";
import { useSettingsContext } from "../SettingsContext"; import { useSettingsContext } from "../SettingsContext";
import { motion, AnimatePresence } from "framer-motion"; import { motion, AnimatePresence } from "framer-motion";
@@ -70,13 +70,13 @@ function Shortcuts() {
<div className="flex flex-col divide-y divide-zinc-100 dark:divide-zinc-700"> <div className="flex flex-col divide-y divide-zinc-100 dark:divide-zinc-700">
<AnimatePresence> <AnimatePresence>
{isFormVisible ? ( <motion.div
<motion.div initial={{ opacity: 0, height: 0 }}
initial={{ opacity: 0, height: 0 }} animate={isFormVisible ? { opacity: 1, height: "auto" } : { opacity: 0, height: 0 }}
animate={{ opacity: 1, height: "auto" }} exit={{ opacity: 0, height: 0 }}
exit={{ opacity: 0, height: 0 }} transition={{ type: "spring", damping: 20 }}
transition={{ type: "spring", damping: 20 }} >
> {isFormVisible &&
<div className="flex flex-col items-center mb-4"> <div className="flex flex-col items-center mb-4">
<motion.input <motion.input
initial={{ opacity: 0, y: -10 }} initial={{ opacity: 0, y: -10 }}
@@ -108,18 +108,15 @@ function Shortcuts() {
Add Add
</motion.button> </motion.button>
</div> </div>
</motion.div> }
) : ( </motion.div>
<motion.button {!isFormVisible && (
initial={{ backgroundColor: "rgba(29, 161, 242, 1)", height: "auto" }} <button
animate={{ backgroundColor: "rgba(29, 161, 242, 1)", height: "auto" }} className="w-full px-4 py-2 mb-4 text-white bg-blue-500 rounded"
exit={{ backgroundColor: "rgba(29, 161, 242, 1)", height: "auto" }}
transition={{ type: 'tween', ease: "easeOut" }}
className="px-4 py-2 mb-4 text-white bg-blue-500 rounded"
onClick={toggleForm} onClick={toggleForm}
> >
Add Custom Shortcut Add Custom Shortcut
</motion.button> </button>
)} )}
</AnimatePresence> </AnimatePresence>
@@ -154,4 +151,4 @@ function Shortcuts() {
); );
} }
export default Shortcuts; export default memo(Shortcuts);