49 lines
1.3 KiB
TypeScript
49 lines
1.3 KiB
TypeScript
import "./homePage.css";
|
|||
|
|
|
||
|
|
import * as React from "bloatless-react";
|
||
|
|
|
||
|
|
import { translations } from "./translations";
|
||
|
|
|
||
|
|
export function HomePage() {
|
||
|
|
return (
|
||
|
|
<article id="home-page">
|
||
|
|
<header>
|
||
|
|
<span>{translations.homePage.appName}</span>
|
||
|
|
</header>
|
||
|
|
<div>
|
||
|
|
<div id="overview-section">
|
||
|
|
<h2>{translations.homePage.overviewHeadline}</h2>
|
||
|
|
|
||
|
|
<div class="tile flex-no">
|
||
|
|
<span class="icon">cell_tower</span>
|
||
|
|
<div>
|
||
|
|
<h3>{translations.homePage.statusHeadline}</h3>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<button class="tile flex-no">
|
||
|
|
<span class="icon">settings</span>
|
||
|
|
<div>{translations.homePage.settingsButton}</div>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="chat-section">
|
||
|
|
<h2>{translations.homePage.chatsHeadline}</h2>
|
||
|
|
|
||
|
|
<div class="flex-row width-input">
|
||
|
|
<input
|
||
|
|
placeholder={translations.homePage.addChatPlaceholder}
|
||
|
|
aria-label={translations.homePage.addChatAudioLabel}
|
||
|
|
></input>
|
||
|
|
<button
|
||
|
|
class="primary"
|
||
|
|
aria-label={translations.homePage.addChatButton}
|
||
|
|
>
|
||
|
|
<span class="icon">add</span>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</article>
|
||
|
|
);
|
||
|
|
}
|