Untitled
unknown
plain_text
2 years ago
3.6 kB
2
Indexable
<style>
.invalid-input {
border-color: red;
}
.row > div {
margin-bottom: 10px;
}
.full-width {
width: 100%;
}
.carbon-result, .date-inputs {
display: flex;
justify-content: space-between;
}
.carbon-result > div, .date-inputs > div {
width: 49%;
}
</style>
<body>
<div class="container my-5">
<ul class="nav nav-tabs" id="inputTab" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="manual-tab" data-toggle="tab" href="#manual" role="tab" aria-controls="manual" aria-selected="true">Manual Input</a>
</li>
<li class="nav-item">
<a class="nav-link" id="file-tab" data-toggle="tab" href="#file" role="tab" aria-controls="file" aria-selected="false">File Import</a>
</li>
</ul>
<div class="tab-content" id="inputTabContent">
<div class="tab-pane fade show active" id="manual" role="tabpanel" aria-labelledby="manual-tab">
<div class="container my-5">
<!-- Form -->
<div class="container my-5">
<div class="form-group">
<div id="scope" class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn btn-outline-secondary">
<input type="radio" name="scope" value="1"> Scope 1
</label>
<label class="btn btn-outline-secondary">
<input type="radio" name="scope" value="2"> Scope 2
</label>
<label class="btn btn-outline-secondary">
<input type="radio" name="scope" value="3"> Scope 3
</label>
</div>
</div>
<div class="row">
<div class="col-4">
<label>Kategori</label>
<select id="category" class="form-control"></select>
</div>
<div class="col-4">
<label>Källa</label>
<select id="source" class="form-control"></select>
</div>
<div class="col-4">
<label>Koldioxidfaktor</label>
<input type="text" id="carbonfactor" class="form-control" disabled>
</div>
</div>
<div class="row">
<div id="unit-container" class="col-8">
<label id="unit-label">Inmatning</label>
<input type="text" id="unit" class="form-control">
</div>
<div id="unit2-container" class="col-4" style="display: none;">
<label id="unit-label2"></label>
<input type="text" id="unit2" class="form-control">
</div>
<div class="col-4">
<label>Resultat CO2e</label>
<input type="text" id="result" class="form-control" disabled>
</div>
</div>
<div class="row">
<div class="col-6">
<label for="dateFrom">Utsläpp från</label>
<input type="date" id="dateFrom" class="form-control">
</div>
<div class="col-6">
<label for="dateTo">Utsläpp till</label>
<input type="date" id="dateTo" class="form-control">
</div>
</div>
<div class="form-group">
<label>Comment</label>
<textarea class="form-control" id="comment" maxlength="250"></textarea>
<div class="d-flex justify-content-end">
<small id="charCount" class="form-text text-muted">0/250</small>
</div>
</div>
<button class="btn btn-primary" id="submit">Lägg till</button>
<button class="btn btn-outline-secondary" id="clear">Rensa</button>
</div>
</div>
<div class="tab-pane fade" id="file" role="tabpanel" aria-labelledby="file-tab">
</div>
</div>
</div>
</div>
</body>