1---
2layout: base
3---
4{%- assign _page_mode = page.mode | default: layout.mode | default: site.data.variables.default.page.mode -%}
5{%- assign _page_type = page.type | default: layout.type | default: site.data.variables.default.page.type -%}
6{%- assign _article_header_type = page.article_header.type | default: layout.article_header.type -%}
7
8{%- include snippets/assign.html
9  target=layout.header source0=page.header -%}
10{%- assign _header = __return -%}
11
12{%- include snippets/assign.html
13  target=layout.footer source0=page.footer -%}
14{%- assign _footer = __return -%}
15
16{%- include snippets/assign.html
17  target=layout.lightbox source0=page.lightbox -%}
18{%- assign _lightbox = __return -%}
19
20{%- include snippets/assign.html
21  target = site.data.variables.default.page.full_width
22  source0=layout.full_width source1=page.full_width -%}
23{%- assign _full_width = __return -%}
24
25{%- include snippets/assign.html
26  target = site.data.variables.default.page.comment
27  source0=layout.comment source1=page.comment -%}
28{%- assign _comment = __return -%}
29
30
31{%- assign _article_header_excerpt_truncate = include.excerpt_truncate | default: 200 -%}
32
33{%- if page.sidebar -%}
34<div class="layout--page layout--page--sidebar clearfix js-page-root">
35  <div class="page__mask d-print-none js-page-mask js-sidebar-hide"></div>
36  <div class="page__viewport">
37    <div class="page__actions d-print-none">
38      <div class="button button--circle button--lg box-shadow-2 sidebar-button js-sidebar-show">
39        <i class="fas fa-bars icon--show"></i>
40      </div>
41    </div>
42
43    <div class="grid page__grid">
44
45      <div class="page__sidebar d-print-none">
46        {%- include sidebar/toc.html -%}
47      </div>
48
49{%- else -%}
50<div class="layout--page js-page-root">
51{%- endif -%}
52
53    {%- assign _page_main_class = 'page__main js-page-main' -%}
54    {%- if _page_mode == 'immersive' -%}
55      {%- assign _page_main_class = _page_main_class | append: ' page__main--immersive' -%}
56    {%- endif -%}
57    {%- unless page.sidebar -%}
58      {%- assign _page_main_class = _page_main_class | append: ' page__viewport' -%}
59    {%- endunless -%}
60    {%- if _footer == false -%}
61      {%- assign _page_main_class = _page_main_class | append: ' hide-footer' -%}
62    {%- endif -%}
63    {%- if page.aside -%}
64      {%- assign _page_main_class = _page_main_class | append: ' has-aside' -%}
65    {%- elsif _full_width -%}
66      {%- assign _page_main_class = _page_main_class | append: ' full-width' -%}
67    {%- endif -%}
68    <div class="{{ _page_main_class }} cell cell--auto">
69
70      <div class="page__main-inner">
71      {%- if _header != false -%}
72        <div class="page__header d-print-none">
73        {%- assign _header_theme = page.header.theme | default: layout.header.theme -%}
74        {%- if _header_theme == 'dark'-%}
75          {%- include header.html theme='dark' background=page.header.background -%}
76        {%- elsif _header_theme == 'light' -%}
77          {%- include header.html theme='light' background=page.header.background -%}
78        {%- else -%}
79          {%- include header.html -%}
80        {%- endif -%}
81        </div>
82      {%- endif -%}
83
84
85        <div class="page__content">
86        {%- if _article_header_type == 'overlay' or _article_header_type == 'cover' -%}
87
88          {%- if _article_header_type == 'overlay' -%}
89
90            {%- assign _article_header_height = page.article_header.height | default: layout.article_header.height -%}
91            {%- assign _article_header_align = page.article_header.align | default: layout.article_header.align | default: site.data.variables.default.page.article_header.align -%}
92            {%- assign _article_header_theme = page.article_header.theme | default: layout.article_header.theme | default: site.data.variables.default.page.article_header.theme -%}
93
94            {%- if page.article_header.background_image.src -%}
95              {%- assign _header_background_image_src = page.article_header.background_image.src -%}
96            {%- elsif page.article_header.background_image != false and page.cover -%}
97              {%- assign _header_background_image_src = page.cover -%}
98            {%- endif -%}
99
100            {%- if page.article_header.background_image.gradient -%}
101              {%- assign _header_background_image = page.article_header.background_image.gradient -%}
102              {%- if _header_background_image_src -%}
103                {%- assign _header_background_image = _header_background_image | append: ',' -%}
104              {%- endif -%}
105            {%- endif -%}
106
107            {%- if _header_background_image_src -%}
108              {%- include snippets/get-nav-url.html path=_header_background_image_src -%}
109              {%- assign _header_background_image_src = __return -%}
110              {%- assign _header_background_image = _header_background_image
111                | append: 'url(' | append: _header_background_image_src  | append: ')'-%}
112            {%- endif -%}
113
114            {%- assign _header_style = 'background-image:' | append: _header_background_image | append: ';' -%}
115
116            {%- if page.article_header.background_color -%}
117              {%- assign _header_style = _header_style | append: 'background-color:' | append: page.article_header.background_color | append: ';' -%}
118            {%- endif -%}
119
120            {%- if _article_header_height -%}
121              {%- assign _header_style = _header_style | append: 'min-height:' | append: _article_header_height | append: ';' -%}
122            {%- endif -%}
123
124            <div class="article__header--overlay">
125
126            {%- if _article_header_theme == 'light' -%}
127              {%- if _article_header_align == 'center' -%}
128                <div class="hero hero--center hero--light overlay" style="{{ _header_style }}">
129              {%- else -%}
130                <div class="hero hero--light overlay" style="{{ _header_style }}">
131              {%- endif -%}
132            {%- elsif _article_header_theme == 'dark' -%}
133              {%- if _article_header_align == 'center' -%}
134                <div class="hero hero--center hero--dark overlay" style="{{ _header_style }}">
135              {%- else -%}
136                <div class="hero hero--dark overlay" style="{{ _header_style }}">
137              {%- endif -%}
138            {%- else -%}
139              {%- if _article_header_align == 'center' -%}
140                <div class="hero hero--center overlay" style="{{ _header_style }}">
141              {%- else -%}
142                <div class="hero overlay" style="{{ _header_style }}">
143              {%- endif -%}
144            {%- endif -%}
145                <div class="hero__content">
146                  {%- if _full_width == false -%}
147                    <div class ="main">
148                  {%- endif -%}
149                    {%- include article-info.html article=page semantic=false -%}
150                    {%- include article-header.html article=page semantic=false -%}
151                    {%- if page.excerpt -%}
152                      <p class="overlay__excerpt">{{ page.excerpt | strip_html | strip_newlines | strip | truncate: _article_header_excerpt_truncate }}</p>
153                    {%- endif -%}
154                    {%- if page.article_header.actions -%}
155                      <ul class="menu">
156                        {%- for _action in page.article_header.actions -%}
157                          {%- include snippets/get-nav-url.html path=_action.url -%}
158                          {%- assign _url = __return -%}
159                          {%- assign _type = _action.type | default: 'info' -%}
160                          <li><a class="button button--{{ _type }} button--rounded button--xl" href="{{ _url }}">{{ _action.text }}</a></li>
161                        {%- endfor -%}
162                      </ul>
163                    {%- endif -%}
164                  {%- if _full_width == false -%}
165                    </div>
166                  {%- endif -%}
167                </div>
168              </div>
169            </div>
170          {%- elsif _article_header_type == 'cover' -%}
171            {%- if page.article_header.image.src -%}
172              {%- include snippets/get-nav-url.html path=page.article_header.image.src -%}
173              {%- assign _header_image_src = __return -%}
174              <img class="article__header--cover" src="{{ _header_image_src }}"></img>
175            {%- endif -%}
176          {%- endif -%}
177
178        {%- endif -%}
179
180
181        {%- if _full_width == false -%}
182          <div class ="main">
183        {%- endif -%}
184            <div class="grid grid--reverse">
185
186              <div class="col-aside d-print-none js-col-aside">
187                {%- if page.aside -%}
188                  <aside class="page__aside js-page-aside">
189                    {%- include aside/toc.html -%}
190                  </aside>
191                {%- endif -%}
192              </div>
193
194              <div class="col-main cell cell--auto">
195                {%- include main/top/custom.html -%}
196                {%- if _page_type == 'article' -%}
197                  <article itemscope itemtype="http://schema.org/Article">
198                {%- elsif _page_type == 'webpage' -%}
199                  <article itemscope itemtype="http://schema.org/WebPage">
200                {%- else -%}
201                  <article>
202                {%- endif -%}
203
204                {%- if _article_header_type == 'overlay' or page.article_header == false -%}
205                  {%- include article-header.html article=page html=false -%}
206                  {%- include article-info.html article=page html=false -%}
207                {%- else -%}
208                  {%- include article-header.html article=page -%}
209                  {%- include article-info.html article=page -%}
210                {%- endif -%}
211
212                    <div class="js-article-content">{{ content }}</div>
213                    {%- if _comment != false -%}
214                      <section class="page__comments d-print-none">{%- include comments.html -%}</section>
215                    {%- endif -%}
216                </article>
217                {%- include main/bottom/custom.html -%}
218              </div>
219            </div>
220
221        {%- if _full_width == false -%}
222          </div>
223        {%- endif -%}
224        </div>
225
226        {%- if _footer != false -%}
227          <div class="page__footer d-print-none">{%- include footer.html -%}</div>
228        {%- endif -%}
229      </div>
230    </div> {%- comment -%} end page__main {%- endcomment -%}
231{%- if page.sidebar -%}
232    </div> {%- comment -%} end grid {%- endcomment -%}
233  </div> {%- comment -%} end page__viewport {%- endcomment -%}
234{%- endif -%}
235
236<script>{%- include scripts/lib/modal.js -%}</script>
237{%- if _lightbox == true -%}
238  <div class="modal d-print-none js-page-gallery-modal"><div class="gallery"></div></div>
239{%- endif -%}
240{%- if _header != false -%}
241  <div class="modal modal--overflow page__search-modal d-print-none js-page-search-modal">{%- include search.html -%}</div>
242{%- endif -%}
243</div>
244
245
246<script>
247  {%- include scripts/lib/scroll-to.js -%}
248  {%- include scripts/lib/affix.js -%}
249  {%- include scripts/lib/toc.js -%}
250  {%- if _lightbox == true -%}
251    {%- include scripts/lib/gallery.js -%}
252    {%- include scripts/components/lightbox.js -%}
253  {%- endif -%}
254  {%- include scripts/page.js -%}
255</script>
256
257{%- if page.sidebar -%}
258<script>{%- include scripts/components/sidebar.js -%}</script>
259{%- endif -%}
260
261{%- if page.aside -%}
262<script>
263  /* toc must before affix, since affix need to konw toc' height. */
264  {%- if page.aside.toc -%}{%- include scripts/aside/toc.js -%}{%- endif -%}
265  {%- include scripts/aside/affix.js -%}
266</script>
267{%- endif -%}
268
269{%- include markdown-enhancements.html -%}
270{%- include pageview.html -%}