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