Add an option background color of translation panel

This commit is contained in:
sienori 2017-12-28 01:20:39 +09:00
parent 5ff0780d1f
commit 5467ee3596
4 changed files with 26 additions and 2 deletions

View file

@ -112,6 +112,9 @@
"fontSizeLabel": {
"message": "Font size"
},
"bgColorLabel": {
"message": "Background color"
},
"informationLabel": {
"message": "Information"

View file

@ -188,7 +188,8 @@ input {
}
input[type="number"],
input[type="text"] {
input[type="text"],
input[type="color"] {
-moz-appearance: textfield;
width: 50px;
height: 30px;
@ -200,8 +201,10 @@ input[type="text"] {
input[type="number"]:hover,
input[type="text"]:hover,
input[type="color"]:hover,
input[type="number"]:focus,
input[type="text"]:focus {
input[type="text"]:focus,
input[type="color"]:focus {
border-color: var(--highlight);
}
@ -209,6 +212,11 @@ input[type="text"] {
width: 200px;
}
input[type="color"] {
background-color: var(--main-bg);
padding: 5px;
}
.button {
display: flex;
flex-direction: column;

View file

@ -242,6 +242,18 @@
</label>
</div>
</li>
<li class="optionContainer new">
<div class=optionText>
<p class=bgColorLabel>背景色</p>
</div>
<div class=optionForm>
<label>
<input id=bgColor class=saveByChange type=color value="#ffffff">
</label>
</div>
</li>
</ul>
</ul>
</li>

View file

@ -180,6 +180,7 @@ function panelPosition(e) {
panel.style.maxWidth = S.get().width + "px";
panel.style.maxHeight = S.get().height + "px";
panel.style.fontSize = S.get().fontSize + "px";
panel.style.backgroundColor = S.get().bgColor;
}