add CloseButton to PageView
This commit is contained in:
@@ -1,5 +1,9 @@
|
||||
<template lang="html">
|
||||
<div class="page" :class="'page-' + slug">
|
||||
<div class="btn-close-wrapper">
|
||||
<button-close @click="$emit('close')" />
|
||||
</div>
|
||||
|
||||
<div class="page-wrapper" v-html="page.content" />
|
||||
</div>
|
||||
</template>
|
||||
@@ -58,6 +62,30 @@ export default {
|
||||
<style lang="scss">
|
||||
.page {
|
||||
font-size: 1rem;
|
||||
position: relative;
|
||||
|
||||
.btn-close-wrapper {
|
||||
position: sticky;
|
||||
z-index: 2;
|
||||
float: right;
|
||||
height: 0;
|
||||
right: 0;
|
||||
top: $node-view-spacer-sm-y;
|
||||
|
||||
@include media-breakpoint-up($size-bp) {
|
||||
top: $node-view-spacer-y;
|
||||
}
|
||||
|
||||
.btn-close {
|
||||
position: absolute;
|
||||
padding: 0.5rem;
|
||||
width: 2.25rem;
|
||||
height: 2.25rem;
|
||||
top: -.5rem;
|
||||
right: -.5rem;
|
||||
background-color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-up($size-bp) {
|
||||
font-size: 1.5rem;
|
||||
|
||||
Reference in New Issue
Block a user