├── .gitignore
├── .prettierignore
├── README.md
├── custom_types
├── homepage.json
├── index.json
├── menu.json
└── page.json
├── documents
├── en-us
│ ├── V6iFJSwAAFFHWrCe=#=W_bojBAAAKwNZkJm=#=menu=#=Wa58kCgAAC4AED7J=#=en-us=#=y.json
│ ├── V6s8QywAAKzDZY5V=#=W6JNhiIAAE31c04g=#=homepage=#=Wa58kCgAAC4AED7I=#=en-us=#=y.json
│ ├── V6tFSiwAAEvcZbJ8=#=W6JMjCIAAFj5c0mv=#=page=#=Wa58kCgAAC4AED7L=#=en-us=#=y.json
│ └── V6wyTywAAIbjaWcL=#=XGVuOBAAACIAFZZj=#=page=#=Wa58kCgAAC4AED7K=#=en-us=#=y.json
└── index.json
├── package-lock.json
├── package.json
├── public
├── _redirects
├── favicon.png
├── images
│ └── logo-prismic.svg
├── index.html
└── stylesheets
│ ├── common.css
│ ├── reset.css
│ └── style.css
└── src
├── App.js
├── components
├── Footer.js
├── Header.js
├── HomepageBanner.js
├── Layout.js
└── Loader.js
├── index.js
├── pages
├── HomePage.js
├── NotFound.js
├── Page.js
└── Preview.js
├── prismic.js
└── slices
├── FullWidthImage.js
├── ImageGallery.js
├── ImageHighlight.js
├── Quote.js
├── TextSection.js
└── index.js
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 |
6 | # testing
7 | /coverage
8 |
9 | # production
10 | /build
11 |
12 | # misc
13 | .DS_Store
14 | .env
15 | npm-debug.log*
16 | yarn-debug.log*
17 | yarn-error.log*
18 |
19 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | package-lock.json
2 | /documents/
3 | /custom_types/
4 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Prismic & React.js Example Multi-Page Site
2 |
3 | > [React.js](https://reactjs.org/) example Multi-Page Site with content managed in [Prismic](https://prismic.io)
4 |
5 | ## Check out the dedicated article to get this project up and running
6 |
7 | > [Prismic project guide](https://intercom.help/prismicio/en/articles/2731304-sample-multi-page-site-with-navigation-in-reactjs)
8 |
9 | ## Learn more about using Prismic with React.js
10 |
11 | [Prismic + React.js documentation](https://prismic.io/docs/technologies/reactjs).
12 |
13 | ## License
14 |
15 | This software is licensed under the Apache 2 license, quoted below.
16 |
17 | Copyright 2021 Prismic (http://prismic.io).
18 |
19 | Licensed under the Apache License, Version 2.0 (the "License"); you may not use this project except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
20 |
21 | Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
22 |
--------------------------------------------------------------------------------
/custom_types/homepage.json:
--------------------------------------------------------------------------------
1 | {
2 | "Main" : {
3 | "homepage_banner" : {
4 | "type" : "Group",
5 | "config" : {
6 | "fields" : {
7 | "title" : {
8 | "type" : "StructuredText",
9 | "config" : {
10 | "single" : "heading2",
11 | "label" : "Banner Title",
12 | "placeholder" : "Site Title..."
13 | }
14 | },
15 | "tagline" : {
16 | "type" : "StructuredText",
17 | "config" : {
18 | "single" : "paragraph",
19 | "label" : "Tagline",
20 | "placeholder" : "Site Tagline..."
21 | }
22 | },
23 | "button_link" : {
24 | "type" : "Link",
25 | "config" : {
26 | "label" : "Button Link"
27 | }
28 | },
29 | "image" : {
30 | "type" : "Image",
31 | "config" : {
32 | "constraint" : {
33 | "width" : 2000,
34 | "height" : null
35 | },
36 | "thumbnails" : [ ],
37 | "label" : "Banner Image"
38 | }
39 | },
40 | "button_label" : {
41 | "type" : "StructuredText",
42 | "config" : {
43 | "single" : "paragraph",
44 | "label" : "Button Label"
45 | }
46 | }
47 | },
48 | "label" : "Homepage Banner",
49 | "repeat" : false
50 | }
51 | },
52 | "page_content" : {
53 | "type" : "Slices",
54 | "fieldset" : "Slice zone",
55 | "config" : {
56 | "labels" : {
57 | "text_section" : [ {
58 | "name" : "1col",
59 | "display" : "1 Column"
60 | }, {
61 | "name" : "2col",
62 | "display" : "2 Columns"
63 | } ]
64 | },
65 | "choices" : {
66 | "text_section" : {
67 | "type" : "Slice",
68 | "fieldset" : "Text Section",
69 | "description" : "Simple text section with either one or two columns",
70 | "icon" : "text_fields",
71 | "non-repeat" : {
72 | "rich_text" : {
73 | "type" : "StructuredText",
74 | "config" : {
75 | "multi" : "paragraph, preformatted, heading1, heading2, heading3, heading4, heading5, heading6, strong, em, hyperlink, image, embed, list-item, o-list-item, o-list-item",
76 | "label" : "Rich Text",
77 | "placeholder" : "Text..."
78 | }
79 | }
80 | },
81 | "repeat" : { }
82 | },
83 | "quote" : {
84 | "type" : "Slice",
85 | "fieldset" : "Quote",
86 | "description" : "A stylized quote",
87 | "icon" : "format_quote",
88 | "non-repeat" : {
89 | "quote_text" : {
90 | "type" : "StructuredText",
91 | "config" : {
92 | "single" : "paragraph",
93 | "label" : "Quote Text"
94 | }
95 | }
96 | },
97 | "repeat" : { }
98 | },
99 | "full_width_image" : {
100 | "type" : "Slice",
101 | "fieldset" : "Full Width Image",
102 | "description" : "A wide, thin image",
103 | "icon" : "broken_image",
104 | "non-repeat" : {
105 | "image" : {
106 | "type" : "Image",
107 | "config" : {
108 | "constraint" : {
109 | "width" : 980,
110 | "height" : 300
111 | },
112 | "thumbnails" : [ ],
113 | "label" : "Image"
114 | }
115 | }
116 | },
117 | "repeat" : { }
118 | },
119 | "image_gallery" : {
120 | "type" : "Slice",
121 | "fieldset" : "Image Gallery",
122 | "description" : "A collection of images, each with a description and an optional link",
123 | "icon" : "image",
124 | "non-repeat" : {
125 | "gallery_title" : {
126 | "type" : "StructuredText",
127 | "config" : {
128 | "single" : "heading2, heading3",
129 | "label" : "Gallery Title",
130 | "placeholder" : "Image Gallery Title..."
131 | }
132 | }
133 | },
134 | "repeat" : {
135 | "image_description" : {
136 | "type" : "StructuredText",
137 | "config" : {
138 | "single" : "paragraph",
139 | "label" : "Image Description",
140 | "placeholder" : "Image description..."
141 | }
142 | },
143 | "link" : {
144 | "type" : "Link",
145 | "config" : {
146 | "label" : "Link",
147 | "placeholder" : "Optional Link"
148 | }
149 | },
150 | "link_label" : {
151 | "type" : "StructuredText",
152 | "config" : {
153 | "single" : "paragraph",
154 | "label" : "Link Label",
155 | "placeholder" : "Optional Link Label"
156 | }
157 | },
158 | "image" : {
159 | "type" : "Image",
160 | "config" : {
161 | "constraint" : {
162 | "width" : 727,
163 | "height" : 402
164 | },
165 | "thumbnails" : [ ],
166 | "label" : "Image"
167 | }
168 | }
169 | }
170 | },
171 | "image_highlight" : {
172 | "type" : "Slice",
173 | "fieldset" : "Image Highlight",
174 | "description" : "A section to highlight an image with title, text, and optional link",
175 | "icon" : "star",
176 | "non-repeat" : {
177 | "featured_image" : {
178 | "type" : "Image",
179 | "config" : {
180 | "constraint" : {
181 | "width" : 727,
182 | "height" : 402
183 | },
184 | "thumbnails" : [ ],
185 | "label" : "Featured Image"
186 | }
187 | },
188 | "title" : {
189 | "type" : "StructuredText",
190 | "config" : {
191 | "single" : "heading2",
192 | "label" : "Image Title",
193 | "placeholder" : "Featured Title..."
194 | }
195 | },
196 | "headline" : {
197 | "type" : "StructuredText",
198 | "config" : {
199 | "single" : "heading3",
200 | "label" : "Image Headline",
201 | "placeholder" : "Featured Headline..."
202 | }
203 | },
204 | "link" : {
205 | "type" : "Link",
206 | "config" : {
207 | "label" : "Featured Link",
208 | "placeholder" : "Optional Link"
209 | }
210 | },
211 | "link_label" : {
212 | "type" : "StructuredText",
213 | "config" : {
214 | "single" : "paragraph",
215 | "label" : "Featured Link Label",
216 | "placeholder" : "Optional Link Label"
217 | }
218 | }
219 | },
220 | "repeat" : { }
221 | }
222 | }
223 | }
224 | }
225 | }
226 | }
--------------------------------------------------------------------------------
/custom_types/index.json:
--------------------------------------------------------------------------------
1 | [
2 | {
3 | "id": "homepage",
4 | "name": "Homepage",
5 | "repeatable": false,
6 | "value": "homepage.json"
7 | },
8 | {
9 | "id": "page",
10 | "name": "Page",
11 | "repeatable": true,
12 | "value": "page.json"
13 | },
14 | {
15 | "id": "menu",
16 | "name": "Menu",
17 | "repeatable": false,
18 | "value": "menu.json"
19 | }
20 | ]
--------------------------------------------------------------------------------
/custom_types/menu.json:
--------------------------------------------------------------------------------
1 | {
2 | "Main" : {
3 | "title" : {
4 | "type" : "StructuredText",
5 | "config" : {
6 | "placeholder" : "Menu title...",
7 | "single" : "heading1"
8 | }
9 | },
10 | "menu_links" : {
11 | "type" : "Group",
12 | "config" : {
13 | "fields" : {
14 | "label" : {
15 | "type" : "StructuredText",
16 | "config" : {
17 | "single" : "paragraph",
18 | "label" : "Link Label",
19 | "placeholder" : "Link Label..."
20 | }
21 | },
22 | "link" : {
23 | "type" : "Link",
24 | "config" : {
25 | "label" : "Link",
26 | "placeholder" : "Select a Link..."
27 | }
28 | }
29 | },
30 | "label" : "Menu Links"
31 | }
32 | }
33 | }
34 | }
--------------------------------------------------------------------------------
/custom_types/page.json:
--------------------------------------------------------------------------------
1 | {
2 | "Main" : {
3 | "uid" : {
4 | "type" : "UID",
5 | "config" : {
6 | "placeholder" : "meaningful-unique-identifier...",
7 | "label" : "Unique ID"
8 | }
9 | },
10 | "page_content" : {
11 | "type" : "Slices",
12 | "fieldset" : "Slice zone",
13 | "config" : {
14 | "labels" : {
15 | "text_section" : [ {
16 | "name" : "1col",
17 | "display" : "1 Column"
18 | }, {
19 | "name" : "2col",
20 | "display" : "2 Columns"
21 | } ]
22 | },
23 | "choices" : {
24 | "text_section" : {
25 | "type" : "Slice",
26 | "fieldset" : "Text Section",
27 | "description" : "Simple text section with either one or two columns",
28 | "icon" : "text_fields",
29 | "non-repeat" : {
30 | "rich_text" : {
31 | "type" : "StructuredText",
32 | "config" : {
33 | "multi" : "paragraph, preformatted, heading1, heading2, heading3, heading4, heading5, heading6, strong, em, hyperlink, image, embed, list-item, o-list-item, o-list-item",
34 | "label" : "Rich Text",
35 | "placeholder" : "Text..."
36 | }
37 | }
38 | },
39 | "repeat" : { }
40 | },
41 | "quote" : {
42 | "type" : "Slice",
43 | "fieldset" : "Quote",
44 | "description" : "A stylized quote",
45 | "icon" : "format_quote",
46 | "non-repeat" : {
47 | "quote_text" : {
48 | "type" : "StructuredText",
49 | "config" : {
50 | "single" : "paragraph",
51 | "label" : "Quote Text"
52 | }
53 | }
54 | },
55 | "repeat" : { }
56 | },
57 | "full_width_image" : {
58 | "type" : "Slice",
59 | "fieldset" : "Full Width Image",
60 | "description" : "A wide, thin image",
61 | "icon" : "broken_image",
62 | "non-repeat" : {
63 | "image" : {
64 | "type" : "Image",
65 | "config" : {
66 | "constraint" : {
67 | "width" : 980,
68 | "height" : 300
69 | },
70 | "thumbnails" : [ ],
71 | "label" : "Image"
72 | }
73 | }
74 | },
75 | "repeat" : { }
76 | },
77 | "image_gallery" : {
78 | "type" : "Slice",
79 | "fieldset" : "Image Gallery",
80 | "description" : "A collection of images, each with a description and an optional link",
81 | "icon" : "image",
82 | "non-repeat" : {
83 | "gallery_title" : {
84 | "type" : "StructuredText",
85 | "config" : {
86 | "single" : "heading2, heading3",
87 | "label" : "Gallery Title",
88 | "placeholder" : "Image Gallery Title..."
89 | }
90 | }
91 | },
92 | "repeat" : {
93 | "image_description" : {
94 | "type" : "StructuredText",
95 | "config" : {
96 | "single" : "paragraph",
97 | "label" : "Image Description",
98 | "placeholder" : "Image description..."
99 | }
100 | },
101 | "link" : {
102 | "type" : "Link",
103 | "config" : {
104 | "label" : "Link",
105 | "placeholder" : "Optional Link"
106 | }
107 | },
108 | "link_label" : {
109 | "type" : "StructuredText",
110 | "config" : {
111 | "single" : "paragraph",
112 | "label" : "Link Label",
113 | "placeholder" : "Optional Link Label"
114 | }
115 | },
116 | "image" : {
117 | "type" : "Image",
118 | "config" : {
119 | "constraint" : {
120 | "width" : 727,
121 | "height" : 402
122 | },
123 | "thumbnails" : [ ],
124 | "label" : "Image"
125 | }
126 | }
127 | }
128 | },
129 | "image_highlight" : {
130 | "type" : "Slice",
131 | "fieldset" : "Image Highlight",
132 | "description" : "A section to highlight an image with title, text, and optional link",
133 | "icon" : "star",
134 | "non-repeat" : {
135 | "featured_image" : {
136 | "type" : "Image",
137 | "config" : {
138 | "constraint" : {
139 | "width" : 727,
140 | "height" : 402
141 | },
142 | "thumbnails" : [ ],
143 | "label" : "Featured Image"
144 | }
145 | },
146 | "title" : {
147 | "type" : "StructuredText",
148 | "config" : {
149 | "single" : "heading2",
150 | "label" : "Image Title",
151 | "placeholder" : "Featured Title..."
152 | }
153 | },
154 | "headline" : {
155 | "type" : "StructuredText",
156 | "config" : {
157 | "single" : "heading3",
158 | "label" : "Image Headline",
159 | "placeholder" : "Featured Headline..."
160 | }
161 | },
162 | "link" : {
163 | "type" : "Link",
164 | "config" : {
165 | "label" : "Featured Link",
166 | "placeholder" : "Optional Link"
167 | }
168 | },
169 | "link_label" : {
170 | "type" : "StructuredText",
171 | "config" : {
172 | "single" : "paragraph",
173 | "label" : "Featured Link Label",
174 | "placeholder" : "Optional Link Label"
175 | }
176 | }
177 | },
178 | "repeat" : { }
179 | }
180 | }
181 | }
182 | }
183 | }
184 | }
--------------------------------------------------------------------------------
/documents/en-us/V6iFJSwAAFFHWrCe=#=W_bojBAAAKwNZkJm=#=menu=#=Wa58kCgAAC4AED7J=#=en-us=#=y.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": [
3 | {
4 | "type": "heading1",
5 | "content": { "text": "Main Navigation", "spans": [] }
6 | }
7 | ],
8 | "menu_links": [
9 | {
10 | "label": [
11 | { "type": "paragraph", "content": { "text": "Home", "spans": [] } }
12 | ],
13 | "link": {
14 | "id": "V6s8QywAAKzDZY5V",
15 | "mask": "homepage",
16 | "wioUrl": "wio://documents/V6s8QywAAKzDZY5V"
17 | }
18 | },
19 | {
20 | "label": [
21 | { "type": "paragraph", "content": { "text": "About", "spans": [] } }
22 | ],
23 | "link": {
24 | "id": "V6tFSiwAAEvcZbJ8",
25 | "mask": "page",
26 | "wioUrl": "wio://documents/V6tFSiwAAEvcZbJ8"
27 | }
28 | },
29 | {
30 | "label": [
31 | { "type": "paragraph", "content": { "text": "More Info", "spans": [] } }
32 | ],
33 | "link": {
34 | "id": "V6wyTywAAIbjaWcL",
35 | "mask": "page",
36 | "wioUrl": "wio://documents/V6wyTywAAIbjaWcL"
37 | }
38 | }
39 | ],
40 | "title_TYPE": "StructuredText",
41 | "title_POSITION": 0,
42 | "menu_links_TYPE": "Group",
43 | "menu_links_POSITION": 1,
44 | "menu_links.label_TYPE": "StructuredText",
45 | "menu_links.label_POSITION": 2,
46 | "menu_links.link_TYPE": "Link",
47 | "menu_links.link_POSITION": 3,
48 | "slugs_INTERNAL": ["main-navigation"],
49 | "uids_INTERNAL": ["main-nav"]
50 | }
51 |
--------------------------------------------------------------------------------
/documents/en-us/V6s8QywAAKzDZY5V=#=W6JNhiIAAE31c04g=#=homepage=#=Wa58kCgAAC4AED7I=#=en-us=#=y.json:
--------------------------------------------------------------------------------
1 | {
2 | "homepage_banner_TYPE": "Group",
3 | "homepage_banner_POSITION": 0,
4 | "homepage_banner.title_TYPE": "StructuredText",
5 | "homepage_banner.title_POSITION": 1,
6 | "homepage_banner.tagline_TYPE": "StructuredText",
7 | "homepage_banner.tagline_POSITION": 2,
8 | "homepage_banner.button_link_TYPE": "Link",
9 | "homepage_banner.button_link_POSITION": 3,
10 | "homepage_banner.image_TYPE": "Image",
11 | "homepage_banner.image_POSITION": 4,
12 | "homepage_banner.button_label_TYPE": "StructuredText",
13 | "homepage_banner.button_label_POSITION": 5,
14 | "page_content_TYPE": "Slices",
15 | "page_content_POSITION": 6,
16 | "page_content.text_section_TYPE": "Slice",
17 | "page_content.text_section_POSITION": 7,
18 | "page_content.text_section.non-repeat.rich_text_TYPE": "StructuredText",
19 | "page_content.text_section.non-repeat.rich_text_POSITION": 8,
20 | "page_content.quote_TYPE": "Slice",
21 | "page_content.quote_POSITION": 9,
22 | "page_content.quote.non-repeat.quote_text_TYPE": "StructuredText",
23 | "page_content.quote.non-repeat.quote_text_POSITION": 10,
24 | "page_content.full_width_image_TYPE": "Slice",
25 | "page_content.full_width_image_POSITION": 11,
26 | "page_content.full_width_image.non-repeat.image_TYPE": "Image",
27 | "page_content.full_width_image.non-repeat.image_POSITION": 12,
28 | "page_content.image_gallery_TYPE": "Slice",
29 | "page_content.image_gallery_POSITION": 13,
30 | "page_content.image_gallery.non-repeat.gallery_title_TYPE": "StructuredText",
31 | "page_content.image_gallery.non-repeat.gallery_title_POSITION": 14,
32 | "page_content.image_gallery.repeat.image_description_TYPE": "StructuredText",
33 | "page_content.image_gallery.repeat.image_description_POSITION": 15,
34 | "page_content.image_gallery.repeat.link_TYPE": "Link",
35 | "page_content.image_gallery.repeat.link_POSITION": 16,
36 | "page_content.image_gallery.repeat.link_label_TYPE": "StructuredText",
37 | "page_content.image_gallery.repeat.link_label_POSITION": 17,
38 | "page_content.image_gallery.repeat.image_TYPE": "Image",
39 | "page_content.image_gallery.repeat.image_POSITION": 18,
40 | "page_content.image_highlight_TYPE": "Slice",
41 | "page_content.image_highlight_POSITION": 19,
42 | "page_content.image_highlight.non-repeat.featured_image_TYPE": "Image",
43 | "page_content.image_highlight.non-repeat.featured_image_POSITION": 20,
44 | "page_content.image_highlight.non-repeat.title_TYPE": "StructuredText",
45 | "page_content.image_highlight.non-repeat.title_POSITION": 21,
46 | "page_content.image_highlight.non-repeat.headline_TYPE": "StructuredText",
47 | "page_content.image_highlight.non-repeat.headline_POSITION": 22,
48 | "page_content.image_highlight.non-repeat.link_TYPE": "Link",
49 | "page_content.image_highlight.non-repeat.link_POSITION": 23,
50 | "page_content.image_highlight.non-repeat.link_label_TYPE": "StructuredText",
51 | "page_content.image_highlight.non-repeat.link_label_POSITION": 24,
52 | "slugs_INTERNAL": ["john-doe", "john-doe---zz2", "john-doe---zz"],
53 | "homepage_banner": [
54 | {
55 | "title": [
56 | { "type": "heading2", "content": { "text": "John Doe", "spans": [] } }
57 | ],
58 | "tagline": [
59 | {
60 | "type": "paragraph",
61 | "content": {
62 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede asdf.",
63 | "spans": []
64 | }
65 | }
66 | ],
67 | "button_link": {
68 | "id": "V6tFSiwAAEvcZbJ8",
69 | "mask": "page",
70 | "wioUrl": "wio://documents/V6tFSiwAAEvcZbJ8"
71 | },
72 | "button_label": [
73 | {
74 | "type": "paragraph",
75 | "content": { "text": "Learn More", "spans": [] }
76 | }
77 | ],
78 | "image": {
79 | "origin": {
80 | "id": "V6s-6SwAAKzDZZj0",
81 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2F8ecfe46c-11f6-481b-afca-c938fade6eff_home-banner.jpg",
82 | "width": 4896,
83 | "height": 3264
84 | },
85 | "width": 2000,
86 | "height": 1333,
87 | "edit": {
88 | "background": "#fff",
89 | "zoom": 0.4084967320261438,
90 | "crop": { "x": 0, "y": 0 }
91 | },
92 | "credits": null,
93 | "alt": null,
94 | "thumbnails": {},
95 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/444aea05b807d1fd864ef9f88903ad94006d4d28_home-banner.jpg"
96 | }
97 | }
98 | ],
99 | "page_content": [
100 | {
101 | "key": "text_section$29feaaa1-9c66-4ca7-a6ca-7a0b313eba0a",
102 | "value": {
103 | "repeat": [{}],
104 | "non-repeat": {
105 | "rich_text": [
106 | {
107 | "type": "heading1",
108 | "content": {
109 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit.",
110 | "spans": []
111 | }
112 | },
113 | {
114 | "type": "paragraph",
115 | "content": {
116 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.",
117 | "spans": []
118 | }
119 | },
120 | {
121 | "type": "paragraph",
122 | "content": {
123 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.",
124 | "spans": []
125 | }
126 | },
127 | {
128 | "type": "paragraph",
129 | "content": {
130 | "text": "Morbi in sem quis dui placerat ornare. Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu. Cras consequat.",
131 | "spans": []
132 | }
133 | }
134 | ]
135 | }
136 | },
137 | "label": "2col"
138 | },
139 | {
140 | "key": "full_width_image$29cf89c7-b81f-494c-958b-2a264b518d37",
141 | "value": {
142 | "repeat": [{}],
143 | "non-repeat": {
144 | "image": {
145 | "origin": {
146 | "id": "V6s8XSwAAKzDZY6_",
147 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2Fd2648aad-b789-4600-b015-9e2239d89ac7_home-full-width.jpeg",
148 | "width": 3396,
149 | "height": 2000
150 | },
151 | "width": 980,
152 | "height": 300,
153 | "edit": {
154 | "background": "#fff",
155 | "zoom": 0.28857479387514723,
156 | "crop": { "x": 0, "y": -139 }
157 | },
158 | "credits": null,
159 | "alt": "Alt text example",
160 | "thumbnails": {},
161 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/d9d90363391c0232c26ce46d69571a24d76d5975_home-full-width.jpeg"
162 | }
163 | }
164 | }
165 | },
166 | {
167 | "key": "image_highlight$1e18e9b0-b4b6-425a-a7d3-38c6da6229d1",
168 | "value": {
169 | "repeat": [{}],
170 | "non-repeat": {
171 | "title": [
172 | {
173 | "type": "heading2",
174 | "content": {
175 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit.",
176 | "spans": []
177 | }
178 | }
179 | ],
180 | "headline": [
181 | {
182 | "type": "heading3",
183 | "content": {
184 | "text": "Donec nec justo eget felis facilisis fermentum hendrerit. Phasellu aliquet nibh nec urna.",
185 | "spans": []
186 | }
187 | }
188 | ],
189 | "link": {
190 | "id": "V6tFSiwAAEvcZbJ8",
191 | "mask": "page",
192 | "wioUrl": "wio://documents/V6tFSiwAAEvcZbJ8"
193 | },
194 | "link_label": [
195 | {
196 | "type": "paragraph",
197 | "content": { "text": "LEARN MORE", "spans": [] }
198 | }
199 | ],
200 | "featured_image": {
201 | "origin": {
202 | "id": "V6s8pywAAMBbZY_o",
203 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2F6f306737-c5ef-4761-a643-cd4025995a15_page-mountains.jpeg",
204 | "width": 3872,
205 | "height": 2592
206 | },
207 | "width": 727,
208 | "height": 402,
209 | "edit": {
210 | "background": "#fff",
211 | "zoom": 0.22175826446280994,
212 | "crop": { "x": -90, "y": -26 }
213 | },
214 | "credits": null,
215 | "alt": "Alt text example",
216 | "thumbnails": {},
217 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/1c33e836ffe56168eea4294ec7c3539bb5eb055b_page-mountains.jpeg"
218 | }
219 | }
220 | }
221 | },
222 | {
223 | "key": "text_section$96e2fdb1-4ba7-45f8-84ef-e4db9b8351d7",
224 | "value": {
225 | "repeat": [{}],
226 | "non-repeat": {
227 | "rich_text": [
228 | {
229 | "type": "paragraph",
230 | "content": {
231 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti.",
232 | "spans": []
233 | }
234 | },
235 | {
236 | "type": "paragraph",
237 | "content": {
238 | "text": "Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis.",
239 | "spans": []
240 | }
241 | }
242 | ]
243 | }
244 | },
245 | "label": "2col"
246 | }
247 | ],
248 | "uids_INTERNAL": ["homepage"]
249 | }
250 |
--------------------------------------------------------------------------------
/documents/en-us/V6tFSiwAAEvcZbJ8=#=W6JMjCIAAFj5c0mv=#=page=#=Wa58kCgAAC4AED7L=#=en-us=#=y.json:
--------------------------------------------------------------------------------
1 | {
2 | "uid": "about",
3 | "uid_TYPE": "UID",
4 | "uid_POSITION": 0,
5 | "page_content_TYPE": "Slices",
6 | "page_content_POSITION": 1,
7 | "page_content.text_section_TYPE": "Slice",
8 | "page_content.text_section_POSITION": 2,
9 | "page_content.text_section.non-repeat.rich_text_TYPE": "StructuredText",
10 | "page_content.text_section.non-repeat.rich_text_POSITION": 3,
11 | "page_content.quote_TYPE": "Slice",
12 | "page_content.quote_POSITION": 4,
13 | "page_content.quote.non-repeat.quote_text_TYPE": "StructuredText",
14 | "page_content.quote.non-repeat.quote_text_POSITION": 5,
15 | "page_content.full_width_image_TYPE": "Slice",
16 | "page_content.full_width_image_POSITION": 6,
17 | "page_content.full_width_image.non-repeat.image_TYPE": "Image",
18 | "page_content.full_width_image.non-repeat.image_POSITION": 7,
19 | "page_content.image_gallery_TYPE": "Slice",
20 | "page_content.image_gallery_POSITION": 8,
21 | "page_content.image_gallery.non-repeat.gallery_title_TYPE": "StructuredText",
22 | "page_content.image_gallery.non-repeat.gallery_title_POSITION": 9,
23 | "page_content.image_gallery.repeat.image_description_TYPE": "StructuredText",
24 | "page_content.image_gallery.repeat.image_description_POSITION": 10,
25 | "page_content.image_gallery.repeat.link_TYPE": "Link",
26 | "page_content.image_gallery.repeat.link_POSITION": 11,
27 | "page_content.image_gallery.repeat.link_label_TYPE": "StructuredText",
28 | "page_content.image_gallery.repeat.link_label_POSITION": 12,
29 | "page_content.image_gallery.repeat.image_TYPE": "Image",
30 | "page_content.image_gallery.repeat.image_POSITION": 13,
31 | "page_content.image_highlight_TYPE": "Slice",
32 | "page_content.image_highlight_POSITION": 14,
33 | "page_content.image_highlight.non-repeat.featured_image_TYPE": "Image",
34 | "page_content.image_highlight.non-repeat.featured_image_POSITION": 15,
35 | "page_content.image_highlight.non-repeat.title_TYPE": "StructuredText",
36 | "page_content.image_highlight.non-repeat.title_POSITION": 16,
37 | "page_content.image_highlight.non-repeat.headline_TYPE": "StructuredText",
38 | "page_content.image_highlight.non-repeat.headline_POSITION": 17,
39 | "page_content.image_highlight.non-repeat.link_TYPE": "Link",
40 | "page_content.image_highlight.non-repeat.link_POSITION": 18,
41 | "page_content.image_highlight.non-repeat.link_label_TYPE": "StructuredText",
42 | "page_content.image_highlight.non-repeat.link_label_POSITION": 19,
43 | "slugs_INTERNAL": [
44 | "about-us",
45 | "lorem-ipsum-dolor-sit-amet-consectetuer-adipiscing-elit.-zz",
46 | "lorem-ipsum-dolor-sit-amet-consectetuer-adipiscing-elit.",
47 | "lorem-ipsum-dolor-sit-amet-consectetuer-adipiscing-elit.-changesz",
48 | "lorem-ipsum-dolor-sit-amet-consectetuer-adipiscing-elit.-changes",
49 | "lorem-ipsum-dolor-sit-amet-consectetuer-adipiscing-elit.-zzz"
50 | ],
51 | "page_content": [
52 | {
53 | "key": "full_width_image$cf8864eb-9900-475f-9772-d1820caaca01",
54 | "value": {
55 | "repeat": [{}],
56 | "non-repeat": {
57 | "image": {
58 | "origin": {
59 | "id": "V6s8XSwAAKzDZY6_",
60 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2Fd2648aad-b789-4600-b015-9e2239d89ac7_home-full-width.jpeg",
61 | "width": 3396,
62 | "height": 2000
63 | },
64 | "width": 980,
65 | "height": 300,
66 | "edit": {
67 | "background": "#fff",
68 | "zoom": 0.28857479387514723,
69 | "crop": { "x": 0, "y": -139 }
70 | },
71 | "credits": null,
72 | "alt": "Alt text example",
73 | "thumbnails": {},
74 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/d9d90363391c0232c26ce46d69571a24d76d5975_home-full-width.jpeg"
75 | }
76 | }
77 | }
78 | },
79 | {
80 | "key": "text_section$30f7a9b5-c3d7-49e0-88f8-11df2d0bf028",
81 | "value": {
82 | "repeat": [{}],
83 | "non-repeat": {
84 | "rich_text": [
85 | {
86 | "type": "heading1",
87 | "content": { "text": "About Us", "spans": [] }
88 | },
89 | {
90 | "type": "paragraph",
91 | "content": {
92 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.",
93 | "spans": []
94 | }
95 | }
96 | ]
97 | }
98 | },
99 | "label": "2col"
100 | },
101 | {
102 | "key": "text_section$905728cd-d10d-4826-ba80-afeb40636fc6",
103 | "value": {
104 | "repeat": [{}],
105 | "non-repeat": {
106 | "rich_text": [
107 | {
108 | "type": "paragraph",
109 | "content": {
110 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi. Sed pretium, ligula sollicitudin laoreet viverra, tortor libero sodales leo, eget blandit nunc tortor eu nibh. Nullam mollis. Ut justo. Suspendisse potenti. Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante. Vivamus imperdiet nibh feugiat est. Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique.",
111 | "spans": []
112 | }
113 | }
114 | ]
115 | }
116 | },
117 | "label": "col-1"
118 | },
119 | {
120 | "key": "quote$a5c2d25c-7f62-478d-87f2-8bcea126e554",
121 | "value": {
122 | "repeat": [{}],
123 | "non-repeat": {
124 | "quote_text": [
125 | {
126 | "type": "paragraph",
127 | "content": { "text": "Lorem ipsum dolor site amet", "spans": [] }
128 | }
129 | ]
130 | }
131 | }
132 | },
133 | {
134 | "key": "text_section$9c399ba1-83ac-4b10-a304-ae2ddd96569a",
135 | "value": {
136 | "repeat": [{}],
137 | "non-repeat": {
138 | "rich_text": [
139 | {
140 | "type": "paragraph",
141 | "content": {
142 | "text": "Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis. Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscing risus a sem. Nullam quis massa sit amet nibh viverra malesuada. Nunc sem lacus, accumsan quis, faucibus non, congue vel, arcu. Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante. Vivamus imperdiet nibh feugiat est. Sed lectus. Praesent elementum hendrerit tortor. Sed semper lorem at felis. Vestibulum volutpat, lacus a ultrices sagittis. Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscing risus a sem.",
143 | "spans": []
144 | }
145 | }
146 | ]
147 | }
148 | }
149 | },
150 | {
151 | "key": "image_gallery$63a03e71-0b7f-49a6-96b8-100e2d9b3e64",
152 | "value": {
153 | "non-repeat": {
154 | "gallery_title": [
155 | {
156 | "type": "heading2",
157 | "content": {
158 | "text": "Lorem ipsum dolor sit amet ",
159 | "spans": [{ "start": 26, "end": 27, "type": "em" }]
160 | }
161 | }
162 | ]
163 | },
164 | "repeat": [
165 | {
166 | "image_description": [
167 | {
168 | "type": "paragraph",
169 | "content": {
170 | "text": "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. Pellentesque aliquet nibh nec urna. In nisi neque, aliquet vel, dapibus id, mattis vel, nisi.",
171 | "spans": [{ "start": 130, "end": 141, "type": "em" }]
172 | }
173 | }
174 | ],
175 | "link": {
176 | "id": "V6wyTywAAIbjaWcL",
177 | "mask": "page",
178 | "wioUrl": "wio://documents/V6wyTywAAIbjaWcL"
179 | },
180 | "link_label": [
181 | {
182 | "type": "paragraph",
183 | "content": { "text": "Learn More", "spans": [] }
184 | }
185 | ],
186 | "image": {
187 | "origin": {
188 | "id": "V6tUxiwAAODeZfCV",
189 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2F291e1f1c-1721-462a-bfe3-b75142c47eda_page-forrest.jpeg",
190 | "width": 4979,
191 | "height": 3319
192 | },
193 | "width": 727,
194 | "height": 402,
195 | "edit": {
196 | "background": "#fff",
197 | "zoom": 0.14601325567383008,
198 | "crop": { "x": 0, "y": -39 }
199 | },
200 | "credits": null,
201 | "alt": "Alt text example",
202 | "thumbnails": {},
203 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/3a8f2bf00f22d6ef7fd95f3721c0736854076018_page-forrest.jpeg"
204 | }
205 | },
206 | {
207 | "image_description": [
208 | {
209 | "type": "paragraph",
210 | "content": {
211 | "text": "Sed egestas, ante et vulputate volutpat, eros pede semper est, vitae luctus metus libero eu augue. Morbi purus libero, faucibus adipiscing, commodo quis, gravida id, est.",
212 | "spans": []
213 | }
214 | }
215 | ],
216 | "image": {
217 | "origin": {
218 | "id": "V6s8pywAAMBbZY_o",
219 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2F6f306737-c5ef-4761-a643-cd4025995a15_page-mountains.jpeg",
220 | "width": 3872,
221 | "height": 2592
222 | },
223 | "width": 727,
224 | "height": 402,
225 | "edit": {
226 | "background": "#fff",
227 | "zoom": 0.1877582644628099,
228 | "crop": { "x": 0, "y": -42 }
229 | },
230 | "credits": null,
231 | "alt": "Alt text example",
232 | "thumbnails": {},
233 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/fd3c4b20d185d890ba403b531dc7cfd1c89b8b00_page-mountains.jpeg"
234 | }
235 | }
236 | ]
237 | }
238 | }
239 | ],
240 | "uids_INTERNAL": ["about"]
241 | }
242 |
--------------------------------------------------------------------------------
/documents/en-us/V6wyTywAAIbjaWcL=#=XGVuOBAAACIAFZZj=#=page=#=Wa58kCgAAC4AED7K=#=en-us=#=y.json:
--------------------------------------------------------------------------------
1 | {
2 | "uid": "more-info",
3 | "uid_TYPE": "UID",
4 | "uid_POSITION": 0,
5 | "page_content_TYPE": "Slices",
6 | "page_content_POSITION": 1,
7 | "page_content.text_section_TYPE": "Slice",
8 | "page_content.text_section_POSITION": 2,
9 | "page_content.text_section.non-repeat.rich_text_TYPE": "StructuredText",
10 | "page_content.text_section.non-repeat.rich_text_POSITION": 3,
11 | "page_content.quote_TYPE": "Slice",
12 | "page_content.quote_POSITION": 4,
13 | "page_content.quote.non-repeat.quote_text_TYPE": "StructuredText",
14 | "page_content.quote.non-repeat.quote_text_POSITION": 5,
15 | "page_content.full_width_image_TYPE": "Slice",
16 | "page_content.full_width_image_POSITION": 6,
17 | "page_content.full_width_image.non-repeat.image_TYPE": "Image",
18 | "page_content.full_width_image.non-repeat.image_POSITION": 7,
19 | "page_content.image_gallery_TYPE": "Slice",
20 | "page_content.image_gallery_POSITION": 8,
21 | "page_content.image_gallery.non-repeat.gallery_title_TYPE": "StructuredText",
22 | "page_content.image_gallery.non-repeat.gallery_title_POSITION": 9,
23 | "page_content.image_gallery.repeat.image_description_TYPE": "StructuredText",
24 | "page_content.image_gallery.repeat.image_description_POSITION": 10,
25 | "page_content.image_gallery.repeat.link_TYPE": "Link",
26 | "page_content.image_gallery.repeat.link_POSITION": 11,
27 | "page_content.image_gallery.repeat.link_label_TYPE": "StructuredText",
28 | "page_content.image_gallery.repeat.link_label_POSITION": 12,
29 | "page_content.image_gallery.repeat.image_TYPE": "Image",
30 | "page_content.image_gallery.repeat.image_POSITION": 13,
31 | "page_content.image_highlight_TYPE": "Slice",
32 | "page_content.image_highlight_POSITION": 14,
33 | "page_content.image_highlight.non-repeat.featured_image_TYPE": "Image",
34 | "page_content.image_highlight.non-repeat.featured_image_POSITION": 15,
35 | "page_content.image_highlight.non-repeat.title_TYPE": "StructuredText",
36 | "page_content.image_highlight.non-repeat.title_POSITION": 16,
37 | "page_content.image_highlight.non-repeat.headline_TYPE": "StructuredText",
38 | "page_content.image_highlight.non-repeat.headline_POSITION": 17,
39 | "page_content.image_highlight.non-repeat.link_TYPE": "Link",
40 | "page_content.image_highlight.non-repeat.link_POSITION": 18,
41 | "page_content.image_highlight.non-repeat.link_label_TYPE": "StructuredText",
42 | "page_content.image_highlight.non-repeat.link_label_POSITION": 19,
43 | "slugs_INTERNAL": [
44 | "more-info",
45 | "more-info---zzz",
46 | "blog-home",
47 | "morbi-interdum-mollis-sapien.-hello-jose",
48 | "morbi-interdum-mollis-sapien.-hello-world",
49 | "morbi-interdum-mollis-sapien.",
50 | "morbi-interdum-mollis-sapien.-new-zoomba",
51 | "morbi-interdum-mollis-sapien"
52 | ],
53 | "page_content": [
54 | {
55 | "key": "full_width_image$a23cd17b-20de-448b-adb2-97caba67d24f",
56 | "value": {
57 | "repeat": [{}],
58 | "non-repeat": {
59 | "image": {
60 | "origin": {
61 | "id": "V6wyHSwAAIbjaWZC",
62 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2F30e3bb86-fb0e-48df-a6ae-3b0fbf82a75c_castle-valley-500241_960_720.jpg",
63 | "width": 960,
64 | "height": 720
65 | },
66 | "width": 980,
67 | "height": 300,
68 | "edit": {
69 | "background": "#fff",
70 | "zoom": 1.0208333333333333,
71 | "crop": { "x": 0, "y": -271 }
72 | },
73 | "credits": null,
74 | "alt": null,
75 | "thumbnails": {},
76 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/f53d356899fc1c30a53c02c356e4256adb9376d5_castle-valley-500241_960_720.jpg"
77 | }
78 | }
79 | }
80 | },
81 | {
82 | "key": "text_section$a6e42a8a-5b1a-4d6a-adb3-232d12e3959a",
83 | "value": {
84 | "repeat": [{}],
85 | "non-repeat": {
86 | "rich_text": [
87 | {
88 | "type": "heading1",
89 | "content": { "text": "More Info", "spans": [] }
90 | },
91 | {
92 | "type": "heading2",
93 | "content": { "text": "Morbi interdum mollis sapien", "spans": [] }
94 | },
95 | {
96 | "type": "paragraph",
97 | "content": {
98 | "text": "Sed ac risus. Phasellus lacinia, magna a ullamcorper laoreet, lectus arcu pulvinar risus, vitae facilisis libero dolor a purus. Sed vel lacus. Mauris nibh felis, adipiscing varius, adipiscing in, lacinia vel, tellus. Suspendisse ac urna. Etiam pellentesque mauris ut lectus. Nunc tellus ante, mattis eget, gravida vitae, ultricies ac, leo. Integer leo pede, ornare a, lacinia eu, vulputate vel, nisl",
99 | "spans": [
100 | {
101 | "start": 62,
102 | "end": 88,
103 | "type": "hyperlink",
104 | "data": {
105 | "id": "V6s8QywAAKzDZY5V",
106 | "mask": "homepage",
107 | "preview": {
108 | "image": "https://prismic-io.s3.amazonaws.com/sample-site/medium_8ecfe46c-11f6-481b-afca-c938fade6eff_home-banner.jpg",
109 | "title": "John Doe"
110 | },
111 | "wioUrl": "wio://documents/V6s8QywAAKzDZY5V"
112 | }
113 | },
114 | { "start": 96, "end": 126, "type": "strong" },
115 | { "start": 162, "end": 179, "type": "em" },
116 | { "start": 196, "end": 207, "type": "strong" },
117 | { "start": 196, "end": 207, "type": "em" },
118 | { "start": 217, "end": 236, "type": "em" }
119 | ]
120 | }
121 | }
122 | ]
123 | }
124 | },
125 | "label": "1col"
126 | },
127 | {
128 | "key": "quote$f4e96dd3-70d7-435a-b978-2c572f64ef33",
129 | "value": {
130 | "repeat": [{}],
131 | "non-repeat": {
132 | "quote_text": [
133 | {
134 | "type": "paragraph",
135 | "content": {
136 | "text": "Etiam pellentesque mauris ut lectus",
137 | "spans": []
138 | }
139 | }
140 | ]
141 | }
142 | }
143 | },
144 | {
145 | "key": "text_section$b34b8bb9-33b5-43c9-a317-2b4c8677f4d6",
146 | "value": {
147 | "repeat": [{}],
148 | "non-repeat": {
149 | "rich_text": [
150 | {
151 | "type": "paragraph",
152 | "content": {
153 | "text": "Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula. Integer adipiscing risus a sem. Nullam quis massa sit amet nibh viverra malesuada. Nunc sem lacus, accumsan quis, faucibus non, congue vel, arcu. Ut scelerisque hendrerit tellus. Integer sagittis. Vivamus a mauris eget arcu gravida tristique. Nunc iaculis mi in ante. Vivamus imperdiet nibh feugiat est.",
154 | "spans": []
155 | }
156 | }
157 | ]
158 | }
159 | }
160 | },
161 | {
162 | "key": "full_width_image$fc596dee-3eaa-4234-ab68-5db00574a840",
163 | "value": {
164 | "repeat": [{}],
165 | "non-repeat": {
166 | "image": {
167 | "origin": {
168 | "id": "V6x4PSwAACTman8W",
169 | "url": "https://prismic-io.s3.amazonaws.com/sample-site%2Fcdebd7e6-66a3-424d-8d92-a2f8c628260d_forrest-1007159_960_720.jpg",
170 | "width": 960,
171 | "height": 640
172 | },
173 | "width": 980,
174 | "height": 300,
175 | "edit": {
176 | "background": "#fff",
177 | "zoom": 1.0208333333333333,
178 | "crop": { "x": 0, "y": -195 }
179 | },
180 | "credits": null,
181 | "alt": null,
182 | "thumbnails": {},
183 | "url": "https://prismic-io.s3.amazonaws.com/sample-site/5ccb7680df032a4bbc10f646b273084613623a47_forrest-1007159_960_720.jpg"
184 | }
185 | }
186 | }
187 | },
188 | {
189 | "key": "text_section$8afa4af5-de52-4a66-8fcd-6f12b7dc2775",
190 | "value": {
191 | "repeat": [{}],
192 | "non-repeat": {
193 | "rich_text": [
194 | {
195 | "type": "paragraph",
196 | "content": {
197 | "text": "Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus.",
198 | "spans": []
199 | }
200 | },
201 | {
202 | "type": "paragraph",
203 | "content": {
204 | "text": "Phasellus ultrices nulla quis nibh. Quisque a lectus. Donec consectetuer ligula vulputate sem tristique cursus. ",
205 | "spans": []
206 | }
207 | },
208 | {
209 | "type": "paragraph",
210 | "content": {
211 | "text": "Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.",
212 | "spans": []
213 | }
214 | },
215 | {
216 | "type": "paragraph",
217 | "content": {
218 | "text": "Sed adipiscing ornare risus. Morbi est est, blandit sit amet, sagittis vel, euismod vel, velit. Pellentesque egestas sem. Suspendisse commodo ullamcorper magna.",
219 | "spans": []
220 | }
221 | }
222 | ]
223 | }
224 | },
225 | "label": "2col"
226 | }
227 | ],
228 | "uids_INTERNAL": ["more-info", "page2"]
229 | }
230 |
--------------------------------------------------------------------------------
/documents/index.json:
--------------------------------------------------------------------------------
1 | {"signature":"437f6e92dc00e601d3e252de8442100042cf1e97"}
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "reactjs-multi-page-site",
3 | "description": "An example multi-page site built using React.js connected to Prismic CMS",
4 | "author": "Prismic",
5 | "dependencies": {
6 | "@prismicio/client": "^6.4.2",
7 | "@prismicio/helpers": "^2.0.0-beta.6",
8 | "@prismicio/react": "^2.0.0-beta.9",
9 | "react": "^17.0.2",
10 | "react-dom": "^17.0.2",
11 | "react-helmet": "^6.1.0",
12 | "react-router-dom": "^6.0.2"
13 | },
14 | "devDependencies": {
15 | "prettier": "^2.5.0",
16 | "react-scripts": "^4.0.3"
17 | },
18 | "scripts": {
19 | "start": "react-scripts start",
20 | "build": "react-scripts build",
21 | "eject": "react-scripts eject",
22 | "format": "prettier --write ."
23 | },
24 | "engines": {
25 | "node": ">=4.8.1",
26 | "npm": ">=2.15.11"
27 | },
28 | "browserslist": [
29 | ">0.2%",
30 | "not dead",
31 | "not ie <= 11",
32 | "not op_mini all"
33 | ],
34 | "repository": {
35 | "type": "git",
36 | "url": "https://github.com/prismicio/reactjs-blog"
37 | }
38 | }
39 |
--------------------------------------------------------------------------------
/public/_redirects:
--------------------------------------------------------------------------------
1 | /* /index.html 200
--------------------------------------------------------------------------------
/public/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/prismicio/reactjs-website/036adbbafcfb8c0e83d6d891719b8d8c2a83e935/public/favicon.png
--------------------------------------------------------------------------------
/public/images/logo-prismic.svg:
--------------------------------------------------------------------------------
1 |
2 |
--------------------------------------------------------------------------------
/public/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | Sample Website
7 |
8 |
9 |
10 |
11 |
16 |
21 |
25 |
34 |
35 |
36 |
37 |
47 |
48 |
49 |
--------------------------------------------------------------------------------
/public/stylesheets/common.css:
--------------------------------------------------------------------------------
1 | * {
2 | -webkit-font-smoothing: antialiased;
3 | }
4 | ::selection {
5 | background: #fff7c7; /* WebKit/Blink Browsers */
6 | }
7 | ::-moz-selection {
8 | background: #fff7c7; /* Gecko Browsers */
9 | }
10 |
11 | /*
12 | * Globals
13 | */
14 | body {
15 | padding: 20px;
16 | color: #72767b;
17 | font-family: "Lato", sans-serif;
18 | font-size: 16px;
19 | font-weight: 400;
20 | letter-spacing: 0.4;
21 | line-height: 28px;
22 | }
23 | a {
24 | color: #72767b;
25 | font-size: 14px;
26 | font-weight: 400;
27 | letter-spacing: 0.35;
28 | line-height: 28px;
29 | text-decoration: none;
30 | }
31 | p a {
32 | text-decoration: underline;
33 | }
34 | h2,
35 | h3,
36 | h4,
37 | h5,
38 | h6 {
39 | font-family: "Lato", sans-serif;
40 | }
41 | h1 {
42 | font-family: ‘Lora’, Serif;
43 | font-size: 42px;
44 | font-weight: normal;
45 | color: #484d52;
46 | line-height: 52px;
47 | letter-spacing: 1.14;
48 | margin-bottom: 1rem;
49 | }
50 | h2,
51 | h2 a {
52 | margin-bottom: 1rem;
53 | color: #484d52;
54 | font-size: 32px;
55 | font-weight: 700;
56 | letter-spacing: 0.85;
57 | line-height: 42px;
58 | }
59 | h3,
60 | h3 a {
61 | margin-bottom: 1rem;
62 | color: #484d52;
63 | font-size: 20px;
64 | font-weight: 400;
65 | letter-spacing: 0.52;
66 | line-height: 34px;
67 | }
68 | p {
69 | margin-bottom: 2rem;
70 | }
71 | pre,
72 | ul {
73 | margin-bottom: 20px;
74 | }
75 | strong {
76 | font-weight: bold;
77 | }
78 | em {
79 | font-style: italic;
80 | }
81 | img {
82 | max-width: 100%;
83 | }
84 |
--------------------------------------------------------------------------------
/public/stylesheets/reset.css:
--------------------------------------------------------------------------------
1 | /* http://meyerweb.com/eric/tools/css/reset/
2 | v2.0 | 20110126
3 | License: none (public domain)
4 | */
5 |
6 | html,
7 | body,
8 | div,
9 | span,
10 | applet,
11 | object,
12 | iframe,
13 | h1,
14 | h2,
15 | h3,
16 | h4,
17 | h5,
18 | h6,
19 | p,
20 | blockquote,
21 | pre,
22 | a,
23 | abbr,
24 | acronym,
25 | address,
26 | big,
27 | cite,
28 | code,
29 | del,
30 | dfn,
31 | em,
32 | img,
33 | ins,
34 | kbd,
35 | q,
36 | s,
37 | samp,
38 | small,
39 | strike,
40 | strong,
41 | sub,
42 | sup,
43 | tt,
44 | var,
45 | b,
46 | u,
47 | i,
48 | center,
49 | dl,
50 | dt,
51 | dd,
52 | ol,
53 | ul,
54 | li,
55 | fieldset,
56 | form,
57 | label,
58 | legend,
59 | table,
60 | caption,
61 | tbody,
62 | tfoot,
63 | thead,
64 | tr,
65 | th,
66 | td,
67 | article,
68 | aside,
69 | canvas,
70 | details,
71 | embed,
72 | figure,
73 | figcaption,
74 | footer,
75 | header,
76 | hgroup,
77 | menu,
78 | nav,
79 | output,
80 | ruby,
81 | section,
82 | summary,
83 | time,
84 | mark,
85 | audio,
86 | video {
87 | margin: 0;
88 | padding: 0;
89 | border: 0;
90 | font-size: 100%;
91 | font: inherit;
92 | vertical-align: baseline;
93 | }
94 | /* HTML5 display-role reset for older browsers */
95 | article,
96 | aside,
97 | details,
98 | figcaption,
99 | figure,
100 | footer,
101 | header,
102 | hgroup,
103 | menu,
104 | nav,
105 | section {
106 | display: block;
107 | }
108 | body {
109 | line-height: 1;
110 | }
111 | ol,
112 | ul {
113 | list-style: none;
114 | }
115 | blockquote,
116 | q {
117 | quotes: none;
118 | }
119 | blockquote:before,
120 | blockquote:after,
121 | q:before,
122 | q:after {
123 | content: "";
124 | content: none;
125 | }
126 | table {
127 | border-collapse: collapse;
128 | border-spacing: 0;
129 | }
130 |
--------------------------------------------------------------------------------
/public/stylesheets/style.css:
--------------------------------------------------------------------------------
1 | /* General */
2 | .container,
3 | .content-section,
4 | header,
5 | footer {
6 | max-width: 980px;
7 | margin: auto;
8 | }
9 | .content-section {
10 | margin-bottom: 3.75rem;
11 | }
12 |
13 | /* Header */
14 | .site-header {
15 | height: 30px;
16 | padding: 20px 0;
17 | }
18 | .site-header,
19 | .site-header a {
20 | color: #484d52;
21 | font-weight: 700;
22 | }
23 | .site-header nav a:hover {
24 | color: #72767b;
25 | }
26 | .homepage .site-header,
27 | .homepage .site-header a {
28 | color: #ffffff;
29 | }
30 | .homepage .site-header nav a:hover {
31 | color: #c8c9cb;
32 | }
33 | .site-header .logo {
34 | display: inline-block;
35 | font-size: 22px;
36 | font-weight: 900;
37 | }
38 | .site-header nav {
39 | float: right;
40 | }
41 | .site-header nav ul {
42 | margin: 0;
43 | }
44 | .site-header nav li {
45 | display: inline-block;
46 | margin-left: 40px;
47 | }
48 |
49 | /* Homepage Banner */
50 | .homepage-banner {
51 | margin: -70px 0 80px;
52 | padding: 10em 0 8em;
53 | background-position: center center;
54 | background-size: cover;
55 | color: #ffffff;
56 | line-height: 1.75;
57 | text-align: center;
58 | }
59 | .banner-content {
60 | text-align: center;
61 | }
62 | .banner-title,
63 | .banner-description {
64 | width: 90%;
65 | max-width: 490px;
66 | margin-left: auto;
67 | margin-right: auto;
68 | }
69 | .banner-title {
70 | color: #ffffff;
71 | font-size: 70px;
72 | font-weight: 900;
73 | line-height: 70px;
74 | }
75 | .banner-button {
76 | background: #ffffff;
77 | border-radius: 7px;
78 | color: #484d52;
79 | font-size: 14px;
80 | font-weight: 700;
81 | padding: 15px 40px;
82 | }
83 | .banner-button:hover {
84 | background: #c8c9cb;
85 | }
86 |
87 | /* Text Sections */
88 | .text-section-2col {
89 | -webkit-column-count: 2; /* Chrome, Safari, Opera */
90 | -moz-column-count: 2; /* Firefox */
91 | column-count: 2;
92 | -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
93 | -moz-column-gap: 40px; /* Firefox */
94 | column-gap: 40px;
95 | }
96 | .text-section-1col img,
97 | .text-section-2col img,
98 | .gallery img {
99 | margin-bottom: 1rem;
100 | }
101 | .text-section-1col p:last-child,
102 | .text-section-2col p:last-child {
103 | margin-bottom: 0;
104 | }
105 | .quote blockquote {
106 | display: block;
107 | font-family: "Lora", Serif;
108 | font-size: 36px;
109 | font-style: italic;
110 | font-weight: normal;
111 | color: #484d52;
112 | letter-spacing: 1.14;
113 | line-height: 1.5em;
114 | quotes: "\201C""\201D""\2018""\2019";
115 | text-align: center;
116 | }
117 | .quote blockquote:before,
118 | .quote blockquote:after {
119 | color: #e9e9e9;
120 | content: open-quote;
121 | font-family: "Lora", Serif;
122 | font-size: 2.5em;
123 | font-weight: 900;
124 | line-height: 0.1em;
125 | margin-left: 10px;
126 | margin-right: 10px;
127 | vertical-align: -0.3em;
128 | }
129 | .quote blockquote:after {
130 | content: close-quote;
131 | }
132 |
133 | /* Highlight Section */
134 | .highlight {
135 | position: relative;
136 | overflow: auto;
137 | }
138 | .highlight-left {
139 | width: 43%;
140 | float: left;
141 | }
142 | .highlight-right {
143 | width: 48%;
144 | float: right;
145 | }
146 |
147 | /* Gallery Section */
148 | .gallery {
149 | display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6, BB7 */
150 | display: -ms-flexbox; /* TWEENER - IE 10 */
151 | display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
152 | display: flex;
153 | -webkit-flex-wrap: wrap;
154 | flex-wrap: wrap;
155 | -webkit-justify-content: space-between;
156 | justify-content: space-between;
157 | }
158 | .gallery-item {
159 | -webkit-box-flex: 0 1 48%;
160 | -moz-box-flex: 0 1 48%;
161 | -webkit-flex: 0 1 48%;
162 | -ms-flex: 0 1 48%;
163 | flex: 0 1 48%;
164 | }
165 | .gallery-link {
166 | margin-top: -20px;
167 | text-transform: uppercase;
168 | }
169 |
170 | /* Footer */
171 | footer {
172 | color: #9a9a9a;
173 | font-size: 16px;
174 | font-style: italic;
175 | text-align: center;
176 | }
177 | footer p {
178 | border-top: 1px solid #dadada;
179 | padding: 2rem 0;
180 | margin-bottom: 0;
181 | }
182 | footer a {
183 | font-weight: bold;
184 | text-decoration: none;
185 | }
186 | .footer-logo {
187 | width: 30px;
188 | margin-top: 10px;
189 | }
190 |
191 | /* 404 error page */
192 | .not-found {
193 | display: flex;
194 | flex-direction: column;
195 | justify-content: center;
196 | height: 50vw;
197 | align-items: center;
198 | }
199 |
200 | /*
201 | * Loader animation
202 | */
203 | #loader {
204 | position: fixed;
205 | top: 50%;
206 | left: 50%;
207 | -moz-transform: translate(-50%, -50%);
208 | -webkit-transform: translate(-50%, -50%);
209 | -o-transform: translate(-50%, -50%);
210 | -ms-transform: translate(-50%, -50%);
211 | transform: translate(-50%, -50%);
212 | }
213 | .lds-ripple {
214 | width: 64px;
215 | height: 64px;
216 | }
217 | .lds-ripple:before,
218 | .lds-ripple:after {
219 | content: "";
220 | position: absolute;
221 | border: 4px solid #333;
222 | opacity: 1;
223 | border-radius: 50%;
224 | animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
225 | }
226 | .lds-ripple:after {
227 | animation-delay: -0.5s;
228 | }
229 | @keyframes lds-ripple {
230 | 0% {
231 | top: 28px;
232 | left: 28px;
233 | width: 0;
234 | height: 0;
235 | opacity: 1;
236 | }
237 | 100% {
238 | top: -1px;
239 | left: -1px;
240 | width: 58px;
241 | height: 58px;
242 | opacity: 0;
243 | }
244 | }
245 |
246 | /* Media Queries */
247 | @media (max-width: 1060px) {
248 | .site-header {
249 | padding-left: 20px;
250 | padding-right: 20px;
251 | }
252 | }
253 | @media (max-width: 767px) {
254 | h1 {
255 | font-size: 32px;
256 | line-height: 40px;
257 | }
258 | h2 {
259 | font-size: 26px;
260 | }
261 | h3 {
262 | font-size: 18px;
263 | }
264 | .content-section {
265 | margin-bottom: 2rem;
266 | }
267 | .site-header {
268 | height: auto;
269 | }
270 | .homepage .site-header {
271 | position: absolute;
272 | left: 0;
273 | right: 0;
274 | }
275 | .site-header .logo {
276 | display: block;
277 | text-align: center;
278 | }
279 | .site-header nav {
280 | float: none;
281 | text-align: center;
282 | }
283 | .site-header nav li {
284 | display: inline-block;
285 | margin-left: 10px;
286 | margin-right: 10px;
287 | }
288 | .homepage-banner {
289 | margin: 0 0 40px;
290 | padding: 10em 0 6em;
291 | }
292 | .banner-title {
293 | font-size: 50px;
294 | line-height: 50px;
295 | }
296 | .text-section-2col {
297 | -webkit-column-count: 1; /* Chrome, Safari, Opera */
298 | -moz-column-count: 1; /* Firefox */
299 | column-count: 1;
300 | -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
301 | -moz-column-gap: 40px; /* Firefox */
302 | column-gap: 40px;
303 | }
304 | .quote {
305 | font-size: 20px;
306 | }
307 | .gallery-item {
308 | -webkit-box-flex: 100%;
309 | -moz-box-flex: 100%;
310 | -webkit-flex: 100%;
311 | -ms-flex: 100%;
312 | flex: 100%;
313 | }
314 | .highlight-left,
315 | .highlight-right {
316 | width: 100%;
317 | float: none;
318 | }
319 | }
320 |
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import { PrismicProvider, PrismicToolbar } from "@prismicio/react";
2 | import { BrowserRouter, Route, Routes, Link } from "react-router-dom";
3 |
4 | import { client, repositoryName } from "./prismic";
5 | import { HomePage } from "./pages/HomePage";
6 | import { NotFound } from "./pages/NotFound";
7 | import { Page } from "./pages/Page";
8 | import { Preview } from "./pages/Preview";
9 |
10 | export const App = () => {
11 | return (
12 | (
15 |
16 | )}
17 | >
18 |
19 |
20 | } />
21 | } />
22 | } />
23 | } />
24 |
25 |
26 |
27 |
28 | );
29 | };
30 |
--------------------------------------------------------------------------------
/src/components/Footer.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Site footer component
3 | */
4 | export const Footer = () => (
5 |
21 | );
22 |
--------------------------------------------------------------------------------
/src/components/Header.js:
--------------------------------------------------------------------------------
1 | import { PrismicText, PrismicLink } from "@prismicio/react";
2 |
3 | /**
4 | * Menu link component
5 | */
6 | const MenuLink = ({ menuLink }) => {
7 | return (
8 |
9 |
10 |
11 |
12 |
13 | );
14 | };
15 |
16 | /**
17 | * Site header/nav component
18 | */
19 | export const Header = ({ menuDoc }) => {
20 | if (menuDoc) {
21 | return (
22 |
23 |
24 | Example Site
25 |
26 |
33 |
34 | );
35 | }
36 |
37 | return null;
38 | };
39 |
--------------------------------------------------------------------------------
/src/components/HomepageBanner.js:
--------------------------------------------------------------------------------
1 | import { PrismicText, PrismicLink } from "@prismicio/react";
2 |
3 | /**
4 | * Homepage banner component
5 | */
6 | export const HomepageBanner = ({ banner }) => (
7 |
13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
10 |
11 | {children}
12 |
13 |
14 | );
15 | };
16 |
--------------------------------------------------------------------------------
/src/components/Loader.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Loading animation component
3 | */
4 | export const Loader = () => (
5 |
8 | );
9 |
--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | import { render } from "react-dom";
2 | import { App } from "./App";
3 |
4 | render(, document.getElementById("root"));
5 |
--------------------------------------------------------------------------------
/src/pages/HomePage.js:
--------------------------------------------------------------------------------
1 | import { useEffect } from "react";
2 | import { SliceZone, useSinglePrismicDocument } from "@prismicio/react";
3 |
4 | import { components } from "../slices";
5 | import { Layout } from "../components/Layout";
6 | import { HomepageBanner } from "../components/HomepageBanner";
7 | import { NotFound } from "./NotFound";
8 |
9 | /**
10 | * Website homepage component
11 | */
12 | export const HomePage = () => {
13 | const [home, homeState] = useSinglePrismicDocument("homepage");
14 | const [menu, menuState] = useSinglePrismicDocument("menu");
15 |
16 | const notFound = homeState.state === "failed" || menuState.state === "failed";
17 |
18 | useEffect(() => {
19 | if (homeState.state === "failed") {
20 | console.warn(
21 | "Homepage document was not found. Make sure it exists in your Prismic repository."
22 | );
23 | }
24 | }, [homeState.state]);
25 |
26 | // Return the page if a document was retrieved from Prismic
27 | if (home && menu) {
28 | return (
29 |
30 |
31 |
32 |
33 | );
34 | } else if (notFound) {
35 | return ;
36 | }
37 |
38 | return null;
39 | };
40 |
--------------------------------------------------------------------------------
/src/pages/NotFound.js:
--------------------------------------------------------------------------------
1 | import { Link } from "react-router-dom";
2 |
3 | /**
4 | * Page not found (404) component
5 | */
6 | export const NotFound = () => (
7 |
8 |
404
9 |
Document not found
10 |
11 | Return to homepage
12 |
13 |
7 |
8 | );
9 |
--------------------------------------------------------------------------------
/src/slices/ImageGallery.js:
--------------------------------------------------------------------------------
1 | import { PrismicRichText, PrismicText, PrismicLink } from "@prismicio/react";
2 |
3 | /**
4 | * Gallery item component
5 | */
6 | const GalleryItem = ({ item }) => {
7 | return (
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
28 | {slice.items.map((item) => (
29 |
30 | ))}
31 |
32 |
33 | );
34 | };
35 |
--------------------------------------------------------------------------------
/src/slices/ImageHighlight.js:
--------------------------------------------------------------------------------
1 | import { PrismicRichText, PrismicText, PrismicLink } from "@prismicio/react";
2 |
3 | /**
4 | * Image highlight slice component
5 | */
6 | export const ImageHighlight = ({ slice }) => (
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
18 |
22 |