Add dark theme

This commit is contained in:
YDZ
2020-08-24 01:35:54 +08:00
parent 91c51977af
commit 6f7e2e9582
11 changed files with 868 additions and 1658 deletions

View File

@ -8,25 +8,25 @@ headless: true
- [1.1 关于作者]({{< relref "/ChapterOne/#关于作者" >}})
- 1.2 预备知识
- [第二章 算法专题]({{< relref "/ChapterTwo/_index.md" >}})
- [2.1 Array]({{< relref "/ChapterTwo/Array.md" >}})
- [2.2 String]({{< relref "/ChapterTwo/String.md" >}})
- [2.3 Two Pointers]({{< relref "/ChapterTwo/Two_Pointers.md" >}})
- [2.4 Linked List]({{< relref "/ChapterTwo/Linked_List.md" >}})
- [2.5 Stack]({{< relref "/ChapterTwo/Stack.md" >}})
- [2.6 Tree]({{< relref "/ChapterTwo/Tree.md" >}})
- [2.7 Dynamic Programming]({{< relref "/ChapterTwo/Dynamic_Programming.md" >}})
- [2.8 Backtracking]({{< relref "/ChapterTwo/Backtracking.md" >}})
- [2.9 Depth First Search]({{< relref "/ChapterTwo/Depth_First_Search.md" >}})
- [2.01 Array]({{< relref "/ChapterTwo/Array.md" >}})
- [2.02 String]({{< relref "/ChapterTwo/String.md" >}})
- [2.03 ✅ Two Pointers]({{< relref "/ChapterTwo/Two_Pointers.md" >}})
- [2.04 ✅ Linked List]({{< relref "/ChapterTwo/Linked_List.md" >}})
- [2.05 ✅ Stack]({{< relref "/ChapterTwo/Stack.md" >}})
- [2.06 Tree]({{< relref "/ChapterTwo/Tree.md" >}})
- [2.07 Dynamic Programming]({{< relref "/ChapterTwo/Dynamic_Programming.md" >}})
- [2.08 ✅ Backtracking]({{< relref "/ChapterTwo/Backtracking.md" >}})
- [2.09 Depth First Search]({{< relref "/ChapterTwo/Depth_First_Search.md" >}})
- [2.10 Breadth First Search]({{< relref "/ChapterTwo/Breadth_First_Search.md" >}})
- [2.11 Binary Search]({{< relref "/ChapterTwo/Binary_Search.md" >}})
- [2.12 Math]({{< relref "/ChapterTwo/Math.md" >}})
- [2.13 Hash Table]({{< relref "/ChapterTwo/Hash_Table.md" >}})
- [2.14 Sort]({{< relref "/ChapterTwo/Sort.md" >}})
- [2.15 Bit Manipulation]({{< relref "/ChapterTwo/Bit_Manipulation.md" >}})
- [2.16 Union Find]({{< relref "/ChapterTwo/Union_Find.md" >}})
- [2.17 Sliding Window]({{< relref "/ChapterTwo/Sliding_Window.md" >}})
- [2.18 Segment Tree]({{< relref "/ChapterTwo/Segment_Tree.md" >}})
- [2.19 Binary Indexed Tree]({{< relref "/ChapterTwo/Binary_Indexed_Tree.md" >}})
- [2.14 Sort]({{< relref "/ChapterTwo/Sort.md" >}})
- [2.15 Bit Manipulation]({{< relref "/ChapterTwo/Bit_Manipulation.md" >}})
- [2.16 Union Find]({{< relref "/ChapterTwo/Union_Find.md" >}})
- [2.17 Sliding Window]({{< relref "/ChapterTwo/Sliding_Window.md" >}})
- [2.18 Segment Tree]({{< relref "/ChapterTwo/Segment_Tree.md" >}})
- [2.19 Binary Indexed Tree]({{< relref "/ChapterTwo/Binary_Indexed_Tree.md" >}})
- [第三章 一些模板]({{< relref "/ChapterThree/_index.md" >}})
- [3.1 Segment Tree]({{< relref "/ChapterThree/Segment_Tree.md" >}})
- [3.2 UnionFind]({{< relref "/ChapterThree/UnionFind.md" >}})

View File

