feat(reply modal): add c/parentCid above textarea, fix tomorrow theme

This commit is contained in:
plebeius.eth
2024-05-08 12:23:18 +02:00
parent 5125cdbea0
commit 5f3ff17ecc
4 changed files with 25 additions and 7 deletions
@@ -57,7 +57,6 @@
outline: var(--post-form-field-input-outline, revert);
background-color: var(--post-form-field-input-background-color, revert);
color: var(--post-form-field-input-color, revert);
filter: var(--filter80);
padding: 2px 4px 3px;
font-size: 10pt;
}
@@ -39,18 +39,21 @@
}
.container input[type="text"], .container textarea {
border: var(--post-form-field-input-border, revert);
border: var(--post-form-field-input-focus-border, revert);
font-family: var(--post-form-field-font-family, revert);
appearance: var(--post-form-field-input-appearance, revert);
outline: var(--post-form-field-input-outline, revert);
background-color: var(--post-form-field-input-background-color, revert);
color: var(--post-form-field-input-color, revert);
font-size: 10pt;
outline: var(--post-form-field-input-outline, revert);
width: 298px;
filter: var(--filter80);
padding: 2px;
margin-bottom: 1px;
}
.container input[type="text"]:focus, .container textarea:focus {
border: var(--post-form-field-input-focus-border, revert);
border: var(--reply-modal-field-border-focus, revert);
}
.content textarea {
@@ -63,6 +66,14 @@
cursor: pointer;
}
.parentCid input[type="text"] {
margin-bottom: -1px !important;
}
.parentCid input[type="text"]:focus {
border: var(--post-form-field-input-focus-border) !important;
}
@media (max-width: 640px) {
.container {
position: absolute;
@@ -88,6 +88,9 @@ const ReplyModal = ({ closeModal, parentCid, scrollY }: ReplyModalProps) => {
<div className={styles.link}>
<input type='text' ref={urlRef} placeholder={_.capitalize(t('link'))} onChange={(e) => setContent.link(e.target.value)} />
</div>
<div className={styles.parentCid}>
<input type='text' readOnly value={`c/${parentCid && Plebbit.getShortCid(parentCid)}`} />
</div>
<div className={styles.content}>
<textarea
cols={48}
+8 -3
View File
@@ -690,15 +690,20 @@
--post-form-toggle-font-weight: 700;
--post-form-field-title-background-color: #282a2e;
--post-form-field-title-color: #c5c8c6;
--post-form-field-border: 1px solid #111;
--post-form-field-border: 1px solid #000;
--post-form-field-title-font-weight: 700;
--post-form-field-title-padding: 0 5px;
--post-form-field-title-font-size: 10pt;
--post-form-field-input-border: 1px solid #aaa;
--post-form-field-input-border: 1px solid #000;
--post-form-field-input-focus-border: 1px solid #515151;
--post-form-field-input-background-color: #282a2e;
--post-form-field-input-color: #c5c8c6;
--post-form-field-font-family: arial, helvetica, sans-serif;
--post-form-field-input-appearance: none;
--post-form-field-input-outline: none;
--post-form-field-input-focus-border: 1px solid #111;
/* reply modal */
--reply-modal-field-border-focus: 1px solid #757575;
/* select */
--select-border: 1px solid #575a60;