updated preview to account for underlay

This commit is contained in:
Henry Jameson 2020-01-28 23:45:14 +02:00
parent 8462853269
commit e46bb94226
4 changed files with 112 additions and 96 deletions

View file

@ -31,9 +31,11 @@ h4 {
margin: auto;
min-height: 100vh;
max-width: 980px;
align-content: flex-start;
}
.underlay {
background-color: rgba(0,0,0,0.15);
background-color: var(--underlay, rgba(0,0,0,0.15));
align-content: flex-start;
}
.text-center {

View file

@ -78,7 +78,7 @@
</nav>
<div
id="content"
class="container"
class="container underlay"
>
<div class="sidebar-flexer mobile-hidden">
<div class="sidebar-bounds">

View file

@ -1,4 +1,6 @@
<template>
<div class="preview-container">
<div class="underlay underlay-preview"/>
<div class="panel dummy">
<div class="panel-heading">
<div class="title">
@ -98,4 +100,18 @@
</div>
</div>
</div>
</div>
</template>
<style lang="scss">
.preview-container {
position: relative;
}
.underlay-preview {
position: absolute;
top: 0;
bottom: 0;
left: 10px;
right: 10px;
}
</style>

View file

@ -116,9 +116,7 @@
</div>
</div>
<div class="preview-container">
<preview :style="previewRules" />
</div>
<keep-alive>
<tab-switcher key="style-tweak">