@ -1,3 +1,158 @@
/* You can add custom styles here. */
// @import "plugins/numbered";
/*
* Dark Mode Toggle
* Copyright (c) 2015 instructure-react
* Forked from Dan Abramov's personal blog
* https://github.com/gaearon/overreacted.io/blob/master/src/components/Toggle.css
* MIT License
**/
.js-toggle-wrapper {
display: table;
margin: 1rem 0 0 5px;
flex: 1;
}
.js-toggle {
touch-action: pan-x;
display: inline-block;
position: relative;
cursor: pointer;
background-color: transparent;
border: 0;
padding: 0;
-webkit-touch-callout: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: transparent;
}
.js-toggle-screenreader-only {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.js-toggle-track {
width: 60px;
height: 34px;
padding: 0;
// border-radius: 30px;
// background-color: hsl(222, 14%, 7%);
background-color: var(--body-background);
transition: all 0.2s ease;
}
.js-toggle-track-check {
position: absolute;
width: 17px;
height: 17px;
left: 5px;
top: 0px;
bottom: 0px;
margin-top: auto;
margin-bottom: auto;
line-height: 0;
opacity: 0;
transition: opacity 0.25s ease;
}
.js-toggle--checked .js-toggle-track-check {
opacity: 1;
transition: opacity 0.25s ease;
}
.js-toggle-track-x {
position: absolute;
width: 17px;
height: 17px;
right: 5px;
top: 0px;
bottom: 0px;
margin-top: auto;
margin-bottom: auto;
line-height: 0;
opacity: 1;
transition: opacity 0.25s ease;
}
.js-toggle--checked .js-toggle-track-x {
opacity: 0;
}
.js-toggle-thumb {
position: absolute;
top: 1px;
left: 1px;
width: 30px;
height: 32px;
// border-radius: 50%;
background-color: var(--gray-100);
box-sizing: border-box;
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
transform: translateX(0);
}
.js-toggle--checked .js-toggle-thumb {
transform: translateX(26px);
border-color: #19ab27;
}
.js-toggle--focus .js-toggle-thumb {
// box-shadow: 0px 0px 2px 3px rgb(255, 167, 196);
box-shadow: 0px 0px 2px 3px #64CEAA;
}
.js-toggle:active .js-toggle-thumb {
box-shadow: 0px 0px 5px 5px #64CEAA;
// box-shadow: 0px 0px 5px 5px rgb(255, 167, 196);
}
.magic {
display: flex;
}
body.dark-mode,
body.dark-mode main * {
background: rgb(45, 45, 45);
color: #f5f5f5;
}
$theme-light: (
gray-100: #f8f9fa,
gray-200: #e9ecef,
body-background: white,
body-font-color: black,
color-link: #05b,
color-visited-link: #8440f1,
icon-filter: none,
);
$theme-dark: (
gray-100: rgba(255, 255, 255, 0.1),
gray-200: rgba(255, 255, 255, 0.2),
body-background: #343a40,
body-font-color: #e9ecef,
color-link: #84b2ff,
color-visited-link: #b88dff,
icon-filter: brightness(0) invert(1),
);
[data-theme="dark"] {
@each $name, $value in $theme-dark {
--#{$name}: #{$value};
}
}
[data-theme="light"] {
@each $name, $value in $theme-light {
--#{$name}: #{$value};
}
}

View File

@ -1,50 +1,50 @@
// Used in layout
$padding-1: 1px !default;
$padding-4: 0.25rem !default;
$padding-8: 0.5rem !default;
$padding-16: 1rem !default;
$padding-1: 1px ;
$padding-4: 0.25rem ;
$padding-8: 0.5rem ;
$padding-16: 1rem ;
$font-size-base: 16px !default;
$font-size-12: 0.75rem !default;
$font-size-14: 0.875rem !default;
$font-size-16: 1rem !default;
$font-size-base: 16px ;
$font-size-12: 0.75rem ;
$font-size-14: 0.875rem ;
$font-size-16: 1rem ;
$border-radius: $padding-4 !default;
$border-radius: $padding-4 ;
// Grayscale
$white: #ffffff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;
$white: #ffffff ;
$gray-100: #f8f9fa ;
$gray-200: #e9ecef ;
$gray-300: #dee2e6 ;
$gray-400: #ced4da ;
$gray-500: #adb5bd ;
$gray-600: #868e96 ;
$gray-700: #495057 ;
$gray-800: #343a40 ;
$gray-900: #212529 ;
$black: #000 ;
$color-link: #05b !default;
$color-visited-link: #8440f1 !default;
$color-link: #05b ;
$color-visited-link: #8440f1 ;
$body-background: white !default;
$body-font-color: $black !default;
$body-font-weight: normal !default;
$body-background: white ;
$body-font-color: $black ;
$body-font-weight: normal ;
$body-min-width: 20rem !default;
$container-max-width: 80rem !default;
$body-min-width: 20rem ;
$container-max-width: 80rem ;
$header-height: 3.5rem !default;
$menu-width: 16rem !default;
$toc-width: 16rem !default;
$header-height: 3.5rem ;
$menu-width: 16rem ;
$toc-width: 16rem ;
$mobile-breakpoint: $menu-width + $body-min-width * 1.2 + $toc-width !default;
$mobile-breakpoint: $menu-width + $body-min-width * 1.2 + $toc-width ;
// Hint colors
$hint-colors: (
info: #6bf,
warning: #fd6,
danger: #f66
) !default;
) ;
$icon-filter: none !default;
$icon-filter: none ;

