touchup
This commit is contained in:
parent
a3cefdb627
commit
72823ed4c8
|
@ -1,5 +1,6 @@
|
|||
import { useState } from "react";
|
||||
import { tenseData } from "./tense-data";
|
||||
import Media from "react-media";
|
||||
|
||||
function SwitchPlayground() {
|
||||
const [state, setState] = useState<[boolean, boolean, boolean]>([false, false, false]);
|
||||
|
@ -44,9 +45,13 @@ function Switch({ state, toggle, label }: { label: [string, string], state: bool
|
|||
const border = "solid 2px black";
|
||||
return <div>
|
||||
<div>{label[0]}</div>
|
||||
<Media queries={{
|
||||
small: "(max-width: 599px)",
|
||||
}}>
|
||||
{matches => (
|
||||
<div className="clickable" onClick={toggle} style={{
|
||||
border,
|
||||
height: "8rem",
|
||||
height: matches.small ? "6rem" : "9rem",
|
||||
borderRadius,
|
||||
position: "relative",
|
||||
}}>
|
||||
|
@ -54,9 +59,9 @@ function Switch({ state, toggle, label }: { label: [string, string], state: bool
|
|||
border,
|
||||
borderRadius,
|
||||
height: "50%",
|
||||
width: "25%",
|
||||
width: "33%",
|
||||
top: "50%",
|
||||
transform: "translateY(-50%) translateX(150%)",
|
||||
transform: "translateY(-50%) translateX(105%)",
|
||||
position: "absolute",
|
||||
}}>
|
||||
<div
|
||||
|
@ -71,6 +76,8 @@ function Switch({ state, toggle, label }: { label: [string, string], state: bool
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Media>
|
||||
<div>{label[1]}</div>
|
||||
</div>
|
||||
}
|
||||
|
|
|
@ -101,11 +101,11 @@ We can use **any possible** combination of these 3 choices, giving us:
|
|||
Here's a chart of every possible combination of these choices, giving us all the basic verb forms:
|
||||
|
||||
<div style={{ overflowX: "auto", marginBottom: "1em" }}>
|
||||
<table class="table table-bordered table-striped" style={{ minWidth: "500px" }}>
|
||||
<table class="table table-bordered table-striped" style={{ minWidth: "425px" }}>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>form</th>
|
||||
<th scope="col">has 'ba'</th>
|
||||
<th scope="col">Has 'ba'</th>
|
||||
<th scope="col">Imperfective / Perfective</th>
|
||||
<th scope="col">Stem / Root</th>
|
||||
</tr>
|
||||
|
@ -114,21 +114,23 @@ Here's a chart of every possible combination of these choices, giving us all the
|
|||
{tenseData.map((t) => (
|
||||
<tr>
|
||||
<td>{t[0]}</td>
|
||||
<td>{t[1] ? "Y" : "N"}</td>
|
||||
<td>{t[2] ? "Imperfective" : "Perfective"}</td>
|
||||
<td>{t[3] ? "Stem" : "Root"}</td>
|
||||
<td>{t[1] ? "yes" : "no"}</td>
|
||||
<td>{t[2] ? <div><Video />{` `}imperfective</div> : <div><Camera />{` `}perfective</div>}</td>
|
||||
<td>{t[3] ? "stem" : "root"}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
Try the combinations yourself!
|
||||
Hit the switches to try the combinations yourself!
|
||||
|
||||
<SwitchPlayground />
|
||||
|
||||
## Imperative Forms
|
||||
|
||||
Imperative forms are slightly different...
|
||||
|
||||
<table class="table table-bordered">
|
||||
<thead>
|
||||
<tr>
|
||||
|
@ -167,11 +169,13 @@ Try the combinations yourself!
|
|||
|
||||
## Perfect Verb Forms
|
||||
|
||||
Perfect verb forms are built with:
|
||||
|
||||
<div className="my-3">
|
||||
<samp>past participle + equative</samp>
|
||||
</div>
|
||||
|
||||
Any of the <Link to="/equatives/other-equatives/#overview-of-8-equatives">8 equatives</Link> may be used. Equative may be left out with the present perfect form.
|
||||
Any of the <Link to="/equatives/other-equatives/#overview-of-8-equatives">8 equatives</Link> may be used to form 8 different <Link to="/verbs/all-perfect-verbs/">perfect froms</Link>. Equative may be left out with the present perfect form.
|
||||
|
||||
## Ability Verb Forms
|
||||
|
||||
|
|
Loading…
Reference in New Issue