mikl/hollow-knight-silksong-completion-check
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

stylized Choose Save File button

Browse source
This commit is contained in:
ReznoRMichael 2021-07-20 14:32:11 +02:00
parent 0976c4426b
commit 227e906145
5 changed files with 41 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
build/index.html
View file

@ -183,7 +183,8 @@
<div class="input-buttons">
<!-- <input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*" onchange="LoadSaveFile(this);" onclick="this.value = '';"> -->
<input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*">
<input id="save-area-file" class="input-file" type="file" name="file" accept=".dat,.bak*">
<label for="save-area-file" class="button">Choose Save File</label>
</div>
<div class="input-buttons">

21
build/main.css
View file

@ -332,8 +332,17 @@ textarea::placeholder {
}
input[type="file"] {
max-width: 500px;
margin: 0.5rem 0.5rem 0.5rem 0.25rem;
/* max-width: 500px; */
/* margin: 0.5rem 0.5rem 0.5rem 0.25rem; */
}
.input-file {
width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}
#save-area {
@ -443,7 +452,8 @@ input[type="file"] {
cursor: pointer;
}
.button:focus {
.button:focus,
.input-file:focus + label {
/* outline: 2px solid #5e8dac; */
outline: 0;
border-color: #5e8dac;
@ -799,6 +809,11 @@ input[type="radio"] {
background: #000;
}
/* input[type="checkbox"]:focus + label,
input[type="radio"]:focus + label {
outline: solid 1px #aac7d4;
} */
.tooltip {
position: relative;
display: block;

2
build/main.css.map
View file

File diff suppressed because one or more lines are too long

21
src/css/style.css
View file

@ -225,8 +225,17 @@ textarea::placeholder {
}
input[type="file"] {
max-width: 500px;
margin: 0.5rem 0.5rem 0.5rem 0.25rem;
/* max-width: 500px; */
/* margin: 0.5rem 0.5rem 0.5rem 0.25rem; */
}
.input-file {
width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}
#save-area {
@ -336,7 +345,8 @@ input[type="file"] {
cursor: pointer;
}
.button:focus {
.button:focus,
.input-file:focus + label {
/* outline: 2px solid #5e8dac; */
outline: 0;
border-color: #5e8dac;
@ -692,6 +702,11 @@ input[type="radio"] {
background: #000;
}
/* input[type="checkbox"]:focus + label,
input[type="radio"]:focus + label {
outline: solid 1px #aac7d4;
} */
.tooltip {
position: relative;
display: block;

3
src/index.html
View file

@ -68,7 +68,8 @@
<div class="input-buttons">
<!-- <input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*" onchange="LoadSaveFile(this);" onclick="this.value = '';"> -->
<input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*">
<input id="save-area-file" class="input-file" type="file" name="file" accept=".dat,.bak*">
<label for="save-area-file" class="button">Choose Save File</label>
</div>
<div class="input-buttons">