update comment textarea style
This commit is contained in:
parent
9a8dbf8eb2
commit
a1b2a90ddf
|
@ -59,7 +59,7 @@
|
||||||
'title_reply_to' => '<div class="graybar"><i class="fa fa-comments-o"></i>' . esc_html__('Leave a Reply to', 'akina') . ' %s' . '</div>',
|
'title_reply_to' => '<div class="graybar"><i class="fa fa-comments-o"></i>' . esc_html__('Leave a Reply to', 'akina') . ' %s' . '</div>',
|
||||||
'cancel_reply_link' => esc_html__('Cancel Reply', 'akina'),
|
'cancel_reply_link' => esc_html__('Cancel Reply', 'akina'),
|
||||||
'label_submit' => esc_html__('BiuBiuBiu~', 'akina'),
|
'label_submit' => esc_html__('BiuBiuBiu~', 'akina'),
|
||||||
'comment_field' => '<p><i class="iconfont icon-markdown"></i> Markdown Supported while <i class="fa fa-code" aria-hidden="true"></i> Forbidden</p><textarea placeholder="' . esc_attr__('你是我一生只会遇见一次的惊喜', 'akina') . ' ..." name="comment" class="commentbody" id="comment" rows="5" tabindex="4"></textarea>
|
'comment_field' => '<p><i class="iconfont icon-markdown"></i> Markdown Supported while <i class="fa fa-code" aria-hidden="true"></i> Forbidden</p><div class="comment-textarea"><textarea placeholder="' . esc_attr__('你是我一生只会遇见一次的惊喜', 'akina') . ' ..." name="comment" class="commentbody" id="comment" rows="5" tabindex="4"></textarea><label class="input-label">你是我一生只会遇见一次的惊喜 ...</label></div>
|
||||||
<div id="upload-img-show"></div>
|
<div id="upload-img-show"></div>
|
||||||
<!--插入表情面版-->
|
<!--插入表情面版-->
|
||||||
<p id="emotion-toggle" class="no-select">
|
<p id="emotion-toggle" class="no-select">
|
||||||
|
|
|
@ -15,10 +15,14 @@ if ( akina_option('theme_skin') ) { ?>
|
||||||
|
|
||||||
#aplayer-float .aplayer-lrc-current { color: <?php echo akina_option('theme_skin'); ?> !important}
|
#aplayer-float .aplayer-lrc-current { color: <?php echo akina_option('theme_skin'); ?> !important}
|
||||||
|
|
||||||
.is-active-link::before {
|
.is-active-link::before, .commentbody:not(:placeholder-shown)~.input-label, .commentbody:focus~.input-label {
|
||||||
background-color: <?php echo akina_option('theme_skin'); ?> !important
|
background-color: <?php echo akina_option('theme_skin'); ?> !important
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.commentbody:focus {
|
||||||
|
border-color: <?php echo akina_option('theme_skin'); ?> !important
|
||||||
|
}
|
||||||
|
|
||||||
.insert-image-tips:hover, .insert-image-tips-hover{
|
.insert-image-tips:hover, .insert-image-tips-hover{
|
||||||
color: <?php echo akina_option('theme_skin'); ?>;
|
color: <?php echo akina_option('theme_skin'); ?>;
|
||||||
border: 1px solid <?php echo akina_option('theme_skin'); ?>
|
border: 1px solid <?php echo akina_option('theme_skin'); ?>
|
||||||
|
|
33
style.css
33
style.css
|
@ -3446,7 +3446,7 @@ a.page-numbers {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
color: #535a63;
|
color: #535a63;
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
background-color: rgba(255, 255, 255, 0)
|
background-color: transparent
|
||||||
}
|
}
|
||||||
|
|
||||||
.comment-respond textarea {
|
.comment-respond textarea {
|
||||||
|
@ -3454,10 +3454,39 @@ a.page-numbers {
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: right;
|
background-position: right;
|
||||||
background-color: rgba(255, 255, 255, 0);
|
|
||||||
resize: vertical
|
resize: vertical
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.comment-textarea {
|
||||||
|
position: relative
|
||||||
|
}
|
||||||
|
|
||||||
|
.commentbody:placeholder-shown::placeholder {
|
||||||
|
color: transparent
|
||||||
|
}
|
||||||
|
|
||||||
|
.commentbody:focus {
|
||||||
|
border-color: orange;
|
||||||
|
transition: border-color .25s
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-label {
|
||||||
|
position: absolute;
|
||||||
|
left: 16px;
|
||||||
|
top: 20px;
|
||||||
|
padding: 0 6px;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
pointer-events: none;
|
||||||
|
transition: all .25s
|
||||||
|
}
|
||||||
|
|
||||||
|
.commentbody:not(:placeholder-shown)~.input-label, .commentbody:focus~.input-label {
|
||||||
|
color: #fff;
|
||||||
|
background-color: orange;
|
||||||
|
transform: scale(.75) translate(-2px, -37px);
|
||||||
|
border-radius: 3px
|
||||||
|
}
|
||||||
|
|
||||||
.comment-respond .form-submit {
|
.comment-respond .form-submit {
|
||||||
clear: both;
|
clear: both;
|
||||||
display: block;
|
display: block;
|
||||||
|
|
Loading…
Reference in New Issue