Add base styles

This commit is contained in:
Vadim
2021-01-19 21:29:50 +03:00
parent 093127feb9
commit 175ef582f6
3 changed files with 65 additions and 9 deletions

View File

@@ -1,10 +1,44 @@
<script>
export let title = 'Hello';
/**
* Enable Next/Previos arrows
*/
export let arrows = true;
</script>
<main>
<h1>{title}</h1>
</main>
<div class="main-container">
{#if arrows}
<div class="side-container">
<span class="clickable">&lt;</span>
</div>
{/if}
<div class="content-container">
<slot></slot>
</div>
{#if arrows}
<div class="side-container">
<span class="clickable">&gt;</span>
</div>
{/if}
</div>
<style>
.main-container {
display: flex;
width: 100%;
}
.content-container {
flex: 1;
}
.side-container {
background-color: cornflowerblue;
height: 100%;
padding: 5px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
}
.clickable {
cursor: pointer;
}
</style>