Improved input label positioning & export bugfix
This commit is contained in:
parent
a9a3a0a371
commit
9a4bff99c5
4 changed files with 11 additions and 7 deletions
|
@ -6,7 +6,7 @@
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
background-color: var(--synergy-btn-bg);
|
background-color: var(--synergy-btn-bg);
|
||||||
padding: 12px 20px;
|
padding: 9px 16px;
|
||||||
border: 0;
|
border: 0;
|
||||||
color: var(--synergy-text-color);
|
color: var(--synergy-text-color);
|
||||||
font: inherit;
|
font: inherit;
|
||||||
|
@ -20,6 +20,10 @@
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btn.btn-large {
|
||||||
|
padding: 12px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.btn:hover {
|
.btn:hover {
|
||||||
background-color: var(--synergy-btn-bg-hover);
|
background-color: var(--synergy-btn-bg-hover);
|
||||||
}
|
}
|
||||||
|
|
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
.inp label {
|
.inp label {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 11px;
|
top: 9px;
|
||||||
left: 7px;
|
left: 7px;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
|
@ -18,7 +18,7 @@
|
||||||
background: var(--synergy-bg);
|
background: var(--synergy-bg);
|
||||||
padding: 3px 8px;
|
padding: 3px 8px;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
line-height: 1;
|
line-height: 1.2rem;
|
||||||
color: var(--synergy-label);
|
color: var(--synergy-label);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -29,7 +29,8 @@
|
||||||
),
|
),
|
||||||
.inp :is(input, textarea):focus + label {
|
.inp :is(input, textarea):focus + label {
|
||||||
color: var(--synergy-label-active);
|
color: var(--synergy-label-active);
|
||||||
transform: translate3d(0, -21px, 0) scale(.8);
|
transform: scale(.8);
|
||||||
|
top: -.6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Common styles */
|
/* Common styles */
|
||||||
|
@ -37,7 +38,6 @@
|
||||||
.inp :is(input, textarea, select) {
|
.inp :is(input, textarea, select) {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 47px;
|
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
padding: 10px 12px;
|
padding: 10px 12px;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
|
|
|
@ -36,7 +36,7 @@ applyPreset(pr);
|
||||||
createApp({
|
createApp({
|
||||||
applyPreset(p: Preset) {
|
applyPreset(p: Preset) {
|
||||||
data.results = [];
|
data.results = [];
|
||||||
applyPreset(p);
|
data.theme = applyPreset(p);
|
||||||
},
|
},
|
||||||
async generateCSS() {
|
async generateCSS() {
|
||||||
data.results = await Exporter.get(data.theme);
|
data.results = await Exporter.get(data.theme);
|
||||||
|
|
|
@ -34,4 +34,4 @@ header h1 .color {background-clip: text; -webkit-background-clip: text; backgrou
|
||||||
|
|
||||||
.settings .close {width: 64px; height: 64px; cursor: pointer; padding: 20px; position: absolute; right: 0; top: 0; z-index: 10;}
|
.settings .close {width: 64px; height: 64px; cursor: pointer; padding: 20px; position: absolute; right: 0; top: 0; z-index: 10;}
|
||||||
|
|
||||||
.btn.btn-download small {font-weight: 400; font-size: 12px; display: block;}
|
.btn.btn-download small {font-weight: 400; font-size: 11px; display: block;}
|
Loading…
Reference in a new issue