jannik.menzel/iFSR-Sharepicgenerator
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added canvas-size selecta and logo-color select

Browse source
This commit is contained in:
Jannik Menzel 2025-02-01 17:05:13 +01:00
parent e2390a2146
commit 09e1fb0c6b
3 changed files with 185 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

60
css/styles.css
View file

@ -90,6 +90,46 @@ label {
font-weight: 600;
}
.hr {
border: 0;
border-top: 1px solid #ccc;
}
.form-grid {
display: grid;
grid-template-columns: 2fr 1fr;
gap: 10px 20px;
align-items: center;
max-width: 500px;
margin: auto;
}
.form-grid label {
text-align: left;
font-weight: 600;
}
.form-grid input[type="checkbox"] {
width: 20px;
height: 20px;
cursor: pointer;
justify-self: start;
}
.form-grid input[type="color"] {
width: 100%;
height: 40px;
border: none;
cursor: pointer;
}
.form-grid select {
width: 100%;
padding: 8px;
border-radius: 4px;
border: 1px solid #ccc;
}
textarea, input[type="file"], input[type="range"], input[type="checkbox"] {
padding: 12px 16px;
font-size: 16px;
@ -139,6 +179,7 @@ input[type="checkbox"] {
.preview {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
padding: 20px;
background-color: #fff;
@ -147,10 +188,25 @@ input[type="checkbox"] {
}
#canvas {
max-width: 100%;
max-height: 100%;
max-width: 90%;
max-height: 80vh;
width: 100%;
height: 100%;
border: 1px solid #ddd;
border-radius: 8px;
object-fit: contain;
flex: 1 1 auto;
}
.canvas-hint {
margin-top: 10px;
font-size: 14px;
color: #666;
text-align: center;
}
.canvas-hint p {
margin-bottom: 2px;
}
/* ========================