Improved share modal
This commit is contained in:
parent
c8f3993238
commit
b16690d317
5 changed files with 36 additions and 5 deletions
|
|
@ -171,6 +171,8 @@ export function TextEditor({ file, setTitle, setIconUrl, close, mode, app, modal
|
|||
"Zoom In": ["Control", "+"],
|
||||
"Zoom Out": ["Control", "-"],
|
||||
"Reset Zoom": ["Control", "0"],
|
||||
"Edit mode": ["Control v"],
|
||||
"Preview mode": ["Control v"],
|
||||
}
|
||||
}}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,9 @@ import AppsManager from "../../../features/apps/appsManager.js";
|
|||
import utilStyles from "../../../styles/utils.module.css";
|
||||
import { Button } from "../../_utils/button/Button.jsx";
|
||||
import Option from "./Option.jsx";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { faSquare } from "@fortawesome/free-regular-svg-icons";
|
||||
import { faSquareCheck } from "@fortawesome/free-solid-svg-icons";
|
||||
|
||||
const APP_OPTIONS = {
|
||||
"terminal": [
|
||||
|
|
@ -94,10 +97,16 @@ export function Share({ modal, params, ...props }) {
|
|||
)}
|
||||
</select>
|
||||
</label>
|
||||
<label className={styles.Label}>
|
||||
{appId !== "" ? <label className={styles.Label}>
|
||||
<p>Fullscreen:</p>
|
||||
<input className={styles.Input} name="fullscreen" type="checkbox" checked={fullscreen} value={fullscreen} onChange={onFullscreenChange}/>
|
||||
</label>
|
||||
<div className={styles.Checkbox}>
|
||||
{fullscreen
|
||||
? <FontAwesomeIcon icon={faSquareCheck}/>
|
||||
: <FontAwesomeIcon icon={faSquare}/>
|
||||
}
|
||||
</div>
|
||||
</label> : null}
|
||||
{APP_OPTIONS[appId]?.map(({ label, name }) =>
|
||||
<Option key={name} name={name} label={label} setOption={setOption}/>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -74,8 +74,27 @@ select.Input > * {
|
|||
}
|
||||
|
||||
.Input[type=checkbox] {
|
||||
background-color: var(--background-color-b);
|
||||
outline: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.Checkbox {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.Checkbox > svg {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
fill: var(--foreground-color-a);
|
||||
}
|
||||
|
||||
.Checkbox > svg > * {
|
||||
fill: inherit;
|
||||
}
|
||||
|
||||
.Url {
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@ export const WindowView = memo(({ id, app, size, position, onInteract, options,
|
|||
close();
|
||||
}}/>
|
||||
<Divider/>
|
||||
<ClickAction label={"Share"} icon={ModalsManager.getModalIconUrl("share")} onTrigger={() => {
|
||||
<ClickAction label={"Share"} icon={ModalsManager.getModalIconUrl("share")} shortcut={["Alt", "s"]} onTrigger={() => {
|
||||
openWindowedModal({
|
||||
appId: app.id,
|
||||
fullscreen: maximized,
|
||||
|
|
|
|||
|
|
@ -48,6 +48,7 @@ export function useShortcuts({ options, shortcuts, useCategories = true }) {
|
|||
continue;
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
if (!shortcut.includes(event.key) || !allowExecution)
|
||||
continue;
|
||||
|
|
|
|||
Loading…
Reference in a new issue