View File

@ -6,8 +6,8 @@ html {
body {
min-width: $body-min-width;
color: $body-font-color;
background: $body-background;
color: var(--body-font-color);
background: var(--body-background);
letter-spacing: 0.33px;
font-weight: $body-font-weight;
@ -31,7 +31,7 @@ h5 {
a {
text-decoration: none;
color: $color-link;
color: var(--color-link);
}
img {
@ -81,7 +81,7 @@ ul.pagination {
}
.book-icon {
filter: $icon-filter;
filter: var(--icon-filter);
}
.book-brand {
@ -102,7 +102,7 @@ ul.pagination {
nav {
width: $menu-width;
padding: $padding-16;
background: $body-background;
background: var(--body-background);
@include fixed;
}
@ -113,7 +113,7 @@ ul.pagination {
}
a.active {
color: $color-link;
color: var(--color-link);
}
a.collapsed {
@ -174,8 +174,8 @@ ul.pagination {
border: 0;
border-radius: $border-radius;
background: $gray-100;
color: $body-font-color;
background: var(--gray-100);
color: var(--body-font-color);
&:required + .book-search-spinner {
display: block;
@ -192,7 +192,7 @@ ul.pagination {
height: $padding-16;
border: $padding-1 solid transparent;
border-top-color: $body-font-color;
border-top-color: var(--body-font-color);
border-radius: 50%;
@include spin(1s);
@ -271,7 +271,7 @@ ul.pagination {
left: 0;
padding: $padding-8 0;
background: $body-background;
background: var(--body-background);
box-shadow: 0 0 $padding-4 rgba(0, 0, 0, 0.1);
li img {

View File

@ -58,7 +58,7 @@
text-decoration: underline;
}
&:visited {
color: $color-visited-link;
color: var(--color-visited-link);
}
}
@ -68,14 +68,14 @@
code {
padding: 0 $padding-4;
background: $gray-200;
background: var(--gray-200);
border-radius: $border-radius;
font-size: 0.875em;
}
pre {
padding: $padding-16;
background: $gray-100;
background: var(--gray-100);
border-radius: $border-radius;
overflow-x: auto;
@ -89,7 +89,7 @@
margin: $padding-16 0;
padding: $padding-8 $padding-16 $padding-8 ($padding-16 - $padding-4); //to keep total left space 16dp
border-inline-start: $padding-4 solid $gray-200;
border-inline-start: $padding-4 solid var(--gray-200);
border-radius: $border-radius;
:first-child {
@ -111,18 +111,18 @@
tr th,
tr td {
padding: $padding-8 $padding-16;
border: $padding-1 solid $gray-200;
border: $padding-1 solid var(--gray-200);
}
tr:nth-child(2n) {
background: $gray-100;
background: var(--gray-100);
}
}
hr {
height: $padding-1;
border: none;
background: $gray-200;
background: var(--gray-200);
}
ul,
@ -156,7 +156,7 @@
details {
padding: $padding-16;
border: $padding-1 solid $gray-200;
border: $padding-1 solid var(--gray-200);
border-radius: $border-radius;
summary {

View File

@ -4,13 +4,13 @@
margin-top: $padding-16;
margin-bottom: $padding-16;
border: $padding-1 solid $gray-200;
border: $padding-1 solid var(--gray-200);
border-radius: $border-radius;
overflow: hidden;
.book-expand-head {
background: $gray-100;
background: var(--gray-100);
padding: $padding-8 $padding-16;
cursor: pointer;
}
@ -30,7 +30,7 @@
margin-top: $padding-16;
margin-bottom: $padding-16;
border: $padding-1 solid $gray-200;
border: $padding-1 solid var(--gray-200);
border-radius: $border-radius;
overflow: hidden;
@ -48,13 +48,13 @@
.book-tabs-content {
order: 999; //Move content blocks to the end
width: 100%;
border-top: $padding-1 solid $gray-100;
border-top: $padding-1 solid var(--gray-100);
padding: $padding-16;
display: none;
}
input[type="radio"]:checked + label {
border-bottom: $padding-1 solid $color-link;
border-bottom: $padding-1 solid var(--color-link);
}
input[type="radio"]:checked + label + .book-tabs-content {
display: block;
@ -80,10 +80,10 @@
a.book-btn {
display: inline-block;
font-size: $font-size-14;
color: $color-link;
color: var(--color-link);
line-height: $padding-16 * 2;
padding: 0 $padding-16;
border: $padding-1 solid $color-link;
border: $padding-1 solid var(--color-link);
border-radius: $border-radius;
cursor: pointer;

View File

@ -10,8 +10,7 @@
<input type="checkbox" class="hidden toggle" id="menu-control" />
<input type="checkbox" class="hidden toggle" id="toc-control" />
<a href="https://github.com/halfrost/LeetCode-Go" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#64CEAA; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
<a href="https://github.com/halfrost/LeetCode-Go" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#64CEAA; color:#fff; position: absolute; top: 0; border: 0; left: 0; transform: scale(-1, 1);" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
<a href="https://github.com/halfrost/LeetCode-Go" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#64CEAA; color:#fff; position: absolute; top: 0; border: 0; right: 0;z-index: 100;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
<main class="container flex">
<aside class="book-menu">

File diff suppressed because it is too large Load Diff

View File

@ -1 +1,26 @@
<script src="/leetcode/prism.js"></script>
<script src="/leetcode/prism.js"></script>
<script async="async">
var html = document.documentElement;
var switcher = document.getElementsByClassName('js-toggle')[0];
if(typeof(Storage) !== 'undefined') {
if (localStorage.getItem('themeMode') == 'dark' || document.documentElement.getAttribute('data-theme') == 'dark') {
switcher.classList.add('js-toggle--checked');
}
switcher.classList.add('js-toggle--focus');
}
//Click on dark mode icon. Add dark mode classes and wrappers. Store user preference through sessions
switcher.addEventListener("click", function() {
this.classList.toggle('js-toggle--checked');
this.classList.add('js-toggle--focus');
//If dark mode is selected
if (this.classList.contains('js-toggle--checked')) {
html.setAttribute("data-theme","dark");
//Save user preference in storage
localStorage.setItem('themeMode', 'dark');
} else {
html.setAttribute("data-theme","light");
localStorage.setItem('themeMode', 'light');
}
})
</script>

View File

@ -3,4 +3,15 @@
<link href="{{ "apple-touch-icon-76x76.png" | relURL }}" rel="apple-touch-icon" sizes="76x76" />
<link href="{{ "apple-touch-icon-120x120.png" | relURL }}" rel="apple-touch-icon" sizes="120x120" />
<link href="{{ "apple-touch-icon-152x152.png" | relURL }}" rel="apple-touch-icon" sizes="152x152" />
<link href="{{ "apple-touch-icon-512x512.png" | relURL }}" rel="apple-touch-icon" sizes="512x512" />
<link href="{{ "apple-touch-icon-512x512.png" | relURL }}" rel="apple-touch-icon" sizes="512x512" />
<script>
var html = document.documentElement;
//Check Storage. Keep user preference on page reload
if (localStorage.getItem('themeMode') == 'dark') {
html.setAttribute("data-theme","dark");
}
if (localStorage.getItem('themeMode') == 'light') {
html.setAttribute("data-theme","light");
}
</script>

View File

@ -1,7 +1,23 @@
{{ if default true .Site.Params.BookSearch }}
<div class="book-search">
<input type="text" id="book-search-input" placeholder="{{ i18n "Search" }}" aria-label="{{ i18n "Search" }}" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
<div class="magic">
<div class="book-search">
<input type="text" id="book-search-input" placeholder="{{ i18n "Search" }}" aria-label="{{ i18n "Search" }}" maxlength="64" data-hotkeys="s/" />
<div class="book-search-spinner hidden"></div>
<ul id="book-search-results"></ul>
</div>
<div class="js-toggle-wrapper">
<div class="js-toggle">
<div class="js-toggle-track">
<div class="js-toggle-track-check">
<img src="data:image/png;base64,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" role="presentation" style="pointer-events: none;" width="16" height="16">
</div>
<div class="js-toggle-track-x">
<img src="data:image/png;base64,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" role="presentation" style="pointer-events: none;" width="16" height="16">
</div>
</div>
<div class="js-toggle-thumb"></div>
<input class="js-toggle-screenreader-only" type="checkbox" aria-label="Switch between Dark and Light mode">
</div>
</div>
</div>
{{ end }}