Skip to content

Commit dbdeee9

Browse files
committed
add columns
1 parent 605fcc5 commit dbdeee9

File tree

8 files changed

+91
-43
lines changed

8 files changed

+91
-43
lines changed

docs/assets/index-uf88RFse.js docs/assets/index-BVnGV-ih.js

+39-39
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/assets/index-BW0xLFLI.css

-1
This file was deleted.

docs/assets/index-CcbfNexT.css

+1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<link rel="icon" href="/favicon.ico" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
77
<title>RoboCon - Robot Framework Conference</title>
8-
<script type="module" crossorigin src="/assets/index-uf88RFse.js"></script>
9-
<link rel="stylesheet" crossorigin href="/assets/index-BW0xLFLI.css">
8+
<script type="module" crossorigin src="/assets/index-BVnGV-ih.js"></script>
9+
<link rel="stylesheet" crossorigin href="/assets/index-CcbfNexT.css">
1010
</head>
1111
<body>
1212
<div id="app"></div>

src/assets/css/grid.css

+4
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,10 @@
3535
position: sticky;
3636
}
3737

38+
.gap-sm {
39+
gap: var(--size-small);
40+
}
41+
3842
.row {
3943
box-sizing: border-box;
4044
display: -webkit-box;

src/components/SectionColumns.vue

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<template>
2+
<div class="columns-container row gap-sm mt-large">
3+
<div class="col-sm-12 col-md-6">
4+
<RichTextRenderer
5+
:document="left"
6+
:nodeRenderers="renderNodes()"
7+
:markRenderers="renderMarks()" />
8+
</div>
9+
<div class="col-sm-12 col-md-6">
10+
<RichTextRenderer
11+
:document="right"
12+
:nodeRenderers="renderNodes()"
13+
:markRenderers="renderMarks()" />
14+
</div>
15+
</div>
16+
</template>
17+
18+
<script setup lang="ts">
19+
import type { PropType } from 'vue';
20+
import type { Document } from "@contentful/rich-text-types";
21+
import RichTextRenderer from 'contentful-rich-text-vue-renderer';
22+
import { renderNodes, renderMarks } from 'Content/renderContent';
23+
24+
defineProps({
25+
left: Object as PropType<Document>,
26+
right: Object as PropType<Document>
27+
})
28+
</script>
29+
30+
<style scoped>
31+
@media screen and (min-width: 768px) {
32+
.columns-container {
33+
flex-wrap: nowrap;
34+
}
35+
}
36+
</style>

src/components/index.js

+2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Navbar from './Navbar.vue'
55
import NavMobile from './NavMobile.vue'
66
import PageSection from './PageSection.vue'
77
import SectionRow from './SectionRow.vue'
8+
import SectionColumns from './SectionColumns.vue'
89
import TabBox from './TabBox.vue'
910
import Sponsors from './Sponsors.vue'
1011
import TicketItem from './TicketItem.vue'
@@ -34,6 +35,7 @@ export {
3435
NavMobile,
3536
PageSection,
3637
SectionRow,
38+
SectionColumns,
3739
TabBox,
3840
Sponsors,
3941
TicketItem,

src/content/renderContent.ts

+7-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { Node } from '@contentful/rich-text-types';
22
import { documentToHtmlString } from '@contentful/rich-text-html-renderer';
33
import { endOfDay, isWithinInterval, startOfDay } from 'date-fns'
4-
import { PageSection, TicketItem, SponsorItem, SectionRow, Banner, CardItem } from 'Components'
4+
import { PageSection, TicketItem, SponsorItem, SectionRow, Banner, CardItem, SectionColumns } from 'Components'
55
import { h } from 'vue'
66
import type { Entry } from 'contentful';
77

@@ -13,6 +13,12 @@ export const renderNodes = () => {
1313
if (type === 'pageSection') {
1414
return h(PageSection, { content: node.data.target })
1515
}
16+
if (type === 'columns') {
17+
return h(SectionColumns, {
18+
left: node.data.target.fields.left,
19+
right: node.data.target.fields.right
20+
})
21+
}
1622
if (type === 'row') {
1723
return h(SectionRow, { content: node.data.target.fields.content, class: 'm-large pb-small' })
1824
}

0 commit comments

Comments
 (0)