Browse Source

improve ui

dev
xmcp 7 years ago
parent
commit
8ebc479c47
  1. 17
      src/Flows.css
  2. 4
      src/Sidebar.css
  3. 6
      src/Title.css
  4. 8
      src/UserAction.css
  5. 3
      src/UserAction.js

17
src/Flows.css

@ -91,7 +91,22 @@
.left-container .flow-item-row { .left-container .flow-item-row {
cursor: default; cursor: default;
transition: margin-left 200ms ease-out; }
.flow-item-row:hover::before {
content: '>>';
position: absolute;
left: 10px;
margin-top: 1.5em;
color: white;
text-shadow: 0 0 5px #000;
font-family: 'Consolas', 'Courier', monospace;
}
@media screen and (max-width: 1200px) {
.flow-item-row:hover::before {
display: none;
}
} }
.flow-item-row p.img { .flow-item-row p.img {

4
src/Sidebar.css

@ -41,11 +41,11 @@
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.sidebar { .sidebar {
width: calc(100% - 25px); width: calc(100% - 20px);
padding: 1em .5em; padding: 1em .5em;
} }
.sidebar-on .sidebar { .sidebar-on .sidebar {
left: 25px; left: 20px;
} }
} }

6
src/Title.css

@ -27,6 +27,12 @@
text-align: center; text-align: center;
color: black; color: black;
} }
.control-btn .icon:before {
margin: .5em;
display: inline-block;
}
.control-bar input { .control-bar input {
flex: auto; flex: auto;
color: black; color: black;

8
src/UserAction.css

@ -11,8 +11,8 @@
.reply-form textarea { .reply-form textarea {
resize: vertical; resize: vertical;
flex: 1; flex: 1;
min-height: 3em; min-height: 2em;
height: 5em; height: 4em;
} }
.reply-form button { .reply-form button {
flex: 0 0 3em; flex: 0 0 3em;
@ -21,10 +21,14 @@
.post-form-bar { .post-form-bar {
line-height: 2em; line-height: 2em;
display: flex; display: flex;
margin-bottom: .5em;
} }
.post-form-bar label { .post-form-bar label {
flex: 1; flex: 1;
} }
.post-form-bar input[type=file] {
border: 0;
}
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.post-form-bar input[type=file] { .post-form-bar input[type=file] {
width: 150px; width: 150px;

3
src/UserAction.js

@ -323,7 +323,7 @@ export class PostForm extends Component {
<form onSubmit={this.on_submit.bind(this)} className="post-form box"> <form onSubmit={this.on_submit.bind(this)} className="post-form box">
<div className="post-form-bar"> <div className="post-form-bar">
<label> <label>
图片 图片
<input ref={this.img_ref} type="file" accept="image/*" <input ref={this.img_ref} type="file" accept="image/*"
{...this.state.loading_status!=='done' ? {disabled: true} : {}} /> {...this.state.loading_status!=='done' ? {disabled: true} : {}} />
</label> </label>
@ -338,7 +338,6 @@ export class PostForm extends Component {
</button> </button>
} }
</div> </div>
<br />
<SafeTextarea ref={this.area_ref} id="new_post" on_change={this.on_change_bound} /> <SafeTextarea ref={this.area_ref} id="new_post" on_change={this.on_change_bound} />
</form> </form>
) )

Loading…
Cancel
Save