nidus-sync/html/template/sync/layout-test.html
2026-02-07 17:55:25 +00:00

77 lines
2.4 KiB
HTML

{{ template "sync/layout/authenticated.html" . }}
{{ define "title" }}Layout Test{{ end }}
{{ define "extraheader" }}
<style>
.bd-example {
padding: 1.5rem;
margin-right: 0;
margin-left: 0;
border-width: 1px;
border-top-left-radius: 0.25rem;
border-top-right-radius: 0.25rem;
}
</style>
{{ end }}
{{ define "content" }}
<!-- Main Content -->
<div id="content">
<div class="container-fluid">
<div class="row">
<div class="bd-example">
<button type="button" class="btn btn-primary">Primary</button>
<button type="button" class="btn btn-secondary">Secondary</button>
<button type="button" class="btn btn-success">Success</button>
<button type="button" class="btn btn-danger">Danger</button>
<button type="button" class="btn btn-warning">Warning</button>
<button type="button" class="btn btn-info">Info</button>
<button type="button" class="btn btn-light">Light</button>
<button type="button" class="btn btn-dark">Dark</button>
<button type="button" class="btn btn-link">Link</button>
</div>
<div class="col-md-6 mb-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Card 1</h5>
<p class="card-text">Some example content for the first card.</p>
</div>
</div>
</div>
<div class="col-md-6 mb-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Card 2</h5>
<p class="card-text">Some example content for the second card.</p>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="p-3 mb-3 bg-primary text-white">Primary</div>
<div class="p-3 mb-3 bg-primary-100 text-white">Primary-100</div>
<div class="p-3 mb-3 bg-primary-200 text-white">Primary-200</div>
<div class="p-3 mb-3 bg-primary-300 text-white">Primary-300</div>
</div>
<div class="col-md-4">
<div class="p-3 mb-3 bg-secondary text-white">Secondary</div>
</div>
<div class="col-md-4">
<div class="p-3 mb-3 bg-success text-white">Success</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="p-3 mb-3 bg-danger text-white">Danger</div>
</div>
<div class="col-md-4">
<div class="p-3 mb-3 bg-warning text-white">Warning</div>
</div>
<div class="col-md-4">
<div class="p-3 mb-3 bg-info text-white">Info</div>
</div>
</div>
</div>
{{ end }}