<!DOCTYPE html>
|
<html lang="de">
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
|
<link href="./src/tv-size.css" rel="stylesheet">
|
<title>Wie groß ist mein Fernseher eigentlich</title>
|
</head>
|
<body>
|
<h1>Wie groß ist mein Fernseher eigentlich?</h1>
|
|
<div class="col-lg-6 offset-lg-3">
|
<p>Geben Sie die Aspect Ratio und das Diagonal des Fernsehers ein!</p>
|
|
<form>
|
<div class="row mb-3">
|
<label for="aspect-ratio" class="col-sm-3 col-form-label">Seitenverhältnis Breite zu Höhe</label>
|
<div class="col-sm-7">
|
<input type="text" class="form-control" id="aspect-ratio" placeholder="10:9" value="10:9">
|
</div>
|
</div>
|
<div class="row mb-3">
|
<label for="diagonal" class="col-sm-3 col-form-label">Diagonale</label>
|
<div class="col-sm-7">
|
<input type="number" step="1" class="form-control" id="diagonal" placeholder="27" value="27">
|
</div>
|
</div>
|
<div class="row mb-3">
|
<span class="col-sm-3">Größe</span>
|
<span class="col-sm-4" id="tv-width">Breite</span>
|
<span class="col-sm-5" id="tv-height">Höhe</span>
|
</div>
|
<div class="row mb-3">
|
<span id="error-msg" class="col-sm-12 no-error">Input error</span>
|
</div>
|
</form>
|
</div>
|
|
<script src="src/main.js" type="module"></script>
|
</body>
|
</html>
|
