improve ui

This commit is contained in:
xmcp
2018-08-26 00:54:12 +08:00
parent 94251b394b
commit 8ebc479c47
5 changed files with 31 additions and 7 deletions

View File

@@ -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 {

View File

@@ -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;
} }
} }

View File

@@ -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;

View File

@@ -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;

View File

@@ -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>
) )