mirror of
https://gitlab.com/PronounsPage/PronounsPage.git
synced 2025-10-22 05:43:18 -04:00
39 lines
1015 B
Vue
39 lines
1015 B
Vue
<template>
|
|
<div>
|
|
<div class="main-asides d-flex flex-column flex-xxl-row justify-content-center align-items-center align-items-xxl-start">
|
|
<aside class="aside-left">
|
|
<slot name="aside-left">
|
|
<AdPlaceholder phkey="aside-left-middle"/>
|
|
</slot>
|
|
</aside>
|
|
<main>
|
|
<slot/>
|
|
</main>
|
|
<aside class="aside-right">
|
|
<slot name="aside-right">
|
|
<AdPlaceholder phkey="aside-right-middle"/>
|
|
</slot>
|
|
</aside>
|
|
</div>
|
|
<div class="d-flex justify-content-center">
|
|
<main><slot name="below"></slot></main>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "assets/variables";
|
|
|
|
main, aside {
|
|
width: 100%;
|
|
max-width: $container-width;
|
|
padding: $spacer;
|
|
}
|
|
|
|
@include media-breakpoint-up('xxl', $grid-breakpoints) {
|
|
aside {
|
|
max-width: $aside-width;
|
|
}
|
|
}
|
|
</style>
|