Page MenuHomePhabricator

D3657.id11254.diff
No OneTemporary

D3657.id11254.diff

diff --git a/web/modals/threads/thread-settings-modal.css b/web/modals/threads/thread-settings-modal.css
--- a/web/modals/threads/thread-settings-modal.css
+++ b/web/modals/threads/thread-settings-modal.css
@@ -1,10 +1,7 @@
div.modal_body {
- padding: 6px 6px;
- width: 100%;
- box-sizing: border-box;
+ padding: 20px;
background-color: var(--modal-bg);
- border-bottom-left-radius: 15px;
- border-bottom-right-radius: 15px;
+ border-radius: 16px;
flex: 1;
display: flex;
flex-direction: column;
@@ -14,22 +11,12 @@
font-size: 14px;
text-align: center;
}
-div.modal_body textarea {
- margin: 3px;
-}
-div.modal_body textarea {
- font-size: 14px;
- padding: 1px;
- width: 175px;
-}
div.modal_body p.confirm_account_password {
margin-bottom: 4px;
color: var(--fg);
}
div.modal_body div.form_footer {
display: flex;
- flex-direction: row-reverse;
- justify-content: space-between;
padding-top: 8px;
}
div.modal_body div.form_footer div.modal_form_error {
@@ -40,25 +27,34 @@
align-self: center;
}
div.modal_body div.form_title {
- display: inline-block;
- text-align: right;
- padding-right: 5px;
- padding-top: 5px;
+ padding: 6px 6px 0 0;
font-size: 14px;
font-weight: 600;
vertical-align: top;
- width: 110px;
color: var(--fg);
}
div.modal_body div.form_content {
- display: inline-block;
+ display: flex;
font-family: var(--font-stack);
color: var(--fg);
+ margin-top: 4px;
+ margin-bottom: 8px;
}
div.modal_body div.form_content input {
margin-bottom: 4px;
}
+div.form_content textarea {
+ padding: 12px;
+ background: var(--modal-bg);
+ color: var(--fg);
+ border: 1px solid var(--border-color);
+ font-size: var(--m-font-16);
+ line-height: var(--line-height-text);
+ border-radius: 4px;
+ width: 100%;
+}
+
.italic {
font-style: italic;
color: var(--fg);
@@ -139,3 +135,7 @@
padding-top: 4px;
margin-top: 2px;
}
+
+.save_button {
+ width: 100%;
+}
diff --git a/web/modals/threads/thread-settings-modal.react.js b/web/modals/threads/thread-settings-modal.react.js
--- a/web/modals/threads/thread-settings-modal.react.js
+++ b/web/modals/threads/thread-settings-modal.react.js
@@ -39,6 +39,7 @@
import Button from '../../components/button.react';
import { useModalContext } from '../../modals/modal-provider.react';
import { useSelector } from '../../redux/redux-utils';
+import Input from '../input.react';
import Modal from '../modal.react';
import ColorPicker from './color-picker.react';
import css from './thread-settings-modal.css';
@@ -194,7 +195,7 @@
<div>
<div className={css.form_title}>Thread name</div>
<div className={css.form_content}>
- <input
+ <Input
type="text"
value={firstLine(this.possiblyChangedValue('name'))}
placeholder={this.namePlaceholder()}
@@ -212,7 +213,7 @@
placeholder="Thread description"
onChange={this.onChangeDescription}
disabled={inputDisabled}
- ></textarea>
+ />
</div>
</div>
<div className={css.edit_thread_color_container}>
@@ -328,6 +329,7 @@
type="submit"
onClick={this.onSubmit}
disabled={inputDisabled || !this.changeQueued()}
+ className={css.save_button}
>
Save
</Button>
@@ -379,7 +381,7 @@
}
return (
- <Modal name="Thread settings" onClose={this.props.onClose} size="large">
+ <Modal name="Thread settings" onClose={this.props.onClose}>
<ul className={css.tab_panel}>{tabs}</ul>
<div className={css.modal_body}>
<form method="POST">

File Metadata

Mime Type
text/plain
Expires
Sun, Nov 24, 4:38 PM (16 h, 50 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2576759
Default Alt Text
D3657.id11254.diff (3 KB)

Event Timeline