blob: 96f7134e18110a1e93256a4bf21fbd049fe14e61 [file] [log] [blame]
Yoshie Muranaka8d129102019-12-19 09:51:55 -08001<template>
Yoshie Muranakac11d3892020-02-19 08:07:40 -08002 <div class="page-section">
3 <h2 v-if="sectionTitle">{{ sectionTitle }}</h2>
Yoshie Muranaka8d129102019-12-19 09:51:55 -08004 <slot />
Yoshie Muranakac11d3892020-02-19 08:07:40 -08005 </div>
Yoshie Muranaka8d129102019-12-19 09:51:55 -08006</template>
7
8<script>
9export default {
10 name: 'PageSection',
Derick Montague09e45cd2020-01-23 15:45:57 -060011 props: {
12 sectionTitle: {
13 type: String,
Yoshie Muranakac11d3892020-02-19 08:07:40 -080014 default: ''
Derick Montague09e45cd2020-01-23 15:45:57 -060015 }
16 }
Yoshie Muranaka8d129102019-12-19 09:51:55 -080017};
18</script>
19
20<style lang="scss" scoped>
Derick Montague40865722020-04-13 17:01:19 -050021@import 'src/assets/styles/helpers';
22
Yoshie Muranaka8d129102019-12-19 09:51:55 -080023.page-section {
24 margin-bottom: $spacer * 2;
25}
Yoshie Muranakac11d3892020-02-19 08:07:40 -080026
Yoshie Muranaka8d129102019-12-19 09:51:55 -080027h2 {
Dixsie Wolmersbe88c612020-07-20 13:29:54 -050028 @include font-size($h3-font-size);
Yoshie Muranaka8d129102019-12-19 09:51:55 -080029 margin-bottom: $spacer;
30 &::after {
31 content: '';
32 display: block;
33 width: 100px;
Yoshie Muranaka01da8182020-07-08 15:46:43 -070034 border: 1px solid gray('300');
Yoshie Muranaka8d129102019-12-19 09:51:55 -080035 margin-top: 10px;
36 }
37}
38</style>