{{ .Title | markdownify }}
6 | 7 | {{- if .Params.toc }} 8 |9 | 13 |
14 | {{- end }} 15 | 16 | {{ with .Params.Cover }} 17 |
26 | 27 |
30 | 31 | {{- range . -}} 32 | {{.}} 33 | {{- end }} 34 |
35 | {{- end }} 36 | 37 | 38 |├── LICENSE ├── README.md ├── archetypes ├── default.md └── posts.md ├── assets ├── js │ ├── main.js │ ├── menu.js │ ├── prism.js │ └── theme.js └── scss │ ├── _buttons.scss │ ├── _fonts.scss │ ├── _footer.scss │ ├── _header.scss │ ├── _list.scss │ ├── _logo.scss │ ├── _main.scss │ ├── _menu.scss │ ├── _mixins.scss │ ├── _normalize.scss │ ├── _prism.scss │ ├── _sharing-buttons.scss │ ├── _single.scss │ ├── _variables.scss │ ├── main.scss │ └── style.scss ├── data └── langFlags.yaml ├── exampleSite ├── archetypes │ └── default.md ├── config.toml ├── content │ └── timeline │ │ ├── Amet_Mauris.md │ │ ├── Lorem_Ipsum.md │ │ ├── Lorem_Ipsum_Dolor.md │ │ └── Sapien_faucibus.md ├── resources │ └── _gen │ │ └── assets │ │ └── scss │ │ └── scss │ │ ├── main.scss_de1a7f5f1c8c46959803c429bb697ff0.content │ │ └── main.scss_de1a7f5f1c8c46959803c429bb697ff0.json └── static │ ├── bootstrap.min.css │ ├── css │ └── custom.css │ └── site.webmanifest ├── i18n ├── de.toml ├── en.toml ├── es.toml ├── fr.toml ├── hi.toml ├── it.toml ├── lmo.toml ├── ml.toml ├── pt-br.toml └── tr.toml ├── images ├── screenshot.png └── tn.png ├── layouts ├── 404.html ├── _default │ ├── baseof.html │ ├── list.html │ └── single.html ├── index.html ├── partials │ ├── favicons.html │ ├── footer.html │ ├── head.html │ ├── header.html │ ├── javascript.html │ ├── logo.html │ ├── menu.html │ ├── pagination.html │ ├── sharing-buttons.html │ ├── social-icons.html │ ├── svg.html │ └── theme-icon.html ├── shortcodes │ └── image.html └── timeline │ ├── list.html │ ├── rss.xml │ └── single.html ├── static └── fonts │ ├── Inter-UI-Bold.woff │ ├── Inter-UI-Bold.woff2 │ ├── Inter-UI-BoldItalic.woff │ ├── Inter-UI-BoldItalic.woff2 │ ├── Inter-UI-Italic.woff │ ├── Inter-UI-Italic.woff2 │ ├── Inter-UI-Medium.woff │ ├── Inter-UI-Medium.woff2 │ ├── Inter-UI-MediumItalic.woff │ ├── Inter-UI-MediumItalic.woff2 │ ├── Inter-UI-Regular.woff │ └── Inter-UI-Regular.woff2 └── theme.toml /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Sanoop Thomas 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # hugo-theme-timeline 2 | Simple hugo theme to display your timeline. 3 | 4 |  5 | 6 | ### Example - https://devilslab.in/timeline/ 7 | 8 | ### Features 9 | 10 | * dark/light mode, default is black. 11 | * customizable timeline options. 12 | * automatic timeline sorting based on the date (latest one shows first). 13 | * minimal design. 14 | 15 | ### Usage 16 | 17 | Clone the repository into the theme directory of your hugo project 18 | 19 | ``` 20 | git clone https://github.com/s4n7h0/hugo-theme-timeline.git themes/timeline 21 | ``` 22 | 23 | ### Credits and License 24 | 25 | The theme is heavily inspired by hello-friend-ng hugo theme, a modified work by Djordje Atlialp. The theme is released under the MIT License. 26 | -------------------------------------------------------------------------------- /archetypes/default.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "{{ replace .Name "-" " " | title }}" 3 | date: {{ .Date }} 4 | draft: true 5 | comments: false 6 | images: 7 | --- 8 | 9 | -------------------------------------------------------------------------------- /archetypes/posts.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "{{ replace .Name "-" " " | title }}" 3 | date: {{ .Date }} 4 | draft: true 5 | toc: false 6 | images: 7 | tags: 8 | - untagged 9 | --- 10 | 11 | -------------------------------------------------------------------------------- /assets/js/main.js: -------------------------------------------------------------------------------- 1 | // Some code could be here ... 2 | -------------------------------------------------------------------------------- /assets/js/menu.js: -------------------------------------------------------------------------------- 1 | // Mobile menu 2 | 3 | const menuTrigger = document.querySelector(".menu-trigger"); 4 | const menu = document.querySelector(".menu"); 5 | const mobileQuery = getComputedStyle(document.body).getPropertyValue( 6 | "--phoneWidth" 7 | ); 8 | const isMobile = () => window.matchMedia(mobileQuery).matches; 9 | const isMobileMenu = () => { 10 | menuTrigger && menuTrigger.classList.toggle("hidden", !isMobile()); 11 | menu && menu.classList.toggle("hidden", isMobile()); 12 | }; 13 | 14 | isMobileMenu(); 15 | 16 | menuTrigger && 17 | menuTrigger.addEventListener( 18 | "click", 19 | () => menu && menu.classList.toggle("hidden") 20 | ); 21 | 22 | window.addEventListener("resize", isMobileMenu); 23 | -------------------------------------------------------------------------------- /assets/js/theme.js: -------------------------------------------------------------------------------- 1 | // Toggle theme 2 | 3 | const theme = window.localStorage && window.localStorage.getItem("theme"); 4 | const themeToggle = document.querySelector(".theme-toggle"); 5 | const isDark = theme === "dark"; 6 | var metaThemeColor = document.querySelector("meta[name=theme-color]"); 7 | 8 | if (theme !== null) { 9 | document.body.classList.toggle("dark-theme", isDark); 10 | isDark 11 | ? metaThemeColor.setAttribute("content", "#252627") 12 | : metaThemeColor.setAttribute("content", "#fafafa"); 13 | } 14 | 15 | themeToggle.addEventListener("click", () => { 16 | document.body.classList.toggle("dark-theme"); 17 | window.localStorage && 18 | window.localStorage.setItem( 19 | "theme", 20 | document.body.classList.contains("dark-theme") ? "dark" : "light" 21 | ); 22 | document.body.classList.contains("dark-theme") 23 | ? metaThemeColor.setAttribute("content", "#252627") 24 | : metaThemeColor.setAttribute("content", "#fafafa"); 25 | }); 26 | -------------------------------------------------------------------------------- /assets/scss/_buttons.scss: -------------------------------------------------------------------------------- 1 | .button-container { 2 | display: table; 3 | margin-left: auto; 4 | margin-right: auto; 5 | } 6 | 7 | button, 8 | .button, 9 | a.button { 10 | position: relative; 11 | display: flex; 12 | align-items: center; 13 | justify-content: center; 14 | padding: 8px 18px; 15 | margin-bottom: 5px; 16 | background: $light-background-secondary; 17 | text-decoration: none; 18 | text-align: center; 19 | font-weight: 500; 20 | border-radius: 8px; 21 | border: 1px solid transparent; 22 | appearance: none; 23 | cursor: pointer; 24 | outline: none; 25 | 26 | .dark-theme & { 27 | background: $dark-background-secondary; 28 | color: inherit; 29 | } 30 | 31 | /* variants */ 32 | 33 | &.outline { 34 | background: transparent; 35 | border-color: $light-background-secondary; 36 | box-shadow: none; 37 | padding: 8px 18px; 38 | 39 | .dark-theme & { 40 | border-color: $dark-background-secondary; 41 | color: inherit; 42 | } 43 | 44 | :hover { 45 | transform: none; 46 | box-shadow: none; 47 | } 48 | } 49 | 50 | &.primary { 51 | box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08); 52 | 53 | &:hover { 54 | box-shadow: 0 2px 6px rgba(50, 50, 93, .21), 0 1px 3px rgba(0, 0, 0, .08); 55 | } 56 | } 57 | 58 | &.link { 59 | background: none; 60 | font-size: 1rem; 61 | } 62 | 63 | &.small { 64 | font-size: .8rem; 65 | } 66 | 67 | &.wide { 68 | min-width: 200px; 69 | padding: 14px 24px; 70 | } 71 | } 72 | 73 | .code-toolbar { 74 | margin-bottom: 20px; 75 | 76 | .toolbar-item a { 77 | position: relative; 78 | display: inline-flex; 79 | align-items: center; 80 | justify-content: center; 81 | padding: 3px 8px; 82 | margin-bottom: 5px; 83 | background: $light-background-secondary; 84 | text-decoration: none; 85 | text-align: center; 86 | font-size: 13px; 87 | font-weight: 500; 88 | border-radius: 8px; 89 | border: 1px solid transparent; 90 | appearance: none; 91 | cursor: pointer; 92 | outline: none; 93 | 94 | .dark-theme & { 95 | background: $dark-background-secondary; 96 | color: inherit; 97 | } 98 | } 99 | } 100 | -------------------------------------------------------------------------------- /assets/scss/_fonts.scss: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'Inter UI'; 3 | font-style: normal; 4 | font-display: auto; 5 | font-weight: 400; 6 | src: url("../fonts/Inter-UI-Regular.woff2") format("woff2"), 7 | url("../fonts/Inter-UI-Regular.woff") format("woff"); 8 | } 9 | @font-face { 10 | font-family: 'Inter UI'; 11 | font-style: italic; 12 | font-display: auto; 13 | font-weight: 400; 14 | src: url("../fonts/Inter-UI-Italic.woff2") format("woff2"), 15 | url("../fonts/Inter-UI-Italic.woff") format("woff"); 16 | } 17 | 18 | @font-face { 19 | font-family: 'Inter UI'; 20 | font-style: normal; 21 | font-display: auto; 22 | font-weight: 600; 23 | src: url("../fonts/Inter-UI-Medium.woff2") format("woff2"), 24 | url("../fonts/Inter-UI-Medium.woff") format("woff"); 25 | } 26 | @font-face { 27 | font-family: 'Inter UI'; 28 | font-style: italic; 29 | font-display: auto; 30 | font-weight: 600; 31 | src: url("../fonts/Inter-UI-MediumItalic.woff2") format("woff2"), 32 | url("../fonts/Inter-UI-MediumItalic.woff") format("woff"); 33 | } 34 | 35 | @font-face { 36 | font-family: 'Inter UI'; 37 | font-style: normal; 38 | font-display: auto; 39 | font-weight: 800; 40 | src: url("../fonts/Inter-UI-Bold.woff2") format("woff2"), 41 | url("../fonts/Inter-UI-Bold.woff") format("woff"); 42 | } 43 | @font-face { 44 | font-family: 'Inter UI'; 45 | font-style: italic; 46 | font-display: auto; 47 | font-weight: 800; 48 | src: url("../fonts/Inter-UI-BoldItalic.woff2") format("woff2"), 49 | url("../fonts/Inter-UI-BoldItalic.woff") format("woff"); 50 | } 51 | -------------------------------------------------------------------------------- /assets/scss/_footer.scss: -------------------------------------------------------------------------------- 1 | .footer { 2 | padding: 40px 20px; 3 | flex-grow: 0; 4 | color: $light-color-secondary; 5 | 6 | &__inner { 7 | display: flex; 8 | align-items: center; 9 | justify-content: center; 10 | margin: 0 auto; 11 | width: 760px; 12 | max-width: 100%; 13 | 14 | @media #{$media-size-tablet} { 15 | flex-direction: column; 16 | } 17 | } 18 | 19 | &__content { 20 | display: flex; 21 | flex-direction: row; 22 | align-items: center; 23 | font-size: 1rem; 24 | color: $light-color-secondary; 25 | 26 | @media #{$media-size-tablet} { 27 | flex-direction: column; 28 | margin-top: 10px; 29 | } 30 | 31 | & > *:not(:last-child)::after { 32 | content: "•"; 33 | padding: 0 5px; 34 | 35 | @media #{$media-size-tablet} { 36 | content: ""; 37 | padding: 0; 38 | } 39 | } 40 | 41 | & > *:last-child { 42 | padding: 0 5px; 43 | 44 | @media #{$media-size-tablet} { 45 | padding: 0; 46 | } 47 | } 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /assets/scss/_header.scss: -------------------------------------------------------------------------------- 1 | .header { 2 | background: #fafafa; 3 | display: flex; 4 | align-items: center; 5 | justify-content: center; 6 | position: relative; 7 | padding: 20px; 8 | 9 | .dark-theme & { 10 | background: #252627; 11 | } 12 | 13 | &__right { 14 | display: flex; 15 | flex-direction: row; 16 | align-items: center; 17 | 18 | @media #{$media-size-phone} { 19 | flex-direction: row-reverse; 20 | } 21 | } 22 | 23 | &__inner { 24 | display: flex; 25 | align-items: center; 26 | justify-content: space-between; 27 | margin: 0 auto; 28 | width: 760px; 29 | max-width: 100%; 30 | } 31 | } 32 | 33 | .theme-toggle { 34 | display: flex; 35 | align-items: center; 36 | justify-content: center; 37 | line-height: 1; 38 | cursor: pointer; 39 | } 40 | 41 | .theme-toggler { 42 | fill: currentColor; 43 | } 44 | 45 | .unselectable { 46 | user-select: none; 47 | -webkit-user-select: none; 48 | -moz-user-select: none; 49 | -ms-user-select: none; 50 | } -------------------------------------------------------------------------------- /assets/scss/_list.scss: -------------------------------------------------------------------------------- 1 | .posts { 2 | width: 100%; 3 | max-width: 800px; 4 | text-align: left; 5 | padding: 20px; 6 | margin: 20px auto; 7 | 8 | @media #{$media-size-tablet} { 9 | max-width: 660px; 10 | } 11 | 12 | &:not(:last-of-type) { 13 | border-bottom: 1px solid $light-border-color; 14 | 15 | .dark-theme & { 16 | border-color: $dark-border-color; 17 | } 18 | } 19 | 20 | &-group { 21 | display: flex; 22 | margin-bottom: 1.9em; 23 | line-height: normal; 24 | 25 | @media #{$media-size-tablet} { 26 | display: block; 27 | } 28 | } 29 | 30 | &-list { 31 | flex-grow: 1; 32 | margin: 0; 33 | padding: 0; 34 | list-style: none; 35 | } 36 | 37 | .post { 38 | &-title { 39 | font-size: 1rem; 40 | margin: 5px 0 5px 0; 41 | } 42 | 43 | &-year { 44 | padding-top: 6px; 45 | margin-right: 1.8em; 46 | font-size: 1.6em; 47 | @include dimmed; 48 | 49 | @media #{$media-size-tablet} { 50 | margin: -6px 0 4px; 51 | } 52 | } 53 | 54 | &-item { 55 | border-bottom: 1px grey dashed; 56 | 57 | a { 58 | display: flex; 59 | justify-content: space-between; 60 | align-items: baseline; 61 | padding: 12px 0; 62 | text-decoration: none; 63 | } 64 | } 65 | 66 | &-day { 67 | flex-shrink: 0; 68 | margin-left: 1em; 69 | @include dimmed; 70 | } 71 | } 72 | } 73 | -------------------------------------------------------------------------------- /assets/scss/_logo.scss: -------------------------------------------------------------------------------- 1 | .logo { 2 | display: flex; 3 | align-items: center; 4 | text-decoration: none; 5 | font-weight: bold; 6 | font-display: auto; 7 | font-family: monospace, monospace; 8 | 9 | img { 10 | height: 44px; 11 | } 12 | 13 | &__mark { 14 | margin-right: 5px; 15 | } 16 | 17 | &__text { 18 | font-size: 1.125rem; 19 | } 20 | 21 | &__cursor { 22 | display: inline-block; 23 | width: 10px; 24 | height: 1rem; 25 | background: #fe5186; 26 | margin-left: 5px; 27 | border-radius: 1px; 28 | animation: cursor 1s infinite; 29 | } 30 | 31 | @media (prefers-reduced-motion: reduce) { 32 | &__cursor { 33 | animation: none; 34 | } 35 | } 36 | 37 | } 38 | 39 | @keyframes cursor { 40 | 0% { opacity: 0; } 41 | 50% { opacity: 1; } 42 | 100% { opacity: 0; } 43 | } 44 | -------------------------------------------------------------------------------- /assets/scss/_main.scss: -------------------------------------------------------------------------------- 1 | html { 2 | box-sizing: border-box; 3 | line-height: 1.6; 4 | letter-spacing: .06em; 5 | scroll-behavior: smooth; 6 | } 7 | 8 | *, 9 | *:before, 10 | *:after { 11 | box-sizing: inherit; 12 | } 13 | 14 | body { 15 | margin: 0; 16 | padding: 0; 17 | font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", Helvetica, Arial, sans-serif; 18 | font-display: auto; 19 | font-size: 1rem; 20 | line-height: 1.54; 21 | background-color: $light-background; 22 | color: $light-color; 23 | text-rendering: optimizeLegibility; 24 | -webkit-font-smoothing: antialiased; 25 | font-feature-settings: "liga", "tnum", "case", "calt", "zero", "ss01", "locl"; 26 | -webkit-overflow-scrolling: touch; 27 | -webkit-text-size-adjust: 100%; 28 | 29 | display: flex; 30 | min-height: 100vh; 31 | flex-direction: column; 32 | 33 | @media #{$media-size-phone} { 34 | font-size: 1rem; 35 | } 36 | 37 | &.dark-theme { 38 | background-color: $dark-background; 39 | color: $dark-color; 40 | } 41 | } 42 | 43 | h2, h3, h4, h5, h6 { 44 | display: flex; 45 | align-items: center; 46 | line-height: 1.3; 47 | } 48 | 49 | h1 { 50 | font-size: 2.625rem; 51 | } 52 | 53 | h2 { 54 | font-size: 1.625rem; 55 | } 56 | 57 | h3 { 58 | font-size: 1.375rem; 59 | } 60 | 61 | h4 { 62 | font-size: 1.125rem; 63 | } 64 | 65 | @media #{$media-size-phone} { 66 | h1 { 67 | font-size: 2rem; 68 | } 69 | 70 | h2 { 71 | font-size: 1.4rem; 72 | } 73 | 74 | h3 { 75 | font-size: 1.15rem; 76 | } 77 | 78 | h4 { 79 | font-size: 1.125rem; 80 | } 81 | } 82 | 83 | a { 84 | color: inherit; 85 | } 86 | 87 | img { 88 | display: block; 89 | max-width: 100%; 90 | 91 | &.left { 92 | margin-right: auto; 93 | } 94 | 95 | &.center { 96 | margin-left: auto; 97 | margin-right: auto; 98 | } 99 | 100 | &.right { 101 | margin-left: auto; 102 | } 103 | &.circle { 104 | border-radius: 50%; 105 | max-width: 25%; 106 | margin: auto; 107 | } 108 | } 109 | 110 | figure { 111 | display: table; 112 | max-width: 100%; 113 | margin: 25px 0; 114 | 115 | &.left { 116 | margin-right: auto; 117 | } 118 | 119 | &.left-floated { 120 | margin-right: auto; 121 | float: left; 122 | img { 123 | margin: 20px 20px 20px 0; 124 | } 125 | } 126 | 127 | &.center { 128 | margin-left: auto; 129 | margin-right: auto; 130 | } 131 | 132 | &.right { 133 | margin-left: auto; 134 | } 135 | 136 | &.right-floated { 137 | margin-left: auto; 138 | float: right; 139 | img { 140 | margin: 20px 0 20px 20px; 141 | } 142 | } 143 | 144 | &.rounded { 145 | img { 146 | border-radius: 50%; 147 | } 148 | } 149 | 150 | figcaption { 151 | font-size: 14px; 152 | margin-top: 5px; 153 | opacity: .8; 154 | 155 | &.left { 156 | text-align: left; 157 | } 158 | 159 | &.center { 160 | text-align: center; 161 | } 162 | 163 | &.right { 164 | text-align: right; 165 | } 166 | } 167 | } 168 | 169 | code { 170 | font-family: Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace; 171 | font-display: auto; 172 | font-feature-settings: normal; 173 | background: $light-background-secondary; 174 | padding: 1px 6px; 175 | margin: 0 2px; 176 | border-radius: 5px; 177 | font-size: .95rem; 178 | 179 | .dark-theme & { 180 | background: $dark-background-secondary; 181 | } 182 | } 183 | 184 | pre { 185 | background: #212020; 186 | padding: 10px 10px 10px 20px; 187 | border-radius: 8px; 188 | font-size: .95rem; 189 | overflow: auto; 190 | 191 | @media #{$media-size-phone} { 192 | white-space: pre-wrap; 193 | word-wrap: break-word; 194 | } 195 | 196 | code { 197 | background: none !important; 198 | color: #ccc; 199 | margin: 0; 200 | padding: 0; 201 | font-size: inherit; 202 | 203 | .dark-theme & { 204 | color: inherit; 205 | } 206 | } 207 | } 208 | 209 | blockquote { 210 | border-left: 2px solid; 211 | margin: 40px; 212 | padding: 10px 20px; 213 | 214 | @media #{$media-size-phone} { 215 | margin: 10px; 216 | padding: 10px; 217 | } 218 | 219 | &:before { 220 | content: '”'; 221 | font-family: Georgia, serif; 222 | font-display: auto; 223 | font-size: 3.875rem; 224 | position: absolute; 225 | left: -40px; 226 | top: -20px; 227 | } 228 | 229 | p:first-of-type { 230 | margin-top: 0; 231 | } 232 | 233 | p:last-of-type { 234 | margin-bottom: 0; 235 | } 236 | } 237 | 238 | ul, ol { 239 | margin-left: 40px; 240 | padding: 0; 241 | 242 | @media #{$media-size-phone} { 243 | margin-left: 20px; 244 | } 245 | } 246 | 247 | ol ol { 248 | list-style-type: lower-alpha; 249 | } 250 | 251 | .container { 252 | flex: 1 auto; 253 | display: flex; 254 | flex-direction: column; 255 | justify-content: center; 256 | text-align: center; 257 | } 258 | 259 | .content { 260 | display: flex; 261 | flex-direction: column; 262 | flex: 1 auto; 263 | align-items: center; 264 | justify-content: center; 265 | margin: 0; 266 | 267 | @media #{$media-size-phone} { 268 | margin-top: 0; 269 | } 270 | } 271 | 272 | hr { 273 | width: 100%; 274 | border: none; 275 | background: $light-border-color; 276 | height: 1px; 277 | 278 | .dark-theme & { 279 | background: $dark-border-color; 280 | } 281 | } 282 | 283 | .hidden { 284 | display: none; 285 | } 286 | 287 | .hide-on-phone { 288 | @media #{$media-size-phone} { 289 | display: none; 290 | } 291 | } 292 | 293 | .hide-on-tablet { 294 | @media #{$media-size-tablet} { 295 | display: none; 296 | } 297 | } 298 | 299 | // Accessibility 300 | .screen-reader-text { 301 | border: 0; 302 | clip: rect(1px, 1px, 1px, 1px); 303 | clip-path: inset(50%); 304 | height: 1px; 305 | margin: -1px; 306 | overflow: hidden; 307 | padding: 0; 308 | position: absolute !important; 309 | width: 1px; 310 | word-wrap: normal !important; 311 | } 312 | 313 | .screen-reader-text:focus { 314 | background-color: #f1f1f1; 315 | border-radius: 3px; 316 | box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); 317 | clip: auto !important; 318 | clip-path: none; 319 | color: #21759b; 320 | display: block; 321 | font-size: 14px; 322 | font-size: 0.875rem; 323 | font-weight: bold; 324 | height: auto; 325 | width: auto; 326 | top: 5px; 327 | left: 5px; 328 | line-height: normal; 329 | padding: 15px 23px 14px; 330 | text-decoration: none; 331 | z-index: 100000; 332 | } 333 | -------------------------------------------------------------------------------- /assets/scss/_menu.scss: -------------------------------------------------------------------------------- 1 | .menu { 2 | background: #fafafa; 3 | border-right: 1px solid; 4 | margin-right: 18px; 5 | z-index: 9999; 6 | 7 | .dark-theme & { 8 | background: #252627; 9 | } 10 | 11 | @media #{$media-size-phone} { 12 | position: absolute; 13 | top: 50px; 14 | right: 0; 15 | border: none; 16 | margin: 0; 17 | padding: 10px; 18 | } 19 | 20 | &__inner { 21 | display: flex; 22 | align-items: center; 23 | justify-content: flex-start; 24 | max-width: 100%; 25 | margin: 0 auto; 26 | padding: 0 15px; 27 | font-size: 1rem; 28 | list-style: none; 29 | 30 | li { 31 | margin: 0 12px; 32 | } 33 | 34 | @media #{$media-size-phone} { 35 | flex-direction: column; 36 | align-items: flex-start; 37 | padding: 0; 38 | 39 | li { 40 | margin: 0; 41 | padding: 5px; 42 | } 43 | } 44 | } 45 | 46 | &-trigger { 47 | width: 24px; 48 | height: 24px; 49 | fill: currentColor; 50 | margin-left: 10px; 51 | cursor: pointer; 52 | } 53 | 54 | a { 55 | display: inline-block; 56 | margin-right: 15px; 57 | text-decoration: none; 58 | 59 | &:hover { 60 | text-decoration: underline; 61 | } 62 | 63 | &:last-of-type { 64 | margin-right: 0; 65 | } 66 | } 67 | } 68 | -------------------------------------------------------------------------------- /assets/scss/_mixins.scss: -------------------------------------------------------------------------------- 1 | @mixin dimmed { 2 | opacity: .6; 3 | } 4 | -------------------------------------------------------------------------------- /assets/scss/_normalize.scss: -------------------------------------------------------------------------------- 1 | /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 2 | 3 | /* Document 4 | ========================================================================== */ 5 | 6 | /** 7 | * 1. Correct the line height in all browsers. 8 | * 2. Prevent adjustments of font size after orientation changes in iOS. 9 | */ 10 | 11 | /* Webkit Scrollbar Customize */ 12 | ::-webkit-scrollbar { 13 | width: 8px; 14 | height: 8px; 15 | background: #212020; 16 | } 17 | 18 | ::-webkit-scrollbar-thumb { 19 | background: #888; 20 | 21 | &:hover { 22 | background: #dcdcdc; 23 | } 24 | } 25 | 26 | html { 27 | line-height: 1.15; /* 1 */ 28 | -webkit-text-size-adjust: 100%; /* 2 */ 29 | } 30 | 31 | /* Sections 32 | ========================================================================== */ 33 | 34 | /** 35 | * Remove the margin in all browsers. 36 | */ 37 | 38 | body { 39 | margin: 0; 40 | } 41 | 42 | /** 43 | * Render the `main` element consistently in IE. 44 | */ 45 | 46 | main { 47 | display: block; 48 | } 49 | 50 | /** 51 | * Correct the font size and margin on `h1` elements within `section` and 52 | * `article` contexts in Chrome, Firefox, and Safari. 53 | */ 54 | 55 | h1 { 56 | font-size: 2em; 57 | margin: 0.67em 0; 58 | } 59 | 60 | /* Grouping content 61 | ========================================================================== */ 62 | 63 | /** 64 | * 1. Add the correct box sizing in Firefox. 65 | * 2. Show the overflow in Edge and IE. 66 | */ 67 | 68 | hr { 69 | box-sizing: content-box; /* 1 */ 70 | height: 0; /* 1 */ 71 | overflow: visible; /* 2 */ 72 | } 73 | 74 | /** 75 | * 1. Correct the inheritance and scaling of font size in all browsers. 76 | * 2. Correct the odd `em` font sizing in all browsers. 77 | */ 78 | 79 | pre { 80 | font-family: monospace, monospace; /* 1 */ 81 | font-display: auto; 82 | font-size: 1em; /* 2 */ 83 | } 84 | 85 | /* Text-level semantics 86 | ========================================================================== */ 87 | 88 | /** 89 | * Remove the gray background on active links in IE 10. 90 | */ 91 | 92 | a { 93 | background-color: transparent; 94 | } 95 | 96 | /** 97 | * 1. Remove the bottom border in Chrome 57- 98 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 99 | */ 100 | 101 | abbr[title] { 102 | border-bottom: none; /* 1 */ 103 | text-decoration: underline; /* 2 */ 104 | text-decoration: underline dotted; /* 2 */ 105 | } 106 | 107 | /** 108 | * Add the correct font weight in Chrome, Edge, and Safari. 109 | */ 110 | 111 | b, 112 | strong { 113 | font-weight: bolder; 114 | } 115 | 116 | /** 117 | * 1. Correct the inheritance and scaling of font size in all browsers. 118 | * 2. Correct the odd `em` font sizing in all browsers. 119 | */ 120 | 121 | code, 122 | kbd, 123 | samp { 124 | font-family: monospace, monospace; /* 1 */ 125 | font-display: auto; 126 | font-size: 1em; /* 2 */ 127 | } 128 | 129 | /** 130 | * Add the correct font size in all browsers. 131 | */ 132 | 133 | small { 134 | font-size: 80%; 135 | } 136 | 137 | /** 138 | * Prevent `sub` and `sup` elements from affecting the line height in 139 | * all browsers. 140 | */ 141 | 142 | sub, 143 | sup { 144 | font-size: 75%; 145 | line-height: 0; 146 | position: relative; 147 | vertical-align: baseline; 148 | } 149 | 150 | sub { 151 | bottom: -0.25em; 152 | } 153 | 154 | sup { 155 | top: -0.5em; 156 | } 157 | 158 | /* Embedded content 159 | ========================================================================== */ 160 | 161 | /** 162 | * Remove the border on images inside links in IE 10. 163 | */ 164 | 165 | img { 166 | border-style: none; 167 | } 168 | 169 | /* Forms 170 | ========================================================================== */ 171 | 172 | /** 173 | * 1. Change the font styles in all browsers. 174 | * 2. Remove the margin in Firefox and Safari. 175 | */ 176 | 177 | button, 178 | input, 179 | optgroup, 180 | select, 181 | textarea { 182 | font-family: inherit; /* 1 */ 183 | font-display: auto; 184 | font-size: 100%; /* 1 */ 185 | line-height: 1.15; /* 1 */ 186 | margin: 0; /* 2 */ 187 | } 188 | 189 | /** 190 | * Show the overflow in IE. 191 | * 1. Show the overflow in Edge. 192 | */ 193 | 194 | button, 195 | input { /* 1 */ 196 | overflow: visible; 197 | } 198 | 199 | /** 200 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 201 | * 1. Remove the inheritance of text transform in Firefox. 202 | */ 203 | 204 | button, 205 | select { /* 1 */ 206 | text-transform: none; 207 | } 208 | 209 | /** 210 | * Correct the inability to style clickable types in iOS and Safari. 211 | */ 212 | 213 | button, 214 | [type="button"], 215 | [type="reset"], 216 | [type="submit"] { 217 | -webkit-appearance: button; 218 | } 219 | 220 | /** 221 | * Remove the inner border and padding in Firefox. 222 | */ 223 | 224 | button::-moz-focus-inner, 225 | [type="button"]::-moz-focus-inner, 226 | [type="reset"]::-moz-focus-inner, 227 | [type="submit"]::-moz-focus-inner { 228 | border-style: none; 229 | padding: 0; 230 | } 231 | 232 | /** 233 | * Restore the focus styles unset by the previous rule. 234 | */ 235 | 236 | button:-moz-focusring, 237 | [type="button"]:-moz-focusring, 238 | [type="reset"]:-moz-focusring, 239 | [type="submit"]:-moz-focusring { 240 | outline: 1px dotted ButtonText; 241 | } 242 | 243 | /** 244 | * Correct the padding in Firefox. 245 | */ 246 | 247 | fieldset { 248 | padding: 0.35em 0.75em 0.625em; 249 | } 250 | 251 | /** 252 | * 1. Correct the text wrapping in Edge and IE. 253 | * 2. Correct the color inheritance from `fieldset` elements in IE. 254 | * 3. Remove the padding so developers are not caught out when they zero out 255 | * `fieldset` elements in all browsers. 256 | */ 257 | 258 | legend { 259 | box-sizing: border-box; /* 1 */ 260 | color: inherit; /* 2 */ 261 | display: table; /* 1 */ 262 | max-width: 100%; /* 1 */ 263 | padding: 0; /* 3 */ 264 | white-space: normal; /* 1 */ 265 | } 266 | 267 | /** 268 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 269 | */ 270 | 271 | progress { 272 | vertical-align: baseline; 273 | } 274 | 275 | /** 276 | * Remove the default vertical scrollbar in IE 10+. 277 | */ 278 | 279 | textarea { 280 | overflow: auto; 281 | } 282 | 283 | /** 284 | * 1. Add the correct box sizing in IE 10. 285 | * 2. Remove the padding in IE 10. 286 | */ 287 | 288 | [type="checkbox"], 289 | [type="radio"] { 290 | box-sizing: border-box; /* 1 */ 291 | padding: 0; /* 2 */ 292 | } 293 | 294 | /** 295 | * Correct the cursor style of increment and decrement buttons in Chrome. 296 | */ 297 | 298 | [type="number"]::-webkit-inner-spin-button, 299 | [type="number"]::-webkit-outer-spin-button { 300 | height: auto; 301 | } 302 | 303 | /** 304 | * 1. Correct the odd appearance in Chrome and Safari. 305 | * 2. Correct the outline style in Safari. 306 | */ 307 | 308 | [type="search"] { 309 | -webkit-appearance: textfield; /* 1 */ 310 | outline-offset: -2px; /* 2 */ 311 | } 312 | 313 | /** 314 | * Remove the inner padding in Chrome and Safari on macOS. 315 | */ 316 | 317 | [type="search"]::-webkit-search-decoration { 318 | -webkit-appearance: none; 319 | } 320 | 321 | /** 322 | * 1. Correct the inability to style clickable types in iOS and Safari. 323 | * 2. Change font properties to `inherit` in Safari. 324 | */ 325 | 326 | ::-webkit-file-upload-button { 327 | -webkit-appearance: button; /* 1 */ 328 | font: inherit; /* 2 */ 329 | } 330 | 331 | /* Interactive 332 | ========================================================================== */ 333 | 334 | /* 335 | * Add the correct display in Edge, IE 10+, and Firefox. 336 | */ 337 | 338 | details { 339 | display: block; 340 | } 341 | 342 | /* 343 | * Add the correct display in all browsers. 344 | */ 345 | 346 | summary { 347 | display: list-item; 348 | } 349 | 350 | /* Misc 351 | ========================================================================== */ 352 | 353 | /** 354 | * Add the correct display in IE 10+. 355 | */ 356 | 357 | template { 358 | display: none; 359 | } 360 | 361 | /** 362 | * Add the correct display in IE 10. 363 | */ 364 | 365 | [hidden] { 366 | display: none; 367 | } 368 | -------------------------------------------------------------------------------- /assets/scss/_prism.scss: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.20.0 2 | https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+arduino+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+c+csharp+cpp+cil+coffeescript+clojure+crystal+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+erb+erlang+fsharp+flow+fortran+gcode+gedcom+gherkin+git+glsl+gml+go+graphql+groovy+haml+handlebars+haskell+haxe+hcl+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+javastacktrace+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+markup-templating+matlab+mel+mizar+monkey+n1ql+n4js+nand2tetris-hdl+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+plsql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+tsx+renpy+reason+rest+rip+roboconf+ruby+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+soy+sql+stylus+swift+tap+tcl+textile+toml+tt2+twig+typescript+vala+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+xquery+yaml */ 3 | /** 4 | * prism.js tomorrow night eighties for JavaScript, CoffeeScript, CSS and HTML 5 | * Based on https://github.com/chriskempson/tomorrow-theme 6 | * @author Rose Pritchard 7 | */ 8 | 9 | code[class*="language-"], 10 | pre[class*="language-"] { 11 | color: #ccc; 12 | background: none; 13 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 14 | font-size: 1em; 15 | text-align: left; 16 | white-space: pre; 17 | word-spacing: normal; 18 | word-break: normal; 19 | word-wrap: normal; 20 | line-height: 1.5; 21 | 22 | -moz-tab-size: 4; 23 | -o-tab-size: 4; 24 | tab-size: 4; 25 | 26 | -webkit-hyphens: none; 27 | -moz-hyphens: none; 28 | -ms-hyphens: none; 29 | hyphens: none; 30 | 31 | } 32 | 33 | /* Code blocks */ 34 | pre[class*="language-"] { 35 | padding: 1em; 36 | margin: .5em 0; 37 | overflow: auto; 38 | } 39 | 40 | :not(pre) > code[class*="language-"], 41 | pre[class*="language-"] { 42 | background: #2d2d2d; 43 | } 44 | 45 | /* Inline code */ 46 | :not(pre) > code[class*="language-"] { 47 | padding: .1em; 48 | border-radius: .3em; 49 | white-space: normal; 50 | } 51 | 52 | .token.comment, 53 | .token.block-comment, 54 | .token.prolog, 55 | .token.doctype, 56 | .token.cdata { 57 | color: #999; 58 | } 59 | 60 | .token.punctuation { 61 | color: #ccc; 62 | } 63 | 64 | .token.tag, 65 | .token.attr-name, 66 | .token.namespace, 67 | .token.deleted { 68 | color: #e2777a; 69 | } 70 | 71 | .token.function-name { 72 | color: #6196cc; 73 | } 74 | 75 | .token.boolean, 76 | .token.number, 77 | .token.function { 78 | color: #f08d49; 79 | } 80 | 81 | .token.property, 82 | .token.class-name, 83 | .token.constant, 84 | .token.symbol { 85 | color: #f8c555; 86 | } 87 | 88 | .token.selector, 89 | .token.important, 90 | .token.atrule, 91 | .token.keyword, 92 | .token.builtin { 93 | color: #cc99cd; 94 | } 95 | 96 | .token.string, 97 | .token.char, 98 | .token.attr-value, 99 | .token.regex, 100 | .token.variable { 101 | color: #7ec699; 102 | } 103 | 104 | .token.operator, 105 | .token.entity, 106 | .token.url { 107 | color: #67cdcc; 108 | } 109 | 110 | .token.important, 111 | .token.bold { 112 | font-weight: bold; 113 | } 114 | .token.italic { 115 | font-style: italic; 116 | } 117 | 118 | .token.entity { 119 | cursor: help; 120 | } 121 | 122 | .token.inserted { 123 | color: green; 124 | } 125 | 126 | -------------------------------------------------------------------------------- /assets/scss/_sharing-buttons.scss: -------------------------------------------------------------------------------- 1 | .sharing-buttons { 2 | display: flex; 3 | flex-wrap: wrap; 4 | justify-content: space-between; 5 | 6 | .resp-sharing-button__icon, 7 | .resp-sharing-button__link { 8 | display: inline-block; 9 | } 10 | 11 | .resp-sharing-button__link { 12 | text-decoration: none; 13 | margin: 0.5em; 14 | } 15 | 16 | .resp-sharing-button { 17 | border-radius: 5px; 18 | transition: 25ms ease-out; 19 | padding: 0.5em 0.75em; 20 | font-family: Helvetica Neue,Helvetica,Arial,sans-serif; 21 | } 22 | 23 | .resp-sharing-button__icon svg { 24 | width: 1em; 25 | height: 1em; 26 | margin-right: 0.4em; 27 | vertical-align: top; 28 | } 29 | 30 | .resp-sharing-button--small svg { 31 | margin: 0; 32 | vertical-align: middle; 33 | } 34 | } -------------------------------------------------------------------------------- /assets/scss/_single.scss: -------------------------------------------------------------------------------- 1 | .post { 2 | width: 100%; 3 | max-width: 800px; 4 | text-align: left; 5 | padding: 20px; 6 | margin: 20px auto; 7 | @media #{$media-size-tablet} { 8 | max-width: 600px; 9 | } 10 | 11 | &-date { 12 | &:after { 13 | content: '—'; 14 | } 15 | } 16 | 17 | &-title { 18 | font-size: 2.625rem; 19 | margin: 0 0 20px; 20 | @media #{$media-size-phone} { 21 | font-size: 2rem; 22 | } 23 | 24 | a { 25 | text-decoration: none; 26 | } 27 | } 28 | 29 | &-tags { 30 | display: block; 31 | margin-bottom: 20px; 32 | font-size: 1rem; 33 | opacity: 0.5; 34 | 35 | a { 36 | text-decoration: none; 37 | } 38 | } 39 | 40 | &-content { 41 | margin-top: 30px; 42 | } 43 | 44 | &-cover { 45 | border-radius: 8px; 46 | margin: 40px -50px; 47 | width: 860px; 48 | max-width: 860px; 49 | @media #{$media-size-tablet} { 50 | margin: 20px 0; 51 | width: 100%; 52 | } 53 | } 54 | 55 | &-info { 56 | margin-top: 30px; 57 | font-size: 0.8rem; 58 | line-height: normal; 59 | @include dimmed; 60 | 61 | p { 62 | margin: 0.8em 0; 63 | } 64 | 65 | a:hover { 66 | border-bottom: 1px solid white; 67 | } 68 | 69 | svg { 70 | margin-right: 0.8em; 71 | } 72 | 73 | .tag { 74 | margin-right: 0.5em; 75 | 76 | &::before { 77 | content: "#"; 78 | } 79 | } 80 | 81 | .feather { 82 | display: inline-block; 83 | vertical-align: -.125em; 84 | width: 1em; 85 | height: 1em; 86 | } 87 | } 88 | 89 | .flag { 90 | border-radius: 50%; 91 | margin: 0 5px; 92 | } 93 | } 94 | 95 | .pagination { 96 | margin-top: 20px; 97 | 98 | &__title { 99 | display: flex; 100 | text-align: center; 101 | position: relative; 102 | margin: 20px 0; 103 | 104 | &-h { 105 | text-align: center; 106 | margin: 0 auto; 107 | padding: 5px 10px; 108 | background: $light-background; 109 | color: $light-color-secondary; 110 | font-size: 0.8rem; 111 | text-transform: uppercase; 112 | text-decoration: none; 113 | letter-spacing: 0.1em; 114 | z-index: 1; 115 | 116 | .dark-theme & { 117 | background: $dark-background; 118 | color: $dark-color-secondary; 119 | } 120 | } 121 | 122 | hr { 123 | position: absolute; 124 | left: 0; 125 | right: 0; 126 | width: 100%; 127 | margin-top: 15px; 128 | z-index: 0; 129 | } 130 | } 131 | 132 | &__buttons { 133 | display: flex; 134 | align-items: center; 135 | justify-content: center; 136 | 137 | a { 138 | text-decoration: none; 139 | font-weight: bold; 140 | } 141 | } 142 | } 143 | 144 | .button { 145 | position: relative; 146 | display: inline-flex; 147 | align-items: center; 148 | justify-content: center; 149 | background: $light-background-secondary; 150 | font-size: 1rem; 151 | font-weight: 600; 152 | border-radius: 8px; 153 | max-width: 40%; 154 | padding: 0; 155 | cursor: pointer; 156 | appearance: none; 157 | 158 | .dark-theme & { 159 | background: $dark-background-secondary; 160 | } 161 | 162 | + .button { 163 | margin-left: 10px; 164 | } 165 | 166 | a { 167 | display: flex; 168 | padding: 8px 16px; 169 | text-decoration: none; 170 | text-overflow: ellipsis; 171 | white-space: nowrap; 172 | overflow: hidden; 173 | } 174 | 175 | &__text { 176 | text-overflow: ellipsis; 177 | white-space: nowrap; 178 | overflow: hidden; 179 | } 180 | 181 | &.next .button__icon { 182 | margin-left: 8px; 183 | } 184 | 185 | &.previous .button__icon { 186 | margin-right: 8px; 187 | } 188 | } -------------------------------------------------------------------------------- /assets/scss/_variables.scss: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | 3 | /* light theme color */ 4 | $light-background: #fff; 5 | $light-background-secondary: #eaeaea; 6 | $light-color: #222; 7 | $light-color-secondary: #999; 8 | $light-border-color: #dcdcdc; 9 | 10 | /* dark theme colors */ 11 | $dark-background: #292a2d; 12 | $dark-background-secondary: #3b3d42; 13 | $dark-color: #a9a9b3; 14 | $dark-color-secondary: #73747b; 15 | $dark-border-color: #4a4b50; 16 | 17 | $media-size-phone: "(max-width: 684px)"; 18 | $media-size-tablet: "(max-width: 900px)"; 19 | 20 | /* variables for js, must be the same as these in @custom-media queries */ 21 | :root { 22 | --phoneWidth: (max-width: 684px); 23 | --tabletWidth: (max-width: 900px); 24 | } 25 | -------------------------------------------------------------------------------- /assets/scss/main.scss: -------------------------------------------------------------------------------- 1 | /* Must be loaded before everything else */ 2 | @import "normalize"; 3 | @import "prism"; 4 | /* Main stuff */ 5 | @import "variables"; 6 | @import "mixins"; 7 | @import "fonts"; 8 | @import "buttons"; 9 | /* Modules */ 10 | @import "header"; 11 | @import "logo"; 12 | @import "menu"; 13 | @import "main"; 14 | @import "list"; 15 | @import "single"; 16 | @import "footer"; 17 | @import "sharing-buttons"; 18 | @import "style"; -------------------------------------------------------------------------------- /assets/scss/style.scss: -------------------------------------------------------------------------------- 1 | $primary: #3F51B5; 2 | $dark-primary: #303F9F; 3 | $light-primary: #C5CAE9; 4 | $text: #FFFFFF; 5 | $primary-text: #212121; 6 | $secondary-text: #757575; 7 | $accent: #FF4081; 8 | 9 | 10 | .hero-table { 11 | margin-left: 10%; 12 | margin-right: 10%; 13 | } 14 | 15 | 16 | 17 | 18 | 19 | section { 20 | padding: 100px 0; 21 | } 22 | 23 | .timeline { 24 | 25 | position: relative; 26 | 27 | &::before { 28 | content: ''; 29 | background: $light-primary; 30 | width: 5px; 31 | height: 95%; 32 | position: absolute; 33 | left: 50%; 34 | transform: translateX(-50%); 35 | } 36 | } 37 | 38 | .timeline-item { 39 | width: 100%; 40 | margin-bottom: 70px; 41 | 42 | &:nth-child(even) { 43 | 44 | .timeline-content { 45 | float: right; 46 | padding: 40px 30px 10px 30px; 47 | 48 | .date { 49 | right: auto; 50 | left: 0; 51 | } 52 | 53 | &::after { 54 | content: ''; 55 | position: absolute; 56 | border-style: solid; 57 | width: 0; 58 | height: 0; 59 | top: 30px; 60 | left: -15px; 61 | border-width: 10px 15px 10px 0; 62 | border-color: transparent #f5f5f5 transparent transparent; 63 | } 64 | } 65 | } 66 | 67 | &::after { 68 | content: ''; 69 | display: block; 70 | clear: both; 71 | } 72 | } 73 | 74 | 75 | .timeline-content { 76 | position: relative; 77 | width: 45%; 78 | padding: 10px 30px; 79 | border-radius: 4px; 80 | background: #f5f5f5; 81 | box-shadow: 0 20px 25px -15px rgba(0, 0, 0, .3); 82 | 83 | &::after { 84 | content: ''; 85 | position: absolute; 86 | border-style: solid; 87 | width: 0; 88 | height: 0; 89 | top: 30px; 90 | right: -15px; 91 | border-width: 10px 0 10px 15px; 92 | border-color: transparent transparent transparent #f5f5f5; 93 | } 94 | } 95 | 96 | .timeline-img { 97 | width: 30px; 98 | height: 30px; 99 | background: $primary; 100 | border-radius: 50%; 101 | position: absolute; 102 | left: 50%; 103 | margin-top: 25px; 104 | margin-left: -15px; 105 | } 106 | 107 | 108 | 109 | .timeline-card { 110 | padding: 0!important; 111 | 112 | p { 113 | padding: 0 20px; 114 | } 115 | 116 | a { 117 | margin-left: 20px; 118 | } 119 | } 120 | 121 | .timeline-item { 122 | .timeline-img-header { 123 | background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0, .4)), url('https://picsum.photos/1000/800/?random') center center no-repeat; 124 | background-size: cover; 125 | } 126 | } 127 | 128 | .timeline-img-header { 129 | 130 | height: 200px; 131 | position: relative; 132 | margin-bottom: 20px; 133 | 134 | h2 { 135 | color: $text; 136 | position: absolute; 137 | bottom: 5px; 138 | left: 20px; 139 | } 140 | } 141 | 142 | blockquote { 143 | margin-top: 30px; 144 | color: $secondary-text; 145 | border-left-color: $primary; 146 | padding: 0 20px; 147 | } 148 | 149 | .date { 150 | background: $accent; 151 | display: inline-block; 152 | color: $text; 153 | padding: 5px; 154 | position: absolute; 155 | top: 0; 156 | right: 0; 157 | } 158 | 159 | @media screen and (max-width: 768px) { 160 | 161 | .timeline { 162 | 163 | &::before { 164 | left: 50px; 165 | } 166 | 167 | .timeline-img { 168 | left: 50px; 169 | } 170 | 171 | .timeline-content { 172 | max-width: 100%; 173 | width: auto; 174 | margin-left: 70px; 175 | } 176 | 177 | .timeline-item { 178 | 179 | &:nth-child(even) { 180 | 181 | .timeline-content { 182 | float: none; 183 | 184 | } 185 | } 186 | 187 | &:nth-child(odd) { 188 | 189 | .timeline-content { 190 | 191 | &::after { 192 | content: ''; 193 | position: absolute; 194 | border-style: solid; 195 | width: 0; 196 | height: 0; 197 | top: 30px; 198 | left: -15px; 199 | border-width: 10px 15px 10px 0; 200 | border-color: transparent #f5f5f5 transparent transparent; 201 | } 202 | } 203 | 204 | } 205 | } 206 | } 207 | 208 | } 209 | -------------------------------------------------------------------------------- /data/langFlags.yaml: -------------------------------------------------------------------------------- 1 | de: de 2 | en: gb 3 | es: es 4 | fr: fr 5 | hi: in 6 | it: it 7 | nl: nl 8 | pt-br: br 9 | tr: tr 10 | ml: in 11 | -------------------------------------------------------------------------------- /exampleSite/archetypes/default.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "{{ replace .Name "-" " " | title }}" 3 | date: {{ .Date }} 4 | draft: true 5 | --- 6 | 7 | -------------------------------------------------------------------------------- /exampleSite/config.toml: -------------------------------------------------------------------------------- 1 | baseURL = "https://example.com" 2 | title = "Timeline" 3 | languageCode = "en-us" 4 | theme = "timeline" 5 | 6 | PygmentsCodeFences = true 7 | PygmentsStyle = "monokai" 8 | 9 | paginate = 10 10 | rssLimit = 10 # Maximum number of items in the RSS feed. 11 | copyright = "This work is licensed under a MIT License." 12 | 13 | # googleAnalytics = "" 14 | # disqusShortname = "" 15 | 16 | archetypeDir = "archetypes" 17 | contentDir = "content" 18 | dataDir = "data" 19 | layoutDir = "layouts" 20 | publishDir = "public" 21 | 22 | buildDrafts = false 23 | buildFuture = false 24 | buildExpired = false 25 | canonifyURLs = true 26 | 27 | enableRobotsTXT = true 28 | enableGitInfo = false 29 | enableEmoji = true 30 | enableMissingTranslationPlaceholders = false 31 | disableRSS = false 32 | disableSitemap = false 33 | disable404 = false 34 | disableHugoGeneratorInject = false 35 | 36 | [permalinks] 37 | posts = "/posts/:year/:month/:title/" 38 | 39 | [author] 40 | name = "timeline" 41 | 42 | [blackfriday] 43 | hrefTargetBlank = true 44 | 45 | [taxonomies] 46 | tag = "tags" 47 | category = "categories" 48 | series = "series" 49 | 50 | [params] 51 | dateform = "Jan 2, 2006" 52 | dateformShort = "Jan 2" 53 | dateformNum = "2006-01-02" 54 | dateformNumTime = "2006-01-02 15:04 -0700" 55 | 56 | # Metadata mostly used in document's head 57 | description = "Timeline hugo template for your work experience, researches, achievement and more" 58 | keywords = "timeline hugo template" 59 | images = [""] 60 | 61 | homeSubtitle = "timeline template for hugo" 62 | 63 | # Prefix of link to the git commit detail page. GitInfo must be enabled. 64 | # gitUrl = "" 65 | 66 | # Set disableReadOtherPosts to true in order to hide the links to other posts. 67 | disableReadOtherPosts = false 68 | 69 | # Sharing buttons 70 | # There are a lot of buttons preconfigured. If you want to change them, 71 | # generate the buttons here: https://sharingbuttons.io 72 | # and add them into your own `layouts/partials/sharing-buttons.html` 73 | enableSharingButtons = true 74 | 75 | # Integrate Javascript files or stylesheets by adding the url to the external assets or by 76 | # linking local files with their path relative to the static folder, e.g. "css/styles.css" 77 | customCSS = ["css/custom.css"] 78 | customJS = [] 79 | 80 | # Toggle this option need to rebuild SCSS, requires extended version of Hugo 81 | justifyContent = false # Set "text-align: justify" to .post-content. 82 | 83 | # Default theme "light" or "dark" 84 | defaultTheme = "dark" 85 | themeColor = "#252627" 86 | 87 | # Colors for favicons 88 | [params.favicon.color] 89 | mask = "#252627" 90 | msapplication = "#252627" 91 | theme = "#252627" 92 | 93 | [params.logo] 94 | logoText = "$" 95 | logoHomeLink = "/" 96 | # Set true to remove the logo cursor entirely. 97 | # logoCursorDisabled = false 98 | # Set to a valid CSS color to change the cursor in the logo. 99 | # logoCursorColor = "#67a2c9" 100 | # Set to a valid CSS time value to change the animation duration, "0s" to disable. 101 | # logoCursorAnimate = "2s" 102 | 103 | # Social icons 104 | [[params.social]] 105 | name = "twitter" 106 | url = "#" 107 | 108 | [[params.social]] 109 | name = "instagram" 110 | url = "#" 111 | 112 | [[params.social]] 113 | name = "facebook" 114 | url = "#" 115 | 116 | [[params.social]] 117 | name = "linkedin" 118 | url = "#" 119 | 120 | [[params.social]] 121 | name = "github" 122 | url = "#" 123 | 124 | [[params.social]] 125 | name = "reddit" 126 | url = "#" 127 | 128 | [[params.social]] 129 | name = "keybase" 130 | url = "#" 131 | 132 | [languages] 133 | [languages.en] 134 | subtitle = "Timeline" 135 | weight = 1 136 | copyright = '' 137 | 138 | [languages.fr] 139 | subtitle = "Timeline" 140 | weight = 2 141 | copyright = 'MIT' 142 | 143 | [menu] 144 | [[menu.main]] 145 | identifier = "timeline" 146 | name = "Timeline" 147 | url = "timeline/" 148 | weight = 1 149 | 150 | 151 | [markup] 152 | defaultMarkdownHandler = "goldmark" 153 | [markup.goldmark] 154 | [markup.goldmark.renderer] 155 | unsafe = true -------------------------------------------------------------------------------- /exampleSite/content/timeline/Amet_Mauris.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: 3 | name: "John Doe" 4 | date: 2019-10-08 5 | linktitle: Amet Mauris 6 | type: 7 | - post 8 | - posts 9 | title: Amet Mauris 10 | eventname: Conference 11 | eventlocation: San Francisco, CA 12 | weight: 10 13 | --- 14 | 15 | ## Abstract 16 | 17 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id ornare arcu odio ut sem nulla. Ac felis donec et odio pellentesque. Est placerat in egestas erat imperdiet sed euismod nisi. Vestibulum morbi blandit cursus risus. At volutpat diam ut venenatis tellus. Vel turpis nunc eget lorem. Sagittis purus sit amet volutpat consequat mauris nunc congue nisi. Diam sit amet nisl suscipit. Eu scelerisque felis imperdiet proin fermentum leo vel orci porta. 18 | 19 | Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Euismod in pellentesque massa placerat duis ultricies lacus sed turpis. Tristique nulla aliquet enim tortor at auctor urna nunc id. Lectus proin nibh nisl condimentum id venenatis a condimentum vitae. Ultrices tincidunt arcu non sodales neque. Malesuada fames ac turpis egestas integer eget aliquet. Eu nisl nunc mi ipsum faucibus vitae aliquet nec. Molestie at elementum eu facilisis sed odio morbi quis commodo. Risus in hendrerit gravida rutrum quisque. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Nunc mattis enim ut tellus elementum sagittis vitae et leo. Leo vel orci porta non pulvinar neque laoreet suspendisse. Condimentum lacinia quis vel eros donec. Mi bibendum neque egestas congue quisque egestas diam in arcu. Ultricies integer quis auctor elit sed. Gravida dictum fusce ut placerat. Magna fermentum iaculis eu non diam phasellus vestibulum lorem. 20 | 21 | [LINK](https://github.com/gohugoio/hugo/) -------------------------------------------------------------------------------- /exampleSite/content/timeline/Lorem_Ipsum.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: 3 | name: "John Doe" 4 | date: 2019-01-24 5 | linktitle: Lorem Ipsum 6 | type: 7 | - post 8 | - posts 9 | title: Getting Started 10 | eventname: Conference 11 | eventlocation: Mumbai, India 12 | weight: 10 13 | --- 14 | 15 | ## Abstract 16 | 17 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id ornare arcu odio ut sem nulla. Ac felis donec et odio pellentesque. Est placerat in egestas erat imperdiet sed euismod nisi. Vestibulum morbi blandit cursus risus. At volutpat diam ut venenatis tellus. Vel turpis nunc eget lorem. Sagittis purus sit amet volutpat consequat mauris nunc congue nisi. Diam sit amet nisl suscipit. Eu scelerisque felis imperdiet proin fermentum leo vel orci porta. 18 | 19 | [LINK](https://gohugo.io/getting-started/) -------------------------------------------------------------------------------- /exampleSite/content/timeline/Lorem_Ipsum_Dolor.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: 3 | name: "John Doe" 4 | date: 2020-10-07 5 | linktitle: Lorem Ipsum Dolor 6 | type: 7 | - post 8 | - posts 9 | title: Lorem Ipsum Dolor 10 | eventname: Conference 11 | eventlocation: India 12 | weight: 10 13 | --- 14 | 15 | ## Abstract 16 | 17 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id ornare arcu odio ut sem nulla. Ac felis donec et odio pellentesque. Est placerat in egestas erat imperdiet sed euismod nisi. Vestibulum morbi blandit cursus risus. At volutpat diam ut venenatis tellus. Vel turpis nunc eget lorem. Sagittis purus sit amet volutpat consequat mauris nunc congue nisi. Diam sit amet nisl suscipit. Eu scelerisque felis imperdiet proin fermentum leo vel orci porta. 18 | 19 | Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Euismod in pellentesque massa placerat duis ultricies lacus sed turpis. Tristique nulla aliquet enim tortor at auctor urna nunc id. Lectus proin nibh nisl condimentum id venenatis a condimentum vitae. Ultrices tincidunt arcu non sodales neque. Malesuada fames ac turpis egestas integer eget aliquet. Eu nisl nunc mi ipsum faucibus vitae aliquet nec. Molestie at elementum eu facilisis sed odio morbi quis commodo. Risus in hendrerit gravida rutrum quisque. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Nunc mattis enim ut tellus elementum sagittis vitae et leo. Leo vel orci porta non pulvinar neque laoreet suspendisse. Condimentum lacinia quis vel eros donec. Mi bibendum neque egestas congue quisque egestas diam in arcu. Ultricies integer quis auctor elit sed. Gravida dictum fusce ut placerat. Magna fermentum iaculis eu non diam phasellus vestibulum lorem. 20 | 21 | Sapien faucibus et molestie ac feugiat sed. Varius sit amet mattis vulputate enim nulla. Risus ultricies tristique nulla aliquet enim tortor at. Lobortis elementum nibh tellus molestie nunc non. Nisl nisi scelerisque eu ultrices vitae auctor eu. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi. Sit amet justo donec enim diam. Commodo nulla facilisi nullam vehicula ipsum a arcu cursus vitae. Donec ultrices tincidunt arcu non. Magna ac placerat vestibulum lectus mauris. Eget nunc lobortis mattis aliquam faucibus. Tristique nulla aliquet enim tortor at auctor. 22 | 23 | [Link](https://gohugo.io/) -------------------------------------------------------------------------------- /exampleSite/content/timeline/Sapien_faucibus.md: -------------------------------------------------------------------------------- 1 | --- 2 | author: 3 | name: "John Doe" 4 | date: 2020-01-07 5 | linktitle: Sapien faucibus 6 | type: 7 | - post 8 | - posts 9 | title: Sapien faucibus 10 | eventname: Conference 11 | eventlocation: Singapore 12 | weight: 10 13 | --- 14 | 15 | ## Abstract 16 | 17 | Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Id ornare arcu odio ut sem nulla. Ac felis donec et odio pellentesque. Est placerat in egestas erat imperdiet sed euismod nisi. Vestibulum morbi blandit cursus risus. At volutpat diam ut venenatis tellus. Vel turpis nunc eget lorem. Sagittis purus sit amet volutpat consequat mauris nunc congue nisi. Diam sit amet nisl suscipit. Eu scelerisque felis imperdiet proin fermentum leo vel orci porta. 18 | 19 | Amet mauris commodo quis imperdiet massa tincidunt nunc pulvinar. Euismod in pellentesque massa placerat duis ultricies lacus sed turpis. Tristique nulla aliquet enim tortor at auctor urna nunc id. Lectus proin nibh nisl condimentum id venenatis a condimentum vitae. Ultrices tincidunt arcu non sodales neque. Malesuada fames ac turpis egestas integer eget aliquet. Eu nisl nunc mi ipsum faucibus vitae aliquet nec. Molestie at elementum eu facilisis sed odio morbi quis commodo. Risus in hendrerit gravida rutrum quisque. Ac placerat vestibulum lectus mauris ultrices eros in cursus. Nunc mattis enim ut tellus elementum sagittis vitae et leo. Leo vel orci porta non pulvinar neque laoreet suspendisse. Condimentum lacinia quis vel eros donec. Mi bibendum neque egestas congue quisque egestas diam in arcu. Ultricies integer quis auctor elit sed. Gravida dictum fusce ut placerat. Magna fermentum iaculis eu non diam phasellus vestibulum lorem. 20 | 21 | Sapien faucibus et molestie ac feugiat sed. Varius sit amet mattis vulputate enim nulla. Risus ultricies tristique nulla aliquet enim tortor at. Lobortis elementum nibh tellus molestie nunc non. Nisl nisi scelerisque eu ultrices vitae auctor eu. Rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi. Sit amet justo donec enim diam. Commodo nulla facilisi nullam vehicula ipsum a arcu cursus vitae. Donec ultrices tincidunt arcu non. Magna ac placerat vestibulum lectus mauris. Eget nunc lobortis mattis aliquam faucibus. Tristique nulla aliquet enim tortor at auctor. 22 | 23 | [Link](https://github.com/gohugoio/hugo/) -------------------------------------------------------------------------------- /exampleSite/resources/_gen/assets/scss/scss/main.scss_de1a7f5f1c8c46959803c429bb697ff0.content: -------------------------------------------------------------------------------- 1 | /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */::-webkit-scrollbar{width:8px;height:8px;background:#212020}::-webkit-scrollbar-thumb{background:#888}::-webkit-scrollbar-thumb:hover{background:#dcdcdc}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-display:auto;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-display:auto;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-display:auto;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}code[class*="language-"],pre[class*="language-"]{color:#ccc;background:none;font-family:Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*="language-"]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*="language-"],pre[class*="language-"]{background:#2d2d2d}:not(pre)>code[class*="language-"]{padding:.1em;border-radius:.3em;white-space:normal}.token.comment,.token.block-comment,.token.prolog,.token.doctype,.token.cdata{color:#999}.token.punctuation{color:#ccc}.token.tag,.token.attr-name,.token.namespace,.token.deleted{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.number,.token.function{color:#f08d49}.token.property,.token.class-name,.token.constant,.token.symbol{color:#f8c555}.token.selector,.token.important,.token.atrule,.token.keyword,.token.builtin{color:#cc99cd}.token.string,.token.char,.token.attr-value,.token.regex,.token.variable{color:#7ec699}.token.operator,.token.entity,.token.url{color:#67cdcc}.token.important,.token.bold{font-weight:bold}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}:root{--phoneWidth: (max-width: 684px);--tabletWidth: (max-width: 900px)}@font-face{font-family:'Inter UI';font-style:normal;font-display:auto;font-weight:400;src:url("../fonts/Inter-UI-Regular.woff2") format("woff2"),url("../fonts/Inter-UI-Regular.woff") format("woff")}@font-face{font-family:'Inter UI';font-style:italic;font-display:auto;font-weight:400;src:url("../fonts/Inter-UI-Italic.woff2") format("woff2"),url("../fonts/Inter-UI-Italic.woff") format("woff")}@font-face{font-family:'Inter UI';font-style:normal;font-display:auto;font-weight:600;src:url("../fonts/Inter-UI-Medium.woff2") format("woff2"),url("../fonts/Inter-UI-Medium.woff") format("woff")}@font-face{font-family:'Inter UI';font-style:italic;font-display:auto;font-weight:600;src:url("../fonts/Inter-UI-MediumItalic.woff2") format("woff2"),url("../fonts/Inter-UI-MediumItalic.woff") format("woff")}@font-face{font-family:'Inter UI';font-style:normal;font-display:auto;font-weight:800;src:url("../fonts/Inter-UI-Bold.woff2") format("woff2"),url("../fonts/Inter-UI-Bold.woff") format("woff")}@font-face{font-family:'Inter UI';font-style:italic;font-display:auto;font-weight:800;src:url("../fonts/Inter-UI-BoldItalic.woff2") format("woff2"),url("../fonts/Inter-UI-BoldItalic.woff") format("woff")}.button-container{display:table;margin-left:auto;margin-right:auto}button,.button,a.button{position:relative;display:flex;align-items:center;justify-content:center;padding:8px 18px;margin-bottom:5px;background:#eaeaea;text-decoration:none;text-align:center;font-weight:500;border-radius:8px;border:1px solid transparent;appearance:none;cursor:pointer;outline:none}.dark-theme button,.dark-theme .button,.dark-theme a.button{background:#3b3d42;color:inherit}button.outline,.button.outline,a.button.outline{background:transparent;border-color:#eaeaea;box-shadow:none;padding:8px 18px}.dark-theme button.outline,.dark-theme .button.outline,.dark-theme a.button.outline{border-color:#3b3d42;color:inherit}button.outline :hover,.button.outline :hover,a.button.outline :hover{transform:none;box-shadow:none}button.primary,.button.primary,a.button.primary{box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08)}button.primary:hover,.button.primary:hover,a.button.primary:hover{box-shadow:0 2px 6px rgba(50,50,93,0.21),0 1px 3px rgba(0,0,0,0.08)}button.link,.button.link,a.button.link{background:none;font-size:1rem}button.small,.button.small,a.button.small{font-size:.8rem}button.wide,.button.wide,a.button.wide{min-width:200px;padding:14px 24px}.code-toolbar{margin-bottom:20px}.code-toolbar .toolbar-item a{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:3px 8px;margin-bottom:5px;background:#eaeaea;text-decoration:none;text-align:center;font-size:13px;font-weight:500;border-radius:8px;border:1px solid transparent;appearance:none;cursor:pointer;outline:none}.dark-theme .code-toolbar .toolbar-item a{background:#3b3d42;color:inherit}.header{background:#fafafa;display:flex;align-items:center;justify-content:center;position:relative;padding:20px}.dark-theme .header{background:#252627}.header__right{display:flex;flex-direction:row;align-items:center}@media (max-width: 684px){.header__right{flex-direction:row-reverse}}.header__inner{display:flex;align-items:center;justify-content:space-between;margin:0 auto;width:760px;max-width:100%}.theme-toggle{display:flex;align-items:center;justify-content:center;line-height:1;cursor:pointer}.theme-toggler{fill:currentColor}.unselectable{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.logo{display:flex;align-items:center;text-decoration:none;font-weight:bold;font-display:auto;font-family:monospace, monospace}.logo img{height:44px}.logo__mark{margin-right:5px}.logo__text{font-size:1.125rem}.logo__cursor{display:inline-block;width:10px;height:1rem;background:#fe5186;margin-left:5px;border-radius:1px;animation:cursor 1s infinite}@media (prefers-reduced-motion: reduce){.logo__cursor{animation:none}}@keyframes cursor{0%{opacity:0}50%{opacity:1}100%{opacity:0}}.menu{background:#fafafa;border-right:1px solid;margin-right:18px;z-index:9999}.dark-theme .menu{background:#252627}@media (max-width: 684px){.menu{position:absolute;top:50px;right:0;border:none;margin:0;padding:10px}}.menu__inner{display:flex;align-items:center;justify-content:flex-start;max-width:100%;margin:0 auto;padding:0 15px;font-size:1rem;list-style:none}.menu__inner li{margin:0 12px}@media (max-width: 684px){.menu__inner{flex-direction:column;align-items:flex-start;padding:0}.menu__inner li{margin:0;padding:5px}}.menu-trigger{width:24px;height:24px;fill:currentColor;margin-left:10px;cursor:pointer}.menu a{display:inline-block;margin-right:15px;text-decoration:none}.menu a:hover{text-decoration:underline}.menu a:last-of-type{margin-right:0}html{box-sizing:border-box;line-height:1.6;letter-spacing:.06em;scroll-behavior:smooth}*,*:before,*:after{box-sizing:inherit}body{margin:0;padding:0;font-family:'Inter UI', -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", Helvetica, Arial, sans-serif;font-display:auto;font-size:1rem;line-height:1.54;background-color:#fff;color:#222;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;font-feature-settings:"liga", "tnum", "case", "calt", "zero", "ss01", "locl";-webkit-overflow-scrolling:touch;-webkit-text-size-adjust:100%;display:flex;min-height:100vh;flex-direction:column}@media (max-width: 684px){body{font-size:1rem}}body.dark-theme{background-color:#292a2d;color:#a9a9b3}h2,h3,h4,h5,h6{display:flex;align-items:center;line-height:1.3}h1{font-size:2.625rem}h2{font-size:1.625rem}h3{font-size:1.375rem}h4{font-size:1.125rem}@media (max-width: 684px){h1{font-size:2rem}h2{font-size:1.4rem}h3{font-size:1.15rem}h4{font-size:1.125rem}}a{color:inherit}img{display:block;max-width:100%}img.left{margin-right:auto}img.center{margin-left:auto;margin-right:auto}img.right{margin-left:auto}img.circle{border-radius:50%;max-width:25%;margin:auto}figure{display:table;max-width:100%;margin:25px 0}figure.left{margin-right:auto}figure.left-floated{margin-right:auto;float:left}figure.left-floated img{margin:20px 20px 20px 0}figure.center{margin-left:auto;margin-right:auto}figure.right{margin-left:auto}figure.right-floated{margin-left:auto;float:right}figure.right-floated img{margin:20px 0 20px 20px}figure.rounded img{border-radius:50%}figure figcaption{font-size:14px;margin-top:5px;opacity:.8}figure figcaption.left{text-align:left}figure figcaption.center{text-align:center}figure figcaption.right{text-align:right}code{font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;font-display:auto;font-feature-settings:normal;background:#eaeaea;padding:1px 6px;margin:0 2px;border-radius:5px;font-size:.95rem}.dark-theme code{background:#3b3d42}pre{background:#212020;padding:10px 10px 10px 20px;border-radius:8px;font-size:.95rem;overflow:auto}@media (max-width: 684px){pre{white-space:pre-wrap;word-wrap:break-word}}pre code{background:none !important;color:#ccc;margin:0;padding:0;font-size:inherit}.dark-theme pre code{color:inherit}blockquote{border-left:2px solid;margin:40px;padding:10px 20px}@media (max-width: 684px){blockquote{margin:10px;padding:10px}}blockquote:before{content:'”';font-family:Georgia, serif;font-display:auto;font-size:3.875rem;position:absolute;left:-40px;top:-20px}blockquote p:first-of-type{margin-top:0}blockquote p:last-of-type{margin-bottom:0}ul,ol{margin-left:40px;padding:0}@media (max-width: 684px){ul,ol{margin-left:20px}}ol ol{list-style-type:lower-alpha}.container{flex:1 auto;display:flex;flex-direction:column;justify-content:center;text-align:center}.content{display:flex;flex-direction:column;flex:1 auto;align-items:center;justify-content:center;margin:0}@media (max-width: 684px){.content{margin-top:0}}hr{width:100%;border:none;background:#dcdcdc;height:1px}.dark-theme hr{background:#4a4b50}.hidden{display:none}@media (max-width: 684px){.hide-on-phone{display:none}}@media (max-width: 900px){.hide-on-tablet{display:none}}.screen-reader-text{border:0;clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute !important;width:1px;word-wrap:normal !important}.screen-reader-text:focus{background-color:#f1f1f1;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,0.6);clip:auto !important;clip-path:none;color:#21759b;display:block;font-size:14px;font-size:0.875rem;font-weight:bold;height:auto;width:auto;top:5px;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;z-index:100000}.posts{width:100%;max-width:800px;text-align:left;padding:20px;margin:20px auto}@media (max-width: 900px){.posts{max-width:660px}}.posts:not(:last-of-type){border-bottom:1px solid #dcdcdc}.dark-theme .posts:not(:last-of-type){border-color:#4a4b50}.posts-group{display:flex;margin-bottom:1.9em;line-height:normal}@media (max-width: 900px){.posts-group{display:block}}.posts-list{flex-grow:1;margin:0;padding:0;list-style:none}.posts .post-title{font-size:1rem;margin:5px 0 5px 0}.posts .post-year{padding-top:6px;margin-right:1.8em;font-size:1.6em;opacity:.6}@media (max-width: 900px){.posts .post-year{margin:-6px 0 4px}}.posts .post-item{border-bottom:1px grey dashed}.posts .post-item a{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;text-decoration:none}.posts .post-day{flex-shrink:0;margin-left:1em;opacity:.6}.post{width:100%;max-width:800px;text-align:left;padding:20px;margin:20px auto}@media (max-width: 900px){.post{max-width:600px}}.post-date:after{content:'—'}.post-title{font-size:2.625rem;margin:0 0 20px}@media (max-width: 684px){.post-title{font-size:2rem}}.post-title a{text-decoration:none}.post-tags{display:block;margin-bottom:20px;font-size:1rem;opacity:0.5}.post-tags a{text-decoration:none}.post-content{margin-top:30px}.post-cover{border-radius:8px;margin:40px -50px;width:860px;max-width:860px}@media (max-width: 900px){.post-cover{margin:20px 0;width:100%}}.post-info{margin-top:30px;font-size:0.8rem;line-height:normal;opacity:.6}.post-info p{margin:0.8em 0}.post-info a:hover{border-bottom:1px solid white}.post-info svg{margin-right:0.8em}.post-info .tag{margin-right:0.5em}.post-info .tag::before{content:"#"}.post-info .feather{display:inline-block;vertical-align:-.125em;width:1em;height:1em}.post .flag{border-radius:50%;margin:0 5px}.pagination{margin-top:20px}.pagination__title{display:flex;text-align:center;position:relative;margin:20px 0}.pagination__title-h{text-align:center;margin:0 auto;padding:5px 10px;background:#fff;color:#999;font-size:0.8rem;text-transform:uppercase;text-decoration:none;letter-spacing:0.1em;z-index:1}.dark-theme .pagination__title-h{background:#292a2d;color:#73747b}.pagination__title hr{position:absolute;left:0;right:0;width:100%;margin-top:15px;z-index:0}.pagination__buttons{display:flex;align-items:center;justify-content:center}.pagination__buttons a{text-decoration:none;font-weight:bold}.button{position:relative;display:inline-flex;align-items:center;justify-content:center;background:#eaeaea;font-size:1rem;font-weight:600;border-radius:8px;max-width:40%;padding:0;cursor:pointer;appearance:none}.dark-theme .button{background:#3b3d42}.button+.button{margin-left:10px}.button a{display:flex;padding:8px 16px;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.button__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.button.next .button__icon{margin-left:8px}.button.previous .button__icon{margin-right:8px}.footer{padding:40px 20px;flex-grow:0;color:#999}.footer__inner{display:flex;align-items:center;justify-content:center;margin:0 auto;width:760px;max-width:100%}@media (max-width: 900px){.footer__inner{flex-direction:column}}.footer__content{display:flex;flex-direction:row;align-items:center;font-size:1rem;color:#999}@media (max-width: 900px){.footer__content{flex-direction:column;margin-top:10px}}.footer__content>*:not(:last-child)::after{content:"•";padding:0 5px}@media (max-width: 900px){.footer__content>*:not(:last-child)::after{content:"";padding:0}}.footer__content>*:last-child{padding:0 5px}@media (max-width: 900px){.footer__content>*:last-child{padding:0}}.sharing-buttons{display:flex;flex-wrap:wrap;justify-content:space-between}.sharing-buttons .resp-sharing-button__icon,.sharing-buttons .resp-sharing-button__link{display:inline-block}.sharing-buttons .resp-sharing-button__link{text-decoration:none;margin:0.5em}.sharing-buttons .resp-sharing-button{border-radius:5px;transition:25ms ease-out;padding:0.5em 0.75em;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}.sharing-buttons .resp-sharing-button__icon svg{width:1em;height:1em;margin-right:0.4em;vertical-align:top}.sharing-buttons .resp-sharing-button--small svg{margin:0;vertical-align:middle}.hero-table{margin-left:10%;margin-right:10%}section{padding:100px 0}.timeline{position:relative}.timeline::before{content:'';background:#C5CAE9;width:5px;height:95%;position:absolute;left:50%;transform:translateX(-50%)}.timeline-item{width:100%;margin-bottom:70px}.timeline-item:nth-child(even) .timeline-content{float:right;padding:40px 30px 10px 30px}.timeline-item:nth-child(even) .timeline-content .date{right:auto;left:0}.timeline-item:nth-child(even) .timeline-content::after{content:'';position:absolute;border-style:solid;width:0;height:0;top:30px;left:-15px;border-width:10px 15px 10px 0;border-color:transparent #f5f5f5 transparent transparent}.timeline-item::after{content:'';display:block;clear:both}.timeline-content{position:relative;width:45%;padding:10px 30px;border-radius:4px;background:#f5f5f5;box-shadow:0 20px 25px -15px rgba(0,0,0,0.3)}.timeline-content::after{content:'';position:absolute;border-style:solid;width:0;height:0;top:30px;right:-15px;border-width:10px 0 10px 15px;border-color:transparent transparent transparent #f5f5f5}.timeline-img{width:30px;height:30px;background:#3F51B5;border-radius:50%;position:absolute;left:50%;margin-top:25px;margin-left:-15px}.timeline-card{padding:0 !important}.timeline-card p{padding:0 20px}.timeline-card a{margin-left:20px}.timeline-item .timeline-img-header{background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.4)),url("https://picsum.photos/1000/800/?random") center center no-repeat;background-size:cover}.timeline-img-header{height:200px;position:relative;margin-bottom:20px}.timeline-img-header h2{color:#fff;position:absolute;bottom:5px;left:20px}blockquote{margin-top:30px;color:#757575;border-left-color:#3F51B5;padding:0 20px}.date{background:#FF4081;display:inline-block;color:#fff;padding:5px;position:absolute;top:0;right:0}@media screen and (max-width: 768px){.timeline::before{left:50px}.timeline .timeline-img{left:50px}.timeline .timeline-content{max-width:100%;width:auto;margin-left:70px}.timeline .timeline-item:nth-child(even) .timeline-content{float:none}.timeline .timeline-item:nth-child(odd) .timeline-content::after{content:'';position:absolute;border-style:solid;width:0;height:0;top:30px;left:-15px;border-width:10px 15px 10px 0;border-color:transparent #f5f5f5 transparent transparent}} 2 | 3 | /*# sourceMappingURL=main.css.map */ -------------------------------------------------------------------------------- /exampleSite/resources/_gen/assets/scss/scss/main.scss_de1a7f5f1c8c46959803c429bb697ff0.json: -------------------------------------------------------------------------------- 1 | {"Target":"main.805b1025016494ee5fd67b55b8ecd5e2b7c4a9f0bdda42e300c62b85ddfef68f.css","MediaType":"text/css","Data":{"Integrity":"sha256-gFsQJQFklO5f1ntVuOzV4rfEqfC92kLjAMYrhd3+9o8="}} -------------------------------------------------------------------------------- /exampleSite/static/bootstrap.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Generated using the Bootstrap Customizer (https://getbootstrap.com/docs/3.4/customize/) 3 | *//*! 4 | * Bootstrap v3.4.1 (https://getbootstrap.com/) 5 | * Copyright 2011-2019 Twitter, Inc. 6 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 7 | *//*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */.container{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.container-fluid{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}.row{margin-right:-15px;margin-left:-15px}.row-no-gutters{margin-right:0;margin-left:0}.row-no-gutters [class*="col-"]{padding-right:0;padding-left:0}.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{position:relative;min-height:1px;padding-right:15px;padding-left:15px}.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12{float:left}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-pull-12{right:100%}.col-xs-pull-11{right:91.66666667%}.col-xs-pull-10{right:83.33333333%}.col-xs-pull-9{right:75%}.col-xs-pull-8{right:66.66666667%}.col-xs-pull-7{right:58.33333333%}.col-xs-pull-6{right:50%}.col-xs-pull-5{right:41.66666667%}.col-xs-pull-4{right:33.33333333%}.col-xs-pull-3{right:25%}.col-xs-pull-2{right:16.66666667%}.col-xs-pull-1{right:8.33333333%}.col-xs-pull-0{right:auto}.col-xs-push-12{left:100%}.col-xs-push-11{left:91.66666667%}.col-xs-push-10{left:83.33333333%}.col-xs-push-9{left:75%}.col-xs-push-8{left:66.66666667%}.col-xs-push-7{left:58.33333333%}.col-xs-push-6{left:50%}.col-xs-push-5{left:41.66666667%}.col-xs-push-4{left:33.33333333%}.col-xs-push-3{left:25%}.col-xs-push-2{left:16.66666667%}.col-xs-push-1{left:8.33333333%}.col-xs-push-0{left:auto}.col-xs-offset-12{margin-left:100%}.col-xs-offset-11{margin-left:91.66666667%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-0{margin-left:0}@media (min-width:768px){.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}.clearfix:before,.clearfix:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after{display:table;content:" "}.clearfix:after,.container:after,.container-fluid:after,.row:after{clear:both}.center-block{display:block;margin-right:auto;margin-left:auto}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none !important}.show{display:block !important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none !important}.affix{position:fixed} -------------------------------------------------------------------------------- /exampleSite/static/css/custom.css: -------------------------------------------------------------------------------- 1 | .framed { 2 | padding: 20px; 3 | border-radius: 10px; 4 | border: 1px solid #dcdcdc; 5 | border: 1px solid var(--border-color); 6 | max-width: 800px; 7 | } -------------------------------------------------------------------------------- /exampleSite/static/site.webmanifest: -------------------------------------------------------------------------------- 1 | {"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} -------------------------------------------------------------------------------- /i18n/de.toml: -------------------------------------------------------------------------------- 1 | # Translations for German 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Übersetzungen" 8 | 9 | [postAvailable] 10 | other = "Auch verfügbar auf" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Archiv" 17 | 18 | [home] 19 | other = "Home" 20 | 21 | [notFound] 22 | other = "Oops, Seite nicht gefunden ..." 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Eine Minute" 29 | other = "{{ .Count }} Minuten" 30 | 31 | [tableOfContents] 32 | other = "Inhaltsverzeichnis" 33 | 34 | [wordCount] 35 | one = "Ein Wort" 36 | other = "{{ .Count }} Wörter" 37 | -------------------------------------------------------------------------------- /i18n/en.toml: -------------------------------------------------------------------------------- 1 | # Translations for English 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Translations" 8 | 9 | [postAvailable] 10 | other = "Also available in" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Archives" 17 | 18 | [home] 19 | other = "Home" 20 | 21 | [notFound] 22 | other = "Oops, page not found…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "One minute" 29 | other = "{{ .Count }} minutes" 30 | 31 | [tableOfContents] 32 | other = "Table of Contents" 33 | 34 | [wordCount] 35 | one = "One Word" 36 | other = "{{ .Count }} Words" 37 | -------------------------------------------------------------------------------- /i18n/es.toml: -------------------------------------------------------------------------------- 1 | # Translations for Spanish 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Traducciones" 8 | 9 | [postAvailable] 10 | other = "También disponible en" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Archivo" 17 | 18 | [home] 19 | other = "Home" 20 | 21 | [notFound] 22 | other = "Oops, página no encontrada…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Un minuto" 29 | other = "{{ .Count }} minutos" 30 | 31 | [tableOfContents] 32 | other = "Tabla de Contenido" 33 | 34 | [wordCount] 35 | one = "Una Palabra" 36 | other = "{{ .Count }} Palabras" 37 | -------------------------------------------------------------------------------- /i18n/fr.toml: -------------------------------------------------------------------------------- 1 | # Translations for French 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Traductions" 8 | 9 | [postAvailable] 10 | other = "Aussi disponible en" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Les archives" 17 | 18 | [home] 19 | other = "Accueil" 20 | 21 | [notFound] 22 | other = "Oups, page non trouvée …" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Une minute" 29 | other = "{{ .Count }} minutes" 30 | 31 | [tableOfContents] 32 | other = "Table des matières" 33 | 34 | [wordCount] 35 | one = "Un Mot" 36 | other = "{{ .Count }} Mots" 37 | -------------------------------------------------------------------------------- /i18n/hi.toml: -------------------------------------------------------------------------------- 1 | # Translations for Hindi 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "अनुवाद" 8 | 9 | [postAvailable] 10 | other = "पढ़ें इस भाषा में" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "पुरालेख" 17 | 18 | [home] 19 | other = "घर" 20 | 21 | [notFound] 22 | other = "क्षमा करें ! पेज़ नहीं मिला…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "एक मिनट" 29 | other = "{{ .Count }} मिनट" 30 | 31 | [tableOfContents] 32 | other = "अनुक्रमणिका" 33 | 34 | [wordCount] 35 | one = "एक शब्द" 36 | other = "{{ .Count }} शब्द" -------------------------------------------------------------------------------- /i18n/it.toml: -------------------------------------------------------------------------------- 1 | # Translations for English 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Traduzioni" 8 | 9 | [postAvailable] 10 | other = "Disponibile anche in" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Archivi" 17 | 18 | [home] 19 | other = "Home" 20 | 21 | [notFound] 22 | other = "Oops, pagina non trovata…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Un minuto" 29 | other = "{{ .Count }} minuti" 30 | 31 | [tableOfContents] 32 | other = "Contenuti" 33 | 34 | [wordCount] 35 | one = "Una parola" 36 | other = "{{ .Count }} parole" 37 | -------------------------------------------------------------------------------- /i18n/lmo.toml: -------------------------------------------------------------------------------- 1 | # Translations for English 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Traduzion" 8 | 9 | [postAvailable] 10 | other = "Disponibel anca in" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Archivi" 17 | 18 | [home] 19 | other = "Home" 20 | 21 | [notFound] 22 | other = "Oops, pagina minga trovada…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "On megnuu" 29 | other = "{{ .Count }} megnuu" 30 | 31 | [tableOfContents] 32 | other = "Contegnuu" 33 | 34 | [wordCount] 35 | one = "Ona parolla" 36 | other = "{{ .Count }} paroll" 37 | -------------------------------------------------------------------------------- /i18n/ml.toml: -------------------------------------------------------------------------------- 1 | # Translations for മലയാളം [Malayalam] 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "വിവർത്തനങ്ങൾ" 8 | 9 | [postAvailable] 10 | other = "ഈ പോസ്റ്റ് ലഭ്യമായ മറ്റ് ഭാഷകൾ:" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "ശേഖരം" 17 | 18 | [home] 19 | other = "പ്രധാന താൾ" 20 | 21 | [notFound] 22 | other = "ക്ഷമിക്കണം. താൾ ലഭ്യമല്ല. ദേയവയി വിലാസം പരിശോധിക്കുക അല്ലെങ്കിൽ അൽപ സമയത്തിനു ശേഷം വീണ്ടും പരിശ്രമിക്കുക." 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "ഒരു മിനിറ്റ്" 29 | other = "{{ .Count }} മിനിറ്റുകൾ" 30 | 31 | [tableOfContents] 32 | other = "ഉള്ളടക്ക പട്ടിക" 33 | 34 | [wordCount] 35 | one = "ഒരു വാക്ക്" 36 | other = "{{ .Count }} വാക്കുകൾ" 37 | -------------------------------------------------------------------------------- /i18n/pt-br.toml: -------------------------------------------------------------------------------- 1 | # Translations for Portuguese 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Traduções" 8 | 9 | [postAvailable] 10 | other = "Também disponível em" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Arquivo" 17 | 18 | [home] 19 | other = "Início" 20 | 21 | [notFound] 22 | other = "Oops, página não encontrada…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Um minuto" 29 | other = "{{ .Count }} minutos" 30 | 31 | [tableOfContents] 32 | other = "Índice" 33 | 34 | [wordCount] 35 | one = "Uma Palavra" 36 | other = "{{ .Count }} Palavras" -------------------------------------------------------------------------------- /i18n/tr.toml: -------------------------------------------------------------------------------- 1 | # Translations for English 2 | # https://gohugo.io/content-management/multilingual/#translation-of-strings 3 | 4 | # Generic 5 | # 6 | [translations] 7 | other = "Çeviriler" 8 | 9 | [postAvailable] 10 | other = "Ayrıca" 11 | 12 | 13 | # 404.html 14 | # 15 | [archives] 16 | other = "Arşiv" 17 | 18 | [home] 19 | other = "Ana Sayfa" 20 | 21 | [notFound] 22 | other = "Sayfa bulunamadı…" 23 | 24 | 25 | # posts/single.html 26 | # 27 | [readingTime] 28 | one = "Bir dakika" 29 | other = "{{ .Count }} dakika" 30 | 31 | [tableOfContents] 32 | other = "İçindekiler" 33 | 34 | [wordCount] 35 | one = "One Kelime" 36 | other = "{{ .Count }} Kelime" 37 | -------------------------------------------------------------------------------- /images/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/s4n7h0/hugo-theme-timeline/b2edb87d3406c0f71a78c9325e03d764c002e54a/images/screenshot.png -------------------------------------------------------------------------------- /images/tn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/s4n7h0/hugo-theme-timeline/b2edb87d3406c0f71a78c9325e03d764c002e54a/images/tn.png -------------------------------------------------------------------------------- /layouts/404.html: -------------------------------------------------------------------------------- 1 | {{ define "main" }} 2 |
4 | 5 |
6 | 14 |30 | 31 | {{- range . -}} 32 | {{.}} 33 | {{- end }} 34 |
35 | {{- end }} 36 | 37 | 38 |
23 | {{.Params.Eventname}}
24 | {{.Params.Eventlocation}}
25 |
26 |
6 | 10 | {{ i18n "readingTime" .Page.ReadingTime }} 11 | 12 | {{ if .IsTranslated }} | {{ i18n "postAvailable" }} 13 | {{ range .Translations }} 14 | 15 | {{ end}} 16 | {{ end }} 17 |
18 |48 | 52 | 53 | {{- range . -}} 54 | {{.}} 55 | {{- end }} 56 |
57 | {{- end }} 58 | 59 |60 | 67 | {{ i18n "wordCount" .Page.WordCount }} 68 |
69 | 70 |71 | 77 | {{ if .Site.Params.dateformNumTime }}{{ dateFormat .Site.Params.dateformNumTime .Date.Local }}{{ else }}{{ dateFormat "2006-01-02 15:04 -0700" .Date.Local }}{{ end }} 78 |
79 | 80 |