style: Change modal size && change wording
This commit is contained in:
parent
8937e6580b
commit
214952bee4
1 changed files with 3 additions and 6 deletions
|
@ -19,7 +19,7 @@
|
||||||
<main>
|
<main>
|
||||||
{#if hasImpact === undefined}
|
{#if hasImpact === undefined}
|
||||||
<form transition:fade={{ delay: 0, duration: 300 }}>
|
<form transition:fade={{ delay: 0, duration: 300 }}>
|
||||||
<h1>Does this have impact?</h1>
|
<h1>Does count as "impact"?</h1>
|
||||||
|
|
||||||
<button on:click={() => (hasImpact = true)}>Yes</button>
|
<button on:click={() => (hasImpact = true)}>Yes</button>
|
||||||
<button on:click={() => (hasImpact = false)}>No</button>
|
<button on:click={() => (hasImpact = false)}>No</button>
|
||||||
|
@ -61,7 +61,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
height: 16rem;
|
height: auto;
|
||||||
width: 32rem;
|
width: 32rem;
|
||||||
|
|
||||||
max-width: calc(90% - 8rem);
|
max-width: calc(90% - 8rem);
|
||||||
|
@ -127,9 +127,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 480px) {
|
@media (min-width: 480px) {
|
||||||
main {
|
|
||||||
transform: translate(-50%, 25%);
|
|
||||||
}
|
|
||||||
form {
|
form {
|
||||||
grid-template-rows: repeat(3, 1fr);
|
grid-template-rows: repeat(3, 1fr);
|
||||||
}
|
}
|
||||||
|
@ -142,7 +139,7 @@
|
||||||
|
|
||||||
form {
|
form {
|
||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
grid-template-rows: repeat(2, 4em);
|
grid-template-rows: auto 4em;
|
||||||
|
|
||||||
grid-row: 1 / 1;
|
grid-row: 1 / 1;
|
||||||
grid-column: 1 / 1;
|
grid-column: 1 / 1;
|
||||||
|
|
Loading…
Reference in a new issue