diff --git a/src/wp-content/themes/twentyseventeen/404.php b/src/wp-content/themes/twentyseventeen/404.php new file mode 100644 index 0000000000..4a6d11353b --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/404.php @@ -0,0 +1,34 @@ + + +
+
+
+ +
+
+

+
+
+

+ + + +
+
+
+
+
+ + Themes and click the 'Add New' button. +2. Type in Twenty Seventeen in the search form and press the 'Enter' key on your keyboard. +3. Click on the 'Activate' button to use your new theme right away. +4. Go to https://codex.wordpress.org/Twenty_Seventeen for a guide on how to customize this theme. +5. Navigate to Appearance > Customize in your admin panel and customize to taste. + +== Copyright == + +Twenty Seventeen WordPress Theme, Copyright 2016 WordPress.org +Twenty Seventeen is distributed under the terms of the GNU GPL + +This program is free software: you can redistribute it and/or modify +it under the terms of the GNU General Public License as published by +the Free Software Foundation, either version 2 of the License, or +(at your option) any later version. + +This program is distributed in the hope that it will be useful, +but WITHOUT ANY WARRANTY; without even the implied warranty of +MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +GNU General Public License for more details. + +Twenty Seventeen bundles the following third-party resources: + +HTML5 Shiv v3.7.3, Copyright 2014 Alexander Farkas +Licenses: MIT/GPL2 +Source: https://github.com/aFarkas/html5shiv + +jQuery scrollTo, Copyright 2007-2015 Ariel Flesler +License: MIT +Source: https://github.com/flesler/jquery.scrollTo + +normalize.css, Copyright 2012-2016 Nicolas Gallagher and Jonathan Neal +License: MIT +Source: https://necolas.github.io/normalize.css/ + +Font Awesome icons, Copyright Dave Gandy +License: SIL Open Font License, version 1.1. +Source: http://fontawesome.io/ + +Bundled header image, Copyright Alvin Engler +License: CC0 1.0 Universal (CC0 1.0) +Source: https://unsplash.com/@englr?photo=bIhpiQA009k + +== Changelog == + += 1.0 = +* Released: December 6, 2016 + +Initial release diff --git a/src/wp-content/themes/twentyseventeen/archive.php b/src/wp-content/themes/twentyseventeen/archive.php new file mode 100644 index 0000000000..8aa139f546 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/archive.php @@ -0,0 +1,61 @@ + + +
+ + +
+ ', '' ); + the_archive_description( '
', '
' ); + ?> +
+ + +
+
+ + + twentyseventeen_get_svg( array( 'icon' => 'previous' ) ) . '' . __( 'Previous page', 'twentyseventeen' ) . '', + 'next_text' => '' . __( 'Next page', 'twentyseventeen' ) . '' . twentyseventeen_get_svg( array( 'icon' => 'next' ) ), + 'before_page_number' => '' . __( 'Page', 'twentyseventeen' ) . ' ', + ) ); + + else : + + get_template_part( 'components/post/content', 'none' ); + + endif; ?> + +
+
+ +
+ + .comment-body > .comment-meta > .comment-author:before, +.colors-dark .entry-footer .edit-link a.post-edit-link { + background-color: #fff; +} + +.colors-dark input[type="text"]:focus, +.colors-dark input[type="email"]:focus, +.colors-dark input[type="url"]:focus, +.colors-dark input[type="password"]:focus, +.colors-dark input[type="search"]:focus, +.colors-dark input[type="number"]:focus, +.colors-dark input[type="tel"]:focus, +.colors-dark input[type="range"]:focus, +.colors-dark input[type="date"]:focus, +.colors-dark input[type="month"]:focus, +.colors-dark input[type="week"]:focus, +.colors-dark input[type="time"]:focus, +.colors-dark input[type="datetime"]:focus, +.colors-dark input[type="datetime-local"]:focus, +.colors-dark input[type="color"]:focus, +.colors-dark textarea:focus, +.colors-dark button.secondary, +.colors-dark input[type="reset"], +.colors-dark input[type="button"].secondary, +.colors-dark input[type="reset"].secondary, +.colors-dark input[type="submit"].secondary, +.colors-dark a, +.colors-dark a:visited, +.colors-dark .site-title, +.colors-dark .site-title a, +.colors-dark .navigation-top a, +.colors-dark .navigation-top a:visited, +.colors-dark .dropdown-toggle, +.colors-dark .menu-toggle, +.colors-dark .page .panel-content .entry-title, +.colors-dark .page-title, +.colors-dark.page:not(.twentyseventeen-front-page) .entry-title, +.colors-dark .page-links a .page-number, +.colors-dark .comment-metadata a.comment-edit-link, +.colors-dark .comment-reply-link .icon, +.colors-dark h2.widget-title, +.colors-dark mark { + color: #fff; +} + +body.colors-dark, +.colors-dark button, +.colors-dark input, +.colors-dark select, +.colors-dark textarea, +.colors-dark h3, +.colors-dark h4, +.colors-dark h6, +.colors-dark label, +.colors-dark .entry-title a, +.colors-dark.twentyseventeen-front-page .panel-content .recent-posts article, +.colors-dark .entry-footer .cat-links a, +.colors-dark .entry-footer .tags-links a, +.colors-dark .format-quote blockquote, +.colors-dark .nav-title, +.colors-dark .comment-body { + color: #eee; +} + + +.colors-dark input[type="text"]:focus, +.colors-dark input[type="email"]:focus, +.colors-dark input[type="url"]:focus, +.colors-dark input[type="password"]:focus, +.colors-dark input[type="search"]:focus, +.colors-dark input[type="number"]:focus, +.colors-dark input[type="tel"]:focus, +.colors-dark input[type="range"]:focus, +.colors-dark input[type="date"]:focus, +.colors-dark input[type="month"]:focus, +.colors-dark input[type="week"]:focus, +.colors-dark input[type="time"]:focus, +.colors-dark input[type="datetime"]:focus, +.colors-dark input[type="datetime-local"]:focus, +.colors-dark input[type="color"]:focus, +.colors-dark textarea:focus { + border-color: #eee; +} + +.colors-dark h2, +.colors-dark blockquote, +.colors-dark input[type="text"], +.colors-dark input[type="email"], +.colors-dark input[type="url"], +.colors-dark input[type="password"], +.colors-dark input[type="search"], +.colors-dark input[type="number"], +.colors-dark input[type="tel"], +.colors-dark input[type="range"], +.colors-dark input[type="date"], +.colors-dark input[type="month"], +.colors-dark input[type="week"], +.colors-dark input[type="time"], +.colors-dark input[type="datetime"], +.colors-dark input[type="datetime-local"], +.colors-dark input[type="color"], +.colors-dark textarea, +.colors-dark .navigation-top .current-menu-item > a, +.colors-dark .navigation-top .current-menu-item > a:visited, +.colors-dark .navigation-top .current_page_item > a, +.colors-dark .navigation-top .current_page_item > a:visited, +.colors-dark .entry-content blockquote.alignleft, +.colors-dark .entry-content blockquote.alignright, +.colors-dark .taxonomy-description, +.colors-dark .site-info a, +.colors-dark .wp-caption { + color: #ccc; +} + +.colors-dark abbr, +.colors-dark acronym { + border-bottom-color: #ccc; +} + +.colors-dark h5, +.colors-dark .entry-meta, +.colors-dark .entry-meta a, +.colors-dark .nav-subtitle, +.colors-dark .comment-metadata, +.colors-dark .comment-metadata a, +.colors-dark .no-comments, +.colors-dark .comment-awaiting-moderation, +.colors-dark .page-numbers.current, +.colors-dark .page-links .page-number, +.colors-dark .site-description { + color: #bbb; +} + +.colors-dark button:hover, +.colors-dark button:focus, +.colors-dark input[type="button"]:hover, +.colors-dark input[type="button"]:focus, +.colors-dark input[type="submit"]:hover, +.colors-dark input[type="submit"]:focus, +.colors-dark .entry-content a:focus, +.colors-dark .entry-content a:hover, +.colors-dark .entry-summary a:focus, +.colors-dark .entry-summary a:hover, +.colors-dark .widget a:focus, +.colors-dark .widget a:hover, +.colors-dark .site-footer .widget-area a:focus, +.colors-dark .site-footer .widget-area a:hover, +.colors-dark .posts-navigation a:focus, +.colors-dark .posts-navigation a:hover, +.colors-dark .comment-navigation a:focus, +.colors-dark .comment-navigation a:hover, +.colors-dark .comment-metadata a:focus, +.colors-dark .comment-metadata a:hover, +.colors-dark .comment-metadata a.comment-edit-link:focus, +.colors-dark .comment-metadata a.comment-edit-link:hover, +.colors-dark .comment-reply-link:focus, +.colors-dark .comment-reply-link:hover, +.colors-dark .widget_authors a:focus strong, +.colors-dark .widget_authors a:hover strong, +.colors-dark .project-terms a:focus, +.colors-dark .project-terms a:hover, +.colors-dark .entry-title a:focus, +.colors-dark .entry-title a:hover, +.colors-dark .entry-meta a:focus, +.colors-dark .entry-meta a:hover, +.colors-dark .page-links a:focus .page-number, +.colors-dark .page-links a:hover .page-number, +.colors-dark .entry-footer a:focus, +.colors-dark .entry-footer a:hover, +.colors-dark .entry-footer .cat-links a:focus, +.colors-dark .entry-footer .cat-links a:hover, +.colors-dark .entry-footer .tags-links a:focus, +.colors-dark .entry-footer .tags-links a:hover, +.colors-dark .post-navigation a:focus, +.colors-dark .post-navigation a:hover, +.colors-dark .logged-in-as a:focus, +.colors-dark .logged-in-as a:hover, +.colors-dark .comment-navigation a:focus, +.colors-dark .comment-navigation a:hover, +.colors-dark a:focus .nav-title, +.colors-dark a:hover .nav-title, +.colors-dark .edit-link a:focus, +.colors-dark .edit-link a:hover, +.colors-dark .pagination a:focus, +.colors-dark .pagination a:hover, +.colors-dark .site-info a:focus, +.colors-dark .site-info a:hover, +.colors-dark .widget .widget-title a:focus, +.colors-dark .widget .widget-title a:hover, +.colors-dark .widget ul li a:focus, +.colors-dark .widget ul li a:hover, +.colors-dark .entry-footer .edit-link a.post-edit-link:hover, +.colors-dark .entry-footer .edit-link a.post-edit-link:focus { + background: #bbb; +} + +.colors-dark .social-navigation a:hover, +.colors-dark .social-navigation a:focus { + background: #999; + color: #222; +} + +.colors-dark .entry-content a, +.colors-dark .entry-content a:visited, +.colors-dark .entry-summary a, +.colors-dark .entry-summary a:visited, +.colors-dark .widget a, +.colors-dark .widget a:visited, +.colors-dark .site-footer .widget-area a, +.colors-dark .site-footer .widget-area a:visited, +.colors-dark .posts-navigation a, +.colors-dark .posts-navigation a:visited, +.colors-dark .widget_authors a strong, +.colors-dark .widget_authors a:visited strong { + border-bottom-color: #bbb; +} + +.colors-dark button.secondary:hover, +.colors-dark button.secondary:focus, +.colors-dark input[type="reset"]:hover, +.colors-dark input[type="reset"]:focus, +.colors-dark input[type="button"].secondary:hover, +.colors-dark input[type="button"].secondary:focus, +.colors-dark input[type="reset"].secondary:hover, +.colors-dark input[type="reset"].secondary:focus, +.colors-dark input[type="submit"].secondary:hover, +.colors-dark input[type="submit"].secondary:focus, +.colors-dark .social-navigation a, +.colors-dark hr { + background: #555; +} + +.colors-dark input[type="text"], +.colors-dark input[type="email"], +.colors-dark input[type="url"], +.colors-dark input[type="password"], +.colors-dark input[type="search"], +.colors-dark input[type="number"], +.colors-dark input[type="tel"], +.colors-dark input[type="range"], +.colors-dark input[type="date"], +.colors-dark input[type="month"], +.colors-dark input[type="week"], +.colors-dark input[type="time"], +.colors-dark input[type="datetime"], +.colors-dark input[type="datetime-local"], +.colors-dark input[type="color"], +.colors-dark textarea, +.colors-dark select, +.colors-dark fieldset, +.colors-dark .widget .tagcloud a:hover, +.colors-dark .widget .tagcloud a:focus, +.colors-dark .widget.widget_tag_cloud a:hover, +.colors-dark .widget.widget_tag_cloud a:focus, +.colors-dark .wp_widget_tag_cloud a:hover, +.colors-dark .wp_widget_tag_cloud a:focus { + border-color: #555; +} + +.colors-dark .entry-footer .cat-links .icon, +.colors-dark .entry-footer .tags-links .icon { + color: #666; +} + +.colors-dark button.secondary, +.colors-dark input[type="reset"], +.colors-dark input[type="button"].secondary, +.colors-dark input[type="reset"].secondary, +.colors-dark input[type="submit"].secondary, +.colors-dark .prev.page-numbers, +.colors-dark .next.page-numbers { + background-color: #444; +} + +.colors-dark .widget .tagcloud a, +.colors-dark .widget.widget_tag_cloud a, +.colors-dark .wp_widget_tag_cloud a { + border-color: #444; +} + +.colors-dark.twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child), +.colors-dark .widget ul li { + border-top-color: #444; +} + +.colors-dark .widget ul li { + border-bottom-color: #444; +} + +.colors-dark pre, +.colors-dark mark, +.colors-dark ins, +.colors-dark input[type="text"], +.colors-dark input[type="email"], +.colors-dark input[type="url"], +.colors-dark input[type="password"], +.colors-dark input[type="search"], +.colors-dark input[type="number"], +.colors-dark input[type="tel"], +.colors-dark input[type="range"], +.colors-dark input[type="date"], +.colors-dark input[type="month"], +.colors-dark input[type="week"], +.colors-dark input[type="time"], +.colors-dark input[type="datetime"], +.colors-dark input[type="datetime-local"], +.colors-dark input[type="color"], +.colors-dark textarea, +.colors-dark select, +.colors-dark fieldset { + background: #333; +} + +.colors-dark .navigation-top, +.colors-dark .main-navigation > div > ul, +.colors-dark .pagination, +.colors-dark .comment-navigation, +.colors-dark .entry-footer, +.colors-dark .site-footer { + border-top-color: #333; +} + +.colors-dark .navigation-top, +.colors-dark .main-navigation li, +.colors-dark .entry-footer, +.colors-dark #comments { + border-bottom-color: #333; +} + +.colors-dark .site-header { + background-color: #262626; +} + +.colors-dark .entry-content a:focus, +.colors-dark .entry-content a:hover, +.colors-dark .entry-summary a:focus, +.colors-dark .entry-summary a:hover, +.colors-dark .widget a:focus, +.colors-dark .widget a:hover, +.colors-dark .site-footer .widget-area a:focus, +.colors-dark .site-footer .widget-area a:hover, +.colors-dark .posts-navigation a:focus, +.colors-dark .posts-navigation a:hover, +.colors-dark .comment-navigation a:focus, +.colors-dark .comment-navigation a:hover, +.colors-dark .comment-metadata a:focus, +.colors-dark .comment-metadata a:hover, +.colors-dark .comment-metadata a.comment-edit-link:focus, +.colors-dark .comment-metadata a.comment-edit-link:hover, +.colors-dark .comment-reply-link:focus, +.colors-dark .comment-reply-link:hover, +.colors-dark .widget_authors a:focus strong, +.colors-dark .widget_authors a:hover strong, +.colors-dark .project-terms a:focus, +.colors-dark .project-terms a:hover, +.colors-dark .entry-title a:focus, +.colors-dark .entry-title a:hover, +.colors-dark .entry-meta a:focus, +.colors-dark .entry-meta a:hover, +.colors-dark .page-links a:focus .page-number, +.colors-dark .page-links a:hover .page-number, +.colors-dark .entry-footer a:focus, +.colors-dark .entry-footer a:hover, +.colors-dark .entry-footer .cat-links a:focus, +.colors-dark .entry-footer .cat-links a:hover, +.colors-dark .entry-footer .tags-links a:focus, +.colors-dark .entry-footer .tags-links a:hover, +.colors-dark .post-navigation a:focus, +.colors-dark .post-navigation a:hover, +.colors-dark .logged-in-as a:focus, +.colors-dark .logged-in-as a:hover, +.colors-dark .comment-navigation a:focus, +.colors-dark .comment-navigation a:hover, +.colors-dark a:focus .nav-title, +.colors-dark a:hover .nav-title, +.colors-dark .edit-link a:focus, +.colors-dark .edit-link a:hover, +.colors-dark .pagination a:focus, +.colors-dark .pagination a:hover, +.colors-dark .site-info a:focus, +.colors-dark .site-info a:hover, +.colors-dark .widget .widget-title a:focus, +.colors-dark .widget .widget-title a:hover, +.colors-dark .widget ul li a:focus, +.colors-dark .widget ul li a:hover, +.colors-dark button, +.colors-dark input[type="button"], +.colors-dark input[type="submit"], +.colors-dark .entry-footer .edit-link a.post-edit-link { + color: #222; +} + +body.colors-dark, +.colors-dark .navigation-top, +.colors-dark .main-navigation ul { + background: #222; +} + +.colors-dark .bypostauthor > .comment-body > .comment-meta > .comment-author:before { + border-color: #222; +} + +.colors-dark .menu-toggle, +.colors-dark .menu-toggle:hover, +.colors-dark .menu-toggle:focus, +.colors-dark .dropdown-toggle, +.colors-custom .menu-scroll-down, +.colors-custom .menu-scroll-down:hover, +.colors-custom .menu-scroll-down:focus { + background-color: transparent; +} + + +@media screen and (min-width: 48em) { + + .colors-dark .nav-links .nav-previous .nav-title .icon, + .colors-dark .nav-links .nav-next .nav-title .icon { + color: #eee; + } + + .colors-dark .main-navigation li li:hover, + .colors-dark .main-navigation li li.focus { + background: #999; + } + + .colors-dark .menu-scroll-down { + color: #999; + } + + .colors-dark .main-navigation ul ul { + border-color: #333; + background: #222; + } + + .colors-dark .main-navigation ul li.menu-item-has-children:before, + .colors-dark .main-navigation ul li.page_item_has_children:before { + border-bottom-color: #333; + } + + .main-navigation ul li.menu-item-has-children:after, + .main-navigation ul li.page_item_has_children:after { + border-bottom-color: #222; + } + + .colors-dark .main-navigation li li.focus > a, + .colors-dark .main-navigation li li:focus > a, + .colors-dark .main-navigation li li:hover > a, + .colors-dark .main-navigation li li a:hover, + .colors-dark .main-navigation li li a:focus, + .colors-dark .main-navigation li li.current_page_item a:hover, + .colors-dark .main-navigation li li.current-menu-item a:hover, + .colors-dark .main-navigation li li.current_page_item a:focus, + .colors-dark .main-navigation li li.current-menu-item a:focus { + color: #222; + } + +} diff --git a/src/wp-content/themes/twentyseventeen/assets/css/editor-style.css b/src/wp-content/themes/twentyseventeen/assets/css/editor-style.css new file mode 100644 index 0000000000..c3dd53f8d2 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/css/editor-style.css @@ -0,0 +1,571 @@ +/* +Theme Name: Twenty Seventeen +Description: Used to style the TinyMCE editor. +*/ + + +/** + * Table of Contents: + * + * 1.0 - Body + * 2.0 - Typography + * 3.0 - Elements + * 4.0 - Alignment + * 5.0 - Caption + * 6.0 - Galleries + * 7.0 - Media Elements + * 8.0 - RTL + */ + +/** + * 1.0 - Body + */ + +body { + background-color: #fff; + color: #333; + margin: 20px 40px; + max-width: 580px; +} + +/** + * 2.0 - Typography + */ + +body, +button, +input, +select, +textarea { + font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif; + font-size: 16px; + font-size: 1rem; + font-weight: 400; + line-height: 1.66; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + clear: both; + line-height: 1.4; + margin: 0 0 0.75em; + padding: 1.5em 0 0; +} + +h1:first-child, +h2:first-child, +h3:first-child, +h4:first-child, +h5:first-child, +h6:first-child { + padding-top: 0; +} + +h1 { + font-size: 24px; + font-size: 1.5rem; + font-weight: 300; +} + +h2 { + color: #666; + font-size: 20px; + font-size: 1.25rem; + font-weight: 300; +} + +h3 { + color: #333; + font-size: 18px; + font-size: 1.125rem; + font-weight: 300; +} + +h4 { + color: #333; + font-size: 16px; + font-size: 1rem; + font-weight: 800; +} + +h5 { + color: #767676; + font-size: 13px; + font-size: 0.8125rem; + font-weight: 800; + letter-spacing: 0.15em; + text-transform: uppercase; +} + +h6 { + color: #333; + font-size: 15px; + font-size: 0.9375rem; + font-weight: 800; +} + +p { + margin: 0 0 1.5em; + padding: 0; +} + +dfn, +cite, +em, +i { + font-style: italic; +} + +blockquote { + color: #666; + font-size: 18px; + font-size: 1.125rem; + font-style: italic; + line-height: 1.7; + margin: 0; + overflow: hidden; + padding: 0; +} + +blockquote.alignleft, +blockquote.alignright { + font-size: 14px; + font-size: 0.875rem; + width: 34%; +} + +address { + margin: 0 0 1.5em; +} + +pre { + background: #eee; + font-family: "Courier 10 Pitch", Courier, monospace; + font-size: 15px; + font-size: 0.9375rem; + line-height: 1.6; + margin-bottom: 1.6em; + max-width: 100%; + overflow: auto; + padding: 1.6em; +} + +code, +kbd, +tt, +var { + font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; + font-size: 15px; + font-size: 0.9375rem; +} + +abbr, +acronym { + border-bottom: 1px dotted #666; + cursor: help; +} + +mark, +ins { + background: #eee; + text-decoration: none; +} + +big { + font-size: 125%; +} + +blockquote, +q { + quotes: "" ""; +} + +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ""; +} + +/* Typography for Thai Font */ + +html[lang="th"] h1, +html[lang="th"] h2, +html[lang="th"] h3, +html[lang="th"] h4, +html[lang="th"] h5, +html[lang="th"] h6 { + letter-spacing: 0; + line-height: 1.65; +} + +html[lang="th"] body, +html[lang="th"] button, +html[lang="th"] input, +html[lang="th"] select, +html[lang="th"] textarea { + line-height: 1.8; +} + +/** + * 3.0 - Elements + */ + +hr { + background-color: #bbb; + border: 0; + height: 1px; + margin-bottom: 1.5em; +} + +ul, +ol { + margin: 0 0 1.5em; + padding: 0; +} + +ul { + list-style: disc; +} + +ol { + counter-reset: item; +} + +ol li { + display: block; + position: relative; +} + +ol li:before { + content: counter(item); + counter-increment: item; + font-weight: 800; + left: -1.5em; + position: absolute; +} + +li > ul, +li > ol { + margin-bottom: 0; + margin-left: 1.5em; +} + +dt { + font-weight: 700; +} + +dd { + margin: 0 1.5em 1.5em; +} + +table { + margin: 0 0 1.5em; + width: 100%; +} + +a { + -webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1); + box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1); + color: #222; + text-decoration: none; + -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out; +} + +a:focus { + outline: thin dotted; +} + +a:hover, +a:focus { + color: #000; + -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); + box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); +} + +/* Fixes linked images */ + +a img { + background: #fff; + -webkit-box-shadow: 0 0 0 6px #fff; + box-shadow: 0 0 0 6px #fff; +} + +/** + * 4.0 - Alignment + */ + +img { + height: auto; /* Make sure images are scaled correctly. */ + width: inherit; /* Make images fill their parent's space. Solves IE8. */ + max-width: 100%; /* Adhere to container width. */ +} + +embed, +iframe, +object { + margin-bottom: 1.5em; + max-width: 100%; +} + +/** + * 5.0 - Caption + */ + +.wp-caption { + color: #666; + font-size: 13px; + font-size: 0.8125rem; + font-style: italic; + margin-bottom: 1.5em; + max-width: 100%; +} + +.wp-caption img[class*="wp-image-"] { + display: block; + margin-left: auto; + margin-right: auto; +} + +.wp-caption .wp-caption-text { + margin: 0.8075em 0; +} + +/** + * 6.0 - Galleries + */ + +.gallery { + margin-bottom: 1.5em; +} + +.gallery-item { + display: inline-block; + text-align: center; + vertical-align: top; + width: 100%; +} + +.gallery-item a, +.gallery-item a:hover, +.gallery-item a:focus { + -webkit-box-shadow: none; + box-shadow: none; + background: none; + display: inline-block; +} + +.gallery-columns-2 .gallery-item { + max-width: 50%; +} + +.gallery-columns-3 .gallery-item { + max-width: 33.33%; +} + +.gallery-columns-4 .gallery-item { + max-width: 25%; +} + +.gallery-columns-5 .gallery-item { + max-width: 20%; +} + +.gallery-columns-6 .gallery-item { + max-width: 16.66%; +} + +.gallery-columns-7 .gallery-item { + max-width: 14.28%; +} + +.gallery-columns-8 .gallery-item { + max-width: 12.5%; +} + +.gallery-columns-9 .gallery-item { + max-width: 11.11%; +} + +.gallery-caption { + display: block; +} + +/** + * 7.0 - Media Elements + */ + +.mejs-container { + margin-bottom: 1.5em; +} + +/* Audio Player */ + +.mejs-controls a.mejs-horizontal-volume-slider, +.mejs-controls a.mejs-horizontal-volume-slider:focus, +.mejs-controls a.mejs-horizontal-volume-slider:hover { + background: transparent; + border: 0; +} + +/* Playlist Color Overrides: Light */ + +.wp-playlist-light { + border-color: #eee; + color: #222; +} + +.wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album { + color: #333; +} + +.wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist { + color: #767676; +} + +.wp-playlist-light .wp-playlist-item { + border-bottom: 1px dotted #eee; + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; +} + +.wp-playlist-light .wp-playlist-item:hover, +.wp-playlist-light .wp-playlist-item:focus { + border-bottom-color: rgba(0, 0, 0, 0); + background-color: #767676; + color: #fff; +} + +.wp-playlist-light a.wp-playlist-caption:hover, +.wp-playlist-light .wp-playlist-item:hover a, +.wp-playlist-light .wp-playlist-item:focus a { + color: #fff; +} + +/* Playlist Color Overrides: Dark */ + +.wp-playlist-dark { + background: #222; + border-color: #333; +} + +.wp-playlist-dark .mejs-container .mejs-controls { + background-color: #333; +} + +.wp-playlist-dark .wp-playlist-caption { + color: #fff; +} + +.wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album { + color: #eee; +} + +.wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist { + color: #aaa; +} + +.wp-playlist-dark .wp-playlist-playing { + background-color: #333; +} + +.wp-playlist-dark .wp-playlist-item { + border-bottom: 1px dotted #555; + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; +} + +.wp-playlist-dark .wp-playlist-item:hover, +.wp-playlist-dark .wp-playlist-item:focus { + border-bottom-color: rgba(0, 0, 0, 0); + background-color: #aaa; + color: #222; +} + +.wp-playlist-dark a.wp-playlist-caption:hover, +.wp-playlist-dark .wp-playlist-item:hover a, +.wp-playlist-dark .wp-playlist-item:focus a { + color: #222; +} + +/* Playlist Style Overrides */ + +.wp-playlist { + padding: 0.625em 0.625em 0.3125em; +} + +.wp-playlist-current-item .wp-playlist-item-title { + font-weight: 700; +} + +.wp-playlist-current-item .wp-playlist-item-album { + font-style: normal; +} + +.wp-playlist-current-item .wp-playlist-item-artist { + font-size: 10px; + font-size: 0.625rem; + font-weight: 800; + letter-spacing: 0.1818em; + text-transform: uppercase; +} + +.wp-playlist-item { + padding: 0 0.3125em; + cursor: pointer; +} + +.wp-playlist-item:last-of-type { + border-bottom: none; +} + +.wp-playlist-item a { + padding: 0.3125em 0; + border-bottom: none; +} + +.wp-playlist-item a, +.wp-playlist-item a:focus, +.wp-playlist-item a:hover { + -webkit-box-shadow: none; + box-shadow: none; + background: transparent; +} + +.wp-playlist-item-length { + top: 5px; +} + +/** + * 8.0 - RTL + */ + +.rtl th { + text-align: right; +} + +.rtl ol { + counter-reset: item; +} + +.rtl ol li:before { + left: auto; + right: -1.5em; +} + +.rtl li > ul, +.rtl li > ol { + margin-left: 0; + margin-right: 1.5em; +} + +.rtl .mejs-offscreen { + right: -10000px; +} diff --git a/src/wp-content/themes/twentyseventeen/assets/css/ie8.css b/src/wp-content/themes/twentyseventeen/assets/css/ie8.css new file mode 100644 index 0000000000..4c543a13a6 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/css/ie8.css @@ -0,0 +1,115 @@ +/* +Theme Name: Twenty Seventeen +Description: IE8 specific style. +*/ + + +h1 { + font-size: 30px; + font-size: 1.875rem; +} + +h2, +.page .panel-content .recent-posts .entry-title { + font-size: 26px; + font-size: 1.625rem; +} + +h3 { + font-size: 22px; + font-size: 1.375rem; +} + +h4 { + font-size: 18px; + font-size: 1.125rem; +} + +h5 { + font-size: 13px; + font-size: 0.8125rem; +} + +h6 { + font-size: 16px; + font-size: 1rem; +} + +/* Site Branding */ + +.site-title { + font-weight: bolder; +} + +/* Main Navigation */ + +.menu-toggle { + width: 150px; +} + +.main-navigation ul#top-menu { + margin-bottom: -1px; + padding: 0; +} + +.dropdown-toggle .svg-fallback.icon-expand { + -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=1.2246467991473532e-16, M21=-1.2246467991473532e-16, M22=-1, SizingMethod='auto expand')"; +} + +.dropdown-toggle.toggled-on .svg-fallback.icon-expand { + -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, SizingMethod='auto expand')"; +} + +/* Front Page */ + +.custom-header-image, +.panel-image { + height: 1000px; + max-height: 1000px; + padding-top: 0; +} + +.page .panel-content .entry-title, +.page-title, +.page .entry-title { + font-size: 14px; + font-size: 0.875rem; + font-weight: 700; + letter-spacing: 0.14em; + text-transform: uppercase; +} + +/* Posts */ + +time.updated { + display: none; +} + +time.published { + display: inline-block; +} + +.blog .entry-title { + padding-top: 0; +} + +.blog .post, +.archive .post, +.search .post, +.search .page { + padding-bottom: 4em; +} + +.comment-author .avatar { + z-index: -1; +} + +img { + width: inherit; /* Make images fill their parent's space. */ +} + +/* Fixes linked images */ +.entry-content a img, +.widget a img { + filter: progid:DXImageTransform.Microsoft.DropShadow(OffX=0, OffY=5, Color=#fff); +} diff --git a/src/wp-content/themes/twentyseventeen/assets/images/header.jpg b/src/wp-content/themes/twentyseventeen/assets/images/header.jpg new file mode 100644 index 0000000000..5bf460e5df Binary files /dev/null and b/src/wp-content/themes/twentyseventeen/assets/images/header.jpg differ diff --git a/src/wp-content/themes/twentyseventeen/assets/images/svg-icons.svg b/src/wp-content/themes/twentyseventeen/assets/images/svg-icons.svg new file mode 100644 index 0000000000..50e54b85f7 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/images/svg-icons.svg @@ -0,0 +1,152 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/wp-content/themes/twentyseventeen/assets/js/customizer.js b/src/wp-content/themes/twentyseventeen/assets/js/customizer.js new file mode 100644 index 0000000000..66c83e447f --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/js/customizer.js @@ -0,0 +1,103 @@ +/** + * File customizer.js. + * + * Theme Customizer enhancements for a better user experience. + * + * Contains handlers to make Theme Customizer preview reload changes asynchronously. + */ + +( function( $ ) { + + // Collect information from panel-customizer.js about which panels are opening + wp.customize.bind( 'preview-ready', function() { + wp.customize.preview.bind( 'section-highlight', function( data ) { + + // If there's an expanded panel section, scroll down to that panel & highlight in the preview + if ( true === data.expanded ) { + $.scrollTo( $( '.' + data.section ), { + duration: 600, + offset: { 'top': -40 } + } ); + $( '.' + data.section ).addClass( 'twentyseventeen-highlight' ); + + // If we've left the panel, remove the highlight and scroll back to the top + } else { + $.scrollTo( $( '#masthead' ), { + duration: 300, + offset: { 'top': 0 } + } ); + $( '.' + data.section ).removeClass( 'twentyseventeen-highlight' ); + } + } ); + } ); + + // Site title and description. + wp.customize( 'blogname', function( value ) { + value.bind( function( to ) { + $( '.site-title a' ).text( to ); + } ); + } ); + wp.customize( 'blogdescription', function( value ) { + value.bind( function( to ) { + $( '.site-description' ).text( to ); + } ); + } ); + + // Header text color. + wp.customize( 'header_textcolor', function( value ) { + value.bind( function( to ) { + if ( 'blank' === to ) { + $( '.site-title, .site-description' ).css( { + 'clip': 'rect(1px, 1px, 1px, 1px)', + 'position': 'absolute' + } ); + $( 'body' ).addClass( 'title-tagline-hidden' ); + } else { + $( '.site-title, .site-description' ).css( { + 'clip': 'auto', + 'position': 'relative' + } ); + $( '.site-branding, .site-branding a, .site-description, .site-description a' ).css( { + 'color': to + } ); + $( 'body' ).removeClass( 'title-tagline-hidden' ); + } + } ); + } ); + + // Color scheme. + wp.customize( 'colorscheme', function( value ) { + value.bind( function( to ) { + + // Update color body class. + $( 'body' ).removeClass( 'colors-light colors-dark colors-custom' ) + .addClass( 'colors-' + to ); + } ); + } ); + + // Custom color hue. + wp.customize( 'colorscheme_hue', function( value ) { + value.bind( function( to ) { + + // Update custom color CSS + var style = $( '#custom-theme-colors' ), + hue = style.data( 'hue' ), + css = style.html(); + + css = css.split( hue + ',' ).join( to + ',' ); // Equivalent to css.replaceAll, with hue followed by comma to prevent values with units from being changed. + style.html( css ) + .data( 'hue', to ); + } ); + } ); + + // Page layouts. + wp.customize( 'page_options', function( value ) { + value.bind( function( to ) { + if ( 'one-column' === to ) { + $( 'body' ).addClass( 'page-one-column' ).removeClass( 'page-two-column' ); + } else { + $( 'body' ).removeClass( 'page-one-column' ).addClass( 'page-two-column' ); + } + } ); + } ); +} )( jQuery ); diff --git a/src/wp-content/themes/twentyseventeen/assets/js/global.js b/src/wp-content/themes/twentyseventeen/assets/js/global.js new file mode 100644 index 0000000000..b4141c288e --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/js/global.js @@ -0,0 +1,200 @@ +/* global twentyseventeenScreenReaderText */ +( function( $ ) { + + // Variables and DOM Caching + var $body = $( 'body' ), + $customHeader = $body.find( '.custom-header' ), + $customHeaderImage = $customHeader.find( '.custom-header-image' ), + $branding = $customHeader.find( '.site-branding' ), + $navigation = $body.find( '.navigation-top' ), + $navWrap = $navigation.find( '.wrap' ), + $navMenuItem = $navigation.find( '.menu-item' ), + $menuToggle = $navigation.find( '.menu-toggle' ), + $menuScrollDown = $navigation.find( '.menu-scroll-down' ), + $sidebar = $body.find( '#secondary' ), + $entryContent = $body.find( '.entry-content' ), + $formatQuote = $body.find( '.format-quote blockquote' ), + isFrontPage = $body.hasClass( 'twentyseventeen-front-page' ) || $body.hasClass( 'home blog' ), + navigationFixedClass = 'site-navigation-fixed', + navigationHeight, + navigationOuterHeight, + navPadding, + navMenuItemHeight, + idealNavHeight, + navIsNotTooTall, + headerOffset, + menuTop, + resizeTimer; + + /** + * Sets properties of navigation + */ + function setNavProps() { + navigationHeight = $navigation.height(); + navigationOuterHeight = $navigation.outerHeight(); + navPadding = parseFloat( $navWrap.css( 'padding-top' ) ) * 2; + navMenuItemHeight = $navMenuItem.outerHeight() * 2; + idealNavHeight = navPadding + navMenuItemHeight; + navIsNotTooTall = navigationHeight <= idealNavHeight; + } + + /** + * Makes navigation 'stick' + */ + function adjustScrollClass() { + + // Make sure we're not on a mobile screen + if ( 'none' === $menuToggle.css( 'display' ) ) { + + // Make sure the nav isn't taller than two rows + if ( navIsNotTooTall ) { + + // When there's a custom header image, the header offset includes the height of the navigation + if ( isFrontPage && $customHeaderImage.length ) { + headerOffset = $customHeader.innerHeight() - navigationOuterHeight; + } else { + headerOffset = $customHeader.innerHeight(); + } + + // If the scroll is more than the custom header, set the fixed class + if ( $( window ).scrollTop() >= headerOffset ) { + $navigation.addClass( navigationFixedClass ); + } else { + $navigation.removeClass( navigationFixedClass ); + } + + } else { + + // Remove 'fixed' class if nav is taller than two rows + $navigation.removeClass( navigationFixedClass ); + } + } + } + + /** + * Sets margins of branding in header + */ + function adjustHeaderHeight() { + if ( 'none' === $menuToggle.css( 'display' ) ) { + + // The margin should be applied to different elements on front-page or home vs interior pages. + if ( isFrontPage ) { + $branding.css( 'margin-bottom', navigationOuterHeight ); + } else { + $customHeader.css( 'margin-bottom', navigationOuterHeight ); + } + + } else { + $customHeader.css( 'margin-bottom', '0' ); + $branding.css( 'margin-bottom', '0' ); + } + } + + /** + * Sets icon for quotes + */ + function setQuotesIcon() { + $( twentyseventeenScreenReaderText.quote ).prependTo( $formatQuote ); + } + + /** + * Add 'below-entry-meta' class to elements. + */ + function belowEntryMetaClass( param ) { + var sidebarPos, sidebarPosBottom; + + if ( ! $body.hasClass( 'has-sidebar' ) || ( + $body.hasClass( 'search' ) || + $body.hasClass( 'single-attachment' ) || + $body.hasClass( 'error404' ) || + $body.hasClass( 'twentyseventeen-front-page' ) + ) ) { + return; + } + + sidebarPos = $sidebar.offset(); + sidebarPosBottom = sidebarPos.top + ( $sidebar.height() + 28 ); + + $entryContent.find( param ).each( function() { + var $element = $( this ), + elementPos = $element.offset(), + elementPosTop = elementPos.top; + + // Add 'below-entry-meta' to elements below the entry meta. + if ( elementPosTop > sidebarPosBottom ) { + $element.addClass( 'below-entry-meta' ); + } else { + $element.removeClass( 'below-entry-meta' ); + } + }); + } + + /** + * Test if inline SVGs are supported. + * @link https://github.com/Modernizr/Modernizr/ + */ + function supportsInlineSVG() { + var div = document.createElement( 'div' ); + div.innerHTML = ''; + return 'http://www.w3.org/2000/svg' === ( 'undefined' !== typeof SVGRect && div.firstChild && div.firstChild.namespaceURI ); + } + + // Fires on document ready + $( document ).ready( function() { + + // Let's fire some JavaScript! + if ( 'true' === twentyseventeenScreenReaderText.has_navigation ) { + + /** + * 'Scroll Down' arrow in menu area + */ + if ( $( 'body' ).hasClass( 'admin-bar' ) ) { + menuTop = -32; + } + if ( $( 'body' ).hasClass( 'blog' ) ) { + menuTop -= 30; // The div for latest posts has no space above content, add some to account for this + } + $menuScrollDown.click( function( e ) { + e.preventDefault(); + $( window ).scrollTo( '#primary', { + duration: 600, + offset: { 'top': menuTop - navigationOuterHeight } + } ); + } ); + + setNavProps(); + adjustScrollClass(); + } + + adjustHeaderHeight(); + setQuotesIcon(); + supportsInlineSVG(); + if ( true === supportsInlineSVG() ) { + document.documentElement.className = document.documentElement.className.replace( /(\s*)no-svg(\s*)/, '$1svg$2' ); + } + } ); + + if ( 'true' === twentyseventeenScreenReaderText.has_navigation ) { + + // On scroll, we want to stick/unstick the navigation + $( window ).on( 'scroll', function() { + adjustScrollClass(); + adjustHeaderHeight(); + } ); + + // Also want to make sure the navigation is where it should be on resize + $( window ).resize( function() { + setNavProps(); + setTimeout( adjustScrollClass, 500 ); + setTimeout( adjustHeaderHeight, 1000 ); + } ); + } + + $( window ).resize( function() { + clearTimeout( resizeTimer ); + resizeTimer = setTimeout( function() { + belowEntryMetaClass( 'blockquote.alignleft, blockquote.alignright' ); + }, 300 ); + } ); + +}( jQuery ) ); diff --git a/src/wp-content/themes/twentyseventeen/assets/js/html5.js b/src/wp-content/themes/twentyseventeen/assets/js/html5.js new file mode 100644 index 0000000000..9c1f049556 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/js/html5.js @@ -0,0 +1,326 @@ +/** +* @preserve HTML5 Shiv 3.7.3 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed +*/ +;(function(window, document) { +/*jshint evil:true */ + /** version */ + var version = '3.7.3'; + + /** Preset options */ + var options = window.html5 || {}; + + /** Used to skip problem elements */ + var reSkip = /^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i; + + /** Not all elements can be cloned in IE **/ + var saveClones = /^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i; + + /** Detect whether the browser supports default html5 styles */ + var supportsHtml5Styles; + + /** Name of the expando, to work with multiple documents or to re-shiv one document */ + var expando = '_html5shiv'; + + /** The id for the the documents expando */ + var expanID = 0; + + /** Cached data for each document */ + var expandoData = {}; + + /** Detect whether the browser supports unknown elements */ + var supportsUnknownElements; + + (function() { + try { + var a = document.createElement('a'); + a.innerHTML = ''; + //if the hidden property is implemented we can assume, that the browser supports basic HTML5 Styles + supportsHtml5Styles = ('hidden' in a); + + supportsUnknownElements = a.childNodes.length == 1 || (function() { + // assign a false positive if unable to shiv + (document.createElement)('a'); + var frag = document.createDocumentFragment(); + return ( + typeof frag.cloneNode == 'undefined' || + typeof frag.createDocumentFragment == 'undefined' || + typeof frag.createElement == 'undefined' + ); + }()); + } catch(e) { + // assign a false positive if detection fails => unable to shiv + supportsHtml5Styles = true; + supportsUnknownElements = true; + } + + }()); + + /*--------------------------------------------------------------------------*/ + + /** + * Creates a style sheet with the given CSS text and adds it to the document. + * @private + * @param {Document} ownerDocument The document. + * @param {String} cssText The CSS text. + * @returns {StyleSheet} The style element. + */ + function addStyleSheet(ownerDocument, cssText) { + var p = ownerDocument.createElement('p'), + parent = ownerDocument.getElementsByTagName('head')[0] || ownerDocument.documentElement; + + p.innerHTML = 'x'; + return parent.insertBefore(p.lastChild, parent.firstChild); + } + + /** + * Returns the value of `html5.elements` as an array. + * @private + * @returns {Array} An array of shived element node names. + */ + function getElements() { + var elements = html5.elements; + return typeof elements == 'string' ? elements.split(' ') : elements; + } + + /** + * Extends the built-in list of html5 elements + * @memberOf html5 + * @param {String|Array} newElements whitespace separated list or array of new element names to shiv + * @param {Document} ownerDocument The context document. + */ + function addElements(newElements, ownerDocument) { + var elements = html5.elements; + if(typeof elements != 'string'){ + elements = elements.join(' '); + } + if(typeof newElements != 'string'){ + newElements = newElements.join(' '); + } + html5.elements = elements +' '+ newElements; + shivDocument(ownerDocument); + } + + /** + * Returns the data associated to the given document + * @private + * @param {Document} ownerDocument The document. + * @returns {Object} An object of data. + */ + function getExpandoData(ownerDocument) { + var data = expandoData[ownerDocument[expando]]; + if (!data) { + data = {}; + expanID++; + ownerDocument[expando] = expanID; + expandoData[expanID] = data; + } + return data; + } + + /** + * returns a shived element for the given nodeName and document + * @memberOf html5 + * @param {String} nodeName name of the element + * @param {Document|DocumentFragment} ownerDocument The context document. + * @returns {Object} The shived element. + */ + function createElement(nodeName, ownerDocument, data){ + if (!ownerDocument) { + ownerDocument = document; + } + if(supportsUnknownElements){ + return ownerDocument.createElement(nodeName); + } + if (!data) { + data = getExpandoData(ownerDocument); + } + var node; + + if (data.cache[nodeName]) { + node = data.cache[nodeName].cloneNode(); + } else if (saveClones.test(nodeName)) { + node = (data.cache[nodeName] = data.createElem(nodeName)).cloneNode(); + } else { + node = data.createElem(nodeName); + } + + // Avoid adding some elements to fragments in IE < 9 because + // * Attributes like `name` or `type` cannot be set/changed once an element + // is inserted into a document/fragment + // * Link elements with `src` attributes that are inaccessible, as with + // a 403 response, will cause the tab/window to crash + // * Script elements appended to fragments will execute when their `src` + // or `text` property is set + return node.canHaveChildren && !reSkip.test(nodeName) && !node.tagUrn ? data.frag.appendChild(node) : node; + } + + /** + * returns a shived DocumentFragment for the given document + * @memberOf html5 + * @param {Document} ownerDocument The context document. + * @returns {Object} The shived DocumentFragment. + */ + function createDocumentFragment(ownerDocument, data){ + if (!ownerDocument) { + ownerDocument = document; + } + if(supportsUnknownElements){ + return ownerDocument.createDocumentFragment(); + } + data = data || getExpandoData(ownerDocument); + var clone = data.frag.cloneNode(), + i = 0, + elems = getElements(), + l = elems.length; + for(;igmailcom | http://flesler.blogspot.com + * Licensed under MIT + * http://flesler.blogspot.com/2007/10/jqueryscrollto.html + * @projectDescription Lightweight, cross-browser and highly customizable animated scrolling with jQuery + * @author Ariel Flesler + * @version 2.1.2 + */ +;(function(factory) { + 'use strict'; + if (typeof define === 'function' && define.amd) { + // AMD + define( ['jquery'], factory ); + } else if (typeof module !== 'undefined' && module.exports) { + // CommonJS + module.exports = factory( require( 'jquery' ) ); + } else { + // Global + factory( jQuery ); + } +})(function($) { + 'use strict'; + + var $scrollTo = $.scrollTo = function(target, duration, settings) { + return $( window ).scrollTo( target, duration, settings ); + }; + + $scrollTo.defaults = { + axis:'xy', + duration: 0, + limit:true + }; + + function isWin(elem) { + return ! elem.nodeName || + $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) !== -1; + } + + $.fn.scrollTo = function(target, duration, settings) { + if (typeof duration === 'object') { + settings = duration; + duration = 0; + } + if (typeof settings === 'function') { + settings = { onAfter:settings }; + } + if (target === 'max') { + target = 9e9; + } + + settings = $.extend( {}, $scrollTo.defaults, settings ); + // Speed is still recognized for backwards compatibility + duration = duration || settings.duration; + // Make sure the settings are given right + var queue = settings.queue && settings.axis.length > 1; + if (queue) { + // Let's keep the overall duration + duration /= 2; + } + settings.offset = both( settings.offset ); + settings.over = both( settings.over ); + + return this.each(function() { + // Null target yields nothing, just like jQuery does + if (target === null) { return; } + + var win = isWin( this ), + elem = win ? this.contentWindow || window : this, + $elem = $( elem ), + targ = target, + attr = {}, + toff; + + switch (typeof targ) { + // A number will pass the regex + case 'number': + case 'string': + if (/^([+-]=?)?\d+(\.\d+)?(px|%)?$/.test( targ )) { + targ = both( targ ); + // We are done + break; + } + // Relative/Absolute selector + targ = win ? $( targ ) : $( targ, elem ); + /* falls through */ + case 'object': + if (targ.length === 0) { return; } + // DOMElement / jQuery + if (targ.is || targ.style) { + // Get the real position of the target + toff = (targ = $( targ )).offset(); + } + } + + var offset = $.isFunction( settings.offset ) && settings.offset( elem, targ ) || settings.offset; + + $.each(settings.axis.split( '' ), function(i, axis) { + var Pos = axis === 'x' ? 'Left' : 'Top', + pos = Pos.toLowerCase(), + key = 'scroll' + Pos, + prev = $elem[key](), + max = $scrollTo.max( elem, axis ); + + if (toff) {// jQuery / DOMElement + attr[key] = toff[pos] + (win ? 0 : prev - $elem.offset()[pos]); + + // If it's a dom element, reduce the margin + if (settings.margin) { + attr[key] -= parseInt( targ.css( 'margin' + Pos ), 10 ) || 0; + attr[key] -= parseInt( targ.css( 'border' + Pos + 'Width' ), 10 ) || 0; + } + + attr[key] += offset[pos] || 0; + + if (settings.over[pos]) { + // Scroll to a fraction of its width/height + attr[key] += targ[axis === 'x'?'width':'height']() * settings.over[pos]; + } + } else { + var val = targ[pos]; + // Handle percentage values + attr[key] = val.slice && val.slice( -1 ) === '%' ? + parseFloat( val ) / 100 * max + : val; + } + + // Number or 'number' + if (settings.limit && /^\d+$/.test( attr[key] )) { + // Check the limits + attr[key] = attr[key] <= 0 ? 0 : Math.min( attr[key], max ); + } + + // Don't waste time animating, if there's no need. + if ( ! i && settings.axis.length > 1) { + if (prev === attr[key]) { + // No animation needed + attr = {}; + } else if (queue) { + // Intermediate animation + animate( settings.onAfterFirst ); + // Don't animate this axis again in the next iteration. + attr = {}; + } + } + }); + + animate( settings.onAfter ); + + function animate(callback) { + var opts = $.extend({}, settings, { + // The queue setting conflicts with animate() + // Force it to always be true + queue: true, + duration: duration, + complete: callback && function() { + callback.call( elem, targ, settings ); + } + }); + $elem.animate( attr, opts ); + } + }); + }; + + // Max scrolling position, works on quirks mode + // It only fails (not too badly) on IE, quirks mode. + $scrollTo.max = function(elem, axis) { + var Dim = axis === 'x' ? 'Width' : 'Height', + scroll = 'scroll' + Dim; + + if ( ! isWin( elem )) { + return elem[scroll] - $( elem )[Dim.toLowerCase()](); } + + var size = 'client' + Dim, + doc = elem.ownerDocument || elem.document, + html = doc.documentElement, + body = doc.body; + + return Math.max( html[scroll], body[scroll] ) - Math.min( html[size], body[size] ); + }; + + function both(val) { + return $.isFunction( val ) || $.isPlainObject( val ) ? val : { top:val, left:val }; + } + + // Add special hooks so that window scroll properties can be animated + $.Tween.propHooks.scrollLeft = $.Tween.propHooks.scrollTop = { + get: function(t) { + return $( t.elem )[t.prop](); + }, + set: function(t) { + var curr = this.get( t ); + // If interrupt is true and user scrolled, stop animating + if (t.options.interrupt && t._last && t._last !== curr) { + return $( t.elem ).stop(); + } + var next = Math.round( t.now ); + // Don't waste CPU + // Browsers don't render floating point scroll + if (curr !== next) { + $( t.elem )[t.prop](next); + t._last = this.get( t ); + } + } + }; + + // AMD requirement + return $scrollTo; +}); diff --git a/src/wp-content/themes/twentyseventeen/assets/js/navigation.js b/src/wp-content/themes/twentyseventeen/assets/js/navigation.js new file mode 100644 index 0000000000..e2df1f3955 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/assets/js/navigation.js @@ -0,0 +1,140 @@ +/* global twentyseventeenScreenReaderText */ +/** + * Theme functions file. + * + * Contains handlers for navigation and widget area. + */ + +( function( $ ) { + var masthead, menuToggle, siteNavigation; + + function initMainNavigation( container ) { + + // Add dropdown toggle that displays child menu items. + var dropdownToggle = $( ' + 'top', + 'menu_id' => 'top-menu', + ) ); ?> + + + 'next' ) ); ?> + + diff --git a/src/wp-content/themes/twentyseventeen/components/page/content-front-page-panels.php b/src/wp-content/themes/twentyseventeen/components/page/content-front-page-panels.php new file mode 100644 index 0000000000..aa45a2baa3 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/page/content-front-page-panels.php @@ -0,0 +1,87 @@ + + +
> + + + + + + ID ), 'twentyseventeen-featured-image' ); + + $post_thumbnail_id = get_post_thumbnail_id( $post->ID ); + + $thumbnail_attributes = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'twentyseventeen-featured-image' ); + + // Calculate aspect ratio: h / w * 100%. + $ratio = $thumbnail_attributes[2] / $thumbnail_attributes[1] * 100; + ?> + +
+
+
+ + + +
+
+
+ ', '' ); ?> + + + +
+ +
+ "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + ?> +
+ + + + 3, + 'post_status' => 'publish', + 'ignore_sticky_posts' => true, + 'no_found_rows' => true, + ) ); + ?> + + have_posts() ) : ?> + +
+ + have_posts() ) : $recent_posts->the_post(); + get_template_part( 'components/post/content', 'excerpt' ); + endwhile; + wp_reset_postdata(); + ?> +
+ + + +
+
+ +
diff --git a/src/wp-content/themes/twentyseventeen/components/page/content-front-page.php b/src/wp-content/themes/twentyseventeen/components/page/content-front-page.php new file mode 100644 index 0000000000..cb0ab7d649 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/page/content-front-page.php @@ -0,0 +1,36 @@ + +
> + +
+
+
+ ', '' ); ?> + + + +
+ +
+ "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + ?> +
+ +
+
+ +
diff --git a/src/wp-content/themes/twentyseventeen/components/page/content-page.php b/src/wp-content/themes/twentyseventeen/components/page/content-page.php new file mode 100644 index 0000000000..4c470acfbe --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/page/content-page.php @@ -0,0 +1,30 @@ + + +
> +
+ ', '' ); ?> + +
+
+ '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + ) ); + ?> +
+
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-audio.php b/src/wp-content/themes/twentyseventeen/components/post/content-audio.php new file mode 100644 index 0000000000..b23a9195a0 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-audio.php @@ -0,0 +1,93 @@ + + +
> + 'pinned' ) ); + endif; + ?> +
+ '; + if ( is_single() ) : + twentyseventeen_posted_on(); + else : + echo twentyseventeen_time_link(); + twentyseventeen_edit_link(); + endif; + echo ''; + endif; + + if ( is_single() ) { + the_title( '

', '

' ); + } else { + the_title( '

', '

' ); + } + ?> +
+ + + + +
+ + + +
+ + +
+ + '; + echo $audio_html; + echo '
'; + } + endif; + + endif; + + if ( is_single() || empty( $audio ) ) : + + /* translators: %s: Name of current post */ + the_content( sprintf( + __( 'Continue reading "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + ) ); + + endif; ?> + + + + + + + +
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-excerpt.php b/src/wp-content/themes/twentyseventeen/components/post/content-excerpt.php new file mode 100644 index 0000000000..0b342d25b6 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-excerpt.php @@ -0,0 +1,40 @@ + + + diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-gallery.php b/src/wp-content/themes/twentyseventeen/components/post/content-gallery.php new file mode 100644 index 0000000000..0583fe6782 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-gallery.php @@ -0,0 +1,85 @@ + + +
> + 'pinned' ) ); + endif; + ?> +
+ '; + if ( is_single() ) : + twentyseventeen_posted_on(); + else : + echo twentyseventeen_time_link(); + twentyseventeen_edit_link(); + endif; + echo ''; + endif; + + if ( is_single() ) { + the_title( '

', '

' ); + } else { + the_title( '

', '

' ); + } + ?> +
+ + +
+ + + +
+ + +
+ + '; + echo get_post_gallery(); + echo '
'; + endif; + + endif; + + if ( is_single() || ! get_post_gallery() ) : + + /* translators: %s: Name of current post */ + the_content( sprintf( + __( 'Continue reading "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + ) ); + + endif; ?> + + + + + + + +
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-image.php b/src/wp-content/themes/twentyseventeen/components/post/content-image.php new file mode 100644 index 0000000000..52bc0a6bf1 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-image.php @@ -0,0 +1,75 @@ + + +
> + 'pinned' ) ); + endif; + ?> +
+ '; + if ( is_single() ) : + twentyseventeen_posted_on(); + else : + echo twentyseventeen_time_link(); + twentyseventeen_edit_link(); + endif; + echo ''; + endif; + + if ( is_single() ) { + the_title( '

', '

' ); + } else { + the_title( '

', '

' ); + } + ?> +
+ + +
+ + + +
+ + +
+ + "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + ) ); + + endif; ?> + +
+ + + + + +
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-none.php b/src/wp-content/themes/twentyseventeen/components/post/content-none.php new file mode 100644 index 0000000000..c42941bb8d --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-none.php @@ -0,0 +1,33 @@ + + +
+
+

+
+
+ + +

Get started here.', 'twentyseventeen' ), esc_url( admin_url( 'post-new.php' ) ) ); ?>

+ + + +

+ +
+
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content-video.php b/src/wp-content/themes/twentyseventeen/components/post/content-video.php new file mode 100644 index 0000000000..c3e337d41f --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content-video.php @@ -0,0 +1,92 @@ + + +
> + 'pinned' ) ); + endif; + ?> +
+ '; + if ( is_single() ) : + twentyseventeen_posted_on(); + else : + echo twentyseventeen_time_link(); + twentyseventeen_edit_link(); + endif; + echo ''; + endif; + + if ( is_single() ) { + the_title( '

', '

' ); + } else { + the_title( '

', '

' ); + } + ?> +
+ + + + +
+ + + +
+ + +
+ + '; + echo $video_html; + echo '
'; + } + endif; + + endif; + + if ( is_single() || empty( $video ) ) : + + /* translators: %s: Name of current post */ + the_content( sprintf( + __( 'Continue reading "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + ) ); + + endif; ?> + + + + + + + +
diff --git a/src/wp-content/themes/twentyseventeen/components/post/content.php b/src/wp-content/themes/twentyseventeen/components/post/content.php new file mode 100644 index 0000000000..9b89202bca --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/components/post/content.php @@ -0,0 +1,71 @@ + + +
> + 'pinned' ) ); + endif; + ?> +
+ '; + if ( is_single() ) : + twentyseventeen_posted_on(); + else : + echo twentyseventeen_time_link(); + twentyseventeen_edit_link(); + endif; + echo ''; + endif; + + if ( is_single() ) { + the_title( '

', '

' ); + } else { + the_title( '

', '

' ); + } + ?> +
+ + +
+ + + +
+ + +
+ "%s"', 'twentyseventeen' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'twentyseventeen' ), + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + ) ); + ?> +
+ + + + + +
diff --git a/src/wp-content/themes/twentyseventeen/footer.php b/src/wp-content/themes/twentyseventeen/footer.php new file mode 100644 index 0000000000..e911c1a7da --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/footer.php @@ -0,0 +1,46 @@ + + + + +
+
+ + + +
+
+ + + + + diff --git a/src/wp-content/themes/twentyseventeen/front-page.php b/src/wp-content/themes/twentyseventeen/front-page.php new file mode 100644 index 0000000000..ea4ddc996d --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/front-page.php @@ -0,0 +1,65 @@ + + +
+
+ + + + ' . sprintf( __( 'Panel %1$s Placeholder', 'twentyseventeen' ), esc_attr( $twentyseventeencounter ) ) . ''; + endif; + + $twentyseventeencounter++; + endforeach; + ?> + + + +
+
+ + tag in the document head, and expect WordPress to + * provide it for us. + */ + add_theme_support( 'title-tag' ); + + /* + * Enable support for Post Thumbnails on posts and pages. + * + * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/ + */ + add_theme_support( 'post-thumbnails' ); + + add_image_size( 'twentyseventeen-featured-image', 2000, 1200, true ); + + add_image_size( 'twentyseventeen-thumbnail-avatar', 100, 100, true ); + + // This theme uses wp_nav_menu() in two locations. + register_nav_menus( array( + 'top' => __( 'Top', 'twentyseventeen' ), + 'social' => __( 'Social Links Menu', 'twentyseventeen' ), + ) ); + + /* + * Switch default core markup for search form, comment form, and comments + * to output valid HTML5. + */ + add_theme_support( 'html5', array( + 'comment-form', + 'comment-list', + 'gallery', + 'caption', + ) ); + + /* + * Enable support for Post Formats. + * + * See: https://codex.wordpress.org/Post_Formats + */ + add_theme_support( 'post-formats', array( + 'aside', + 'image', + 'video', + 'quote', + 'link', + 'gallery', + 'audio', + ) ); + + // Add theme support for Custom Logo. + add_theme_support( 'custom-logo', array( + 'width' => 250, + 'height' => 250, + 'flex-width' => true, + ) ); + + /* + * This theme styles the visual editor to resemble the theme style, + * specifically font, colors, and column width. + */ + add_editor_style( array( 'assets/css/editor-style.css', twentyseventeen_fonts_url() ) ); +} +add_action( 'after_setup_theme', 'twentyseventeen_setup' ); + +/** + * Set the content width in pixels, based on the theme's design and stylesheet. + * + * Priority 0 to make it available to lower priority callbacks. + * + * @global int $content_width + */ +function twentyseventeen_content_width() { + + $content_width = 700; + + if ( twentyseventeen_is_frontpage() ) { + $content_width = 1120; + } + + $GLOBALS['content_width'] = apply_filters( 'twentyseventeen_content_width', $content_width ); +} +add_action( 'after_setup_theme', 'twentyseventeen_content_width', 0 ); + +/** + * Register custom fonts. + */ +function twentyseventeen_fonts_url() { + $fonts_url = ''; + + /** + * Translators: If there are characters in your language that are not + * supported by Libre Frankin, translate this to 'off'. Do not translate + * into your own language. + */ + $libre_franklin = _x( 'on', 'libre_franklin font: on or off', 'twentyseventeen' ); + + if ( 'off' !== $libre_franklin ) { + $font_families = array(); + + $font_families[] = 'Libre Franklin:300,300i,400,400i,600,600i,800,800i'; + + $query_args = array( + 'family' => urlencode( implode( '|', $font_families ) ), + 'subset' => urlencode( 'latin,latin-ext' ), + ); + + $fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' ); + } + + return esc_url_raw( $fonts_url ); +} + +/** + * Add preconnect for Google Fonts. + * + * @since Twenty Seventeen 1.0 + * + * @param array $urls URLs to print for resource hints. + * @param string $relation_type The relation type the URLs are printed. + * @return array $urls URLs to print for resource hints. + */ +function twentyseventeen_resource_hints( $urls, $relation_type ) { + if ( wp_style_is( 'twentyseventeen-fonts', 'queue' ) && 'preconnect' === $relation_type ) { + $urls[] = array( + 'href' => 'https://fonts.gstatic.com', + 'crossorigin', + ); + } + + return $urls; +} +add_filter( 'wp_resource_hints', 'twentyseventeen_resource_hints', 10, 2 ); + +/** + * Register widget area. + * + * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar + */ +function twentyseventeen_widgets_init() { + register_sidebar( array( + 'name' => __( 'Sidebar', 'twentyseventeen' ), + 'id' => 'sidebar-1', + 'description' => __( 'Add widgets here to appear in your sidebar.', 'twentyseventeen' ), + 'before_widget' => '
', + 'after_widget' => '
', + 'before_title' => '

', + 'after_title' => '

', + ) ); + + register_sidebar( array( + 'name' => __( 'Footer 1', 'twentyseventeen' ), + 'id' => 'sidebar-2', + 'description' => __( 'Add widgets here to appear in your footer.', 'twentyseventeen' ), + 'before_widget' => '
', + 'after_widget' => '
', + 'before_title' => '

', + 'after_title' => '

', + ) ); + + register_sidebar( array( + 'name' => __( 'Footer 2', 'twentyseventeen' ), + 'id' => 'sidebar-3', + 'description' => __( 'Add widgets here to appear in your footer.', 'twentyseventeen' ), + 'before_widget' => '
', + 'after_widget' => '
', + 'before_title' => '

', + 'after_title' => '

', + ) ); +} +add_action( 'widgets_init', 'twentyseventeen_widgets_init' ); + +/** + * Replaces "[...]" (appended to automatically generated excerpts) with ... and + * a 'Continue reading' link. + * + * Create your own twentysixteen_excerpt_more() function to override in a child theme. + * + * @since Twenty Seventeen 1.0 + * + * @return string 'Continue reading' link prepended with an ellipsis. + */ +function twentyseventeen_excerpt_more() { + $link = sprintf( '

%2$s

', + esc_url( get_permalink( get_the_ID() ) ), + /* translators: %s: Name of current post */ + sprintf( __( 'Continue reading "%s"', 'twentyseventeen' ), get_the_title( get_the_ID() ) ) + ); + return ' … ' . $link; +} +add_filter( 'excerpt_more', 'twentyseventeen_excerpt_more' ); + +/** + * Handles JavaScript detection. + * + * Adds a `js` class to the root `` element when JavaScript is detected. + * + * @since Twenty Seventeen 1.0 + */ +function twentyseventeen_javascript_detection() { + echo "\n"; +} +add_action( 'wp_head', 'twentyseventeen_javascript_detection', 0 ); + +/** + * Add a pingback url auto-discovery header for singularly identifiable articles. + */ +function twentyseventeen_pingback_header() { + if ( is_singular() && pings_open() ) { + printf( '' . "\n", get_bloginfo( 'pingback_url' ) ); + } +} +add_action( 'wp_head', 'twentyseventeen_pingback_header' ); + +/** + * Display custom color CSS. + */ +function twentyseventeen_colors_css_wrap() { + if ( 'custom' !== get_theme_mod( 'colorscheme' ) && ! is_customize_preview() ) { + return; + } + + require_once( get_parent_theme_file_path( '/inc/color-patterns.php' ) ); + $hue = absint( get_theme_mod( 'colorscheme_hue', 250 ) ); +?> + + twentyseventeen_get_svg( array( 'icon' => 'quote-right' ) ), + 'has_navigation' => 'false', + ); + + if ( has_nav_menu( 'top' ) ) { + wp_enqueue_script( 'twentyseventeen-navigation', get_theme_file_uri( '/assets/js/navigation.js' ), array(), '1.0', true ); + $twentyseventeen_l10n['has_navigation'] = 'true'; + $twentyseventeen_l10n['expand'] = __( 'Expand child menu', 'twentyseventeen' ); + $twentyseventeen_l10n['collapse'] = __( 'Collapse child menu', 'twentyseventeen' ); + $twentyseventeen_l10n['icon'] = twentyseventeen_get_svg( array( 'icon' => 'expand', 'fallback' => true ) ); + } + + wp_enqueue_script( 'twentyseventeen-global', get_theme_file_uri( '/assets/js/global.js' ), array( 'jquery' ), '1.0', true ); + + wp_localize_script( 'twentyseventeen-skip-link-focus-fix', 'twentyseventeenScreenReaderText', $twentyseventeen_l10n ); + + if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) { + wp_enqueue_script( 'comment-reply' ); + } + + // Scroll effects (only loaded on front page). + if ( is_front_page() ) { + wp_enqueue_script( 'jquery-scrollto', get_template_directory_uri() . '/assets/js/jquery.scrollTo.js', array( 'jquery' ), '2.1.2', true ); + } +} +add_action( 'wp_enqueue_scripts', 'twentyseventeen_scripts' ); + +/** + * Add custom image sizes attribute to enhance responsive image functionality + * for content images. + * + * @since Twenty Seventeen 1.0 + * + * @param string $sizes A source size value for use in a 'sizes' attribute. + * @param array $size Image size. Accepts an array of width and height + * values in pixels (in that order). + * @return string A source size value for use in a content image 'sizes' attribute. + */ +function twentyseventeen_content_image_sizes_attr( $sizes, $size ) { + $width = $size[0]; + + 740 <= $width && $sizes = '(max-width: 706px) 89vw, (max-width: 767px) 82vw, 740px'; + + if ( is_active_sidebar( 'sidebar-1' ) || is_archive() || is_search() || is_home() || is_page() ) { + if ( ! ( is_page() && 'one-column' === get_theme_mod( 'page_options' ) ) ) { + 767 <= $width && $sizes = '(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px'; + } + } + + return $sizes; +} +add_filter( 'wp_calculate_image_sizes', 'twentyseventeen_content_image_sizes_attr', 10, 2 ); + +/** + * Add custom image sizes attribute to enhance responsive image functionality + * for post thumbnails. + * + * @since Twenty Seventeen 1.0 + * + * @param array $attr Attributes for the image markup. + * @param int $attachment Image attachment ID. + * @param array $size Registered image size or flat array of height and width dimensions. + * @return string A source size value for use in a post thumbnail 'sizes' attribute. + */ +function twentyseventeen_post_thumbnail_sizes_attr( $attr, $attachment, $size ) { + if ( is_archive() || is_search() || is_home() ) { + $attr['sizes'] = '(max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px'; + } else { + $attr['sizes'] = '100vw'; + } + + return $attr; +} +add_filter( 'wp_get_attachment_image_attributes', 'twentyseventeen_post_thumbnail_sizes_attr', 10, 3 ); + +/** + * Use front-page.php when Front page displays is set to a static page. + * + * @since Twenty Seventeen 1.0 + * + * @param string $template front-page.php. + * + * @return string The template to be used: blank if is_home() is true (defaults to index.php), else $template. + */ +function twentyseventeen_front_page_template( $template ) { + return is_home() ? '' : $template; +} +add_filter( 'frontpage_template', 'twentyseventeen_front_page_template' ); + +/** + * Implement the Custom Header feature. + */ +require get_parent_theme_file_path( '/inc/custom-header.php' ); + +/** + * Custom template tags for this theme. + */ +require get_parent_theme_file_path( '/inc/template-tags.php' ); + +/** + * Additional features to allow styling of the templates. + */ +require get_parent_theme_file_path( '/inc/template-functions.php' ); + +/** + * Customizer additions. + */ +require get_parent_theme_file_path( '/inc/customizer.php' ); + +/** + * SVG icons functions and filters. + */ +require get_parent_theme_file_path( '/inc/icon-functions.php' ); diff --git a/src/wp-content/themes/twentyseventeen/header.php b/src/wp-content/themes/twentyseventeen/header.php new file mode 100644 index 0000000000..f76bbf379a --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/header.php @@ -0,0 +1,52 @@ + section and everything up until
+ * + * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials + * + * @package WordPress + * @subpackage Twenty_Seventeen + * @since 1.0 + * @version 1.0 + */ + +?> + class="no-js no-svg"> + + + + + + + + +> +
+ + + + + '; + the_post_thumbnail( 'twentyseventeen-featured-image' ); + echo '
'; + endif; + ?> + +
diff --git a/src/wp-content/themes/twentyseventeen/inc/back-compat.php b/src/wp-content/themes/twentyseventeen/inc/back-compat.php new file mode 100644 index 0000000000..4772f5621a --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/inc/back-compat.php @@ -0,0 +1,69 @@ +

%s

', $message ); +} + +/** + * Prevents the Customizer from being loaded on WordPress versions prior to 4.7. + * + * @since Twenty Seventeen 1.0 + * + * @global string $wp_version WordPress version. + */ +function twentyseventeen_customize() { + wp_die( sprintf( __( 'Twenty Seventeen requires at least WordPress version 4.7. You are running version %s. Please upgrade and try again.', 'twentyseventeen' ), $GLOBALS['wp_version'] ), '', array( + 'back_link' => true, + ) ); +} +add_action( 'load-customize.php', 'twentyseventeen_customize' ); + +/** + * Prevents the Theme Preview from being loaded on WordPress versions prior to 4.7. + * + * @since Twenty Seventeen 1.0 + * + * @global string $wp_version WordPress version. + */ +function twentyseventeen_preview() { + if ( isset( $_GET['preview'] ) ) { + wp_die( sprintf( __( 'Twenty Seventeen requires at least WordPress version 4.7. You are running version %s. Please upgrade and try again.', 'twentyseventeen' ), $GLOBALS['wp_version'] ) ); + } +} +add_action( 'template_redirect', 'twentyseventeen_preview' ); diff --git a/src/wp-content/themes/twentyseventeen/inc/color-patterns.php b/src/wp-content/themes/twentyseventeen/inc/color-patterns.php new file mode 100644 index 0000000000..4fd22dad8f --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/inc/color-patterns.php @@ -0,0 +1,463 @@ + .comment-body > .comment-meta > .comment-author:before, +.colors-custom .entry-footer .edit-link a.post-edit-link { + background-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 13% ); /* base: #222; */ +} + +.colors-custom input[type="text"]:focus, +.colors-custom input[type="email"]:focus, +.colors-custom input[type="url"]:focus, +.colors-custom input[type="password"]:focus, +.colors-custom input[type="search"]:focus, +.colors-custom input[type="number"]:focus, +.colors-custom input[type="tel"]:focus, +.colors-custom input[type="range"]:focus, +.colors-custom input[type="date"]:focus, +.colors-custom input[type="month"]:focus, +.colors-custom input[type="week"]:focus, +.colors-custom input[type="time"]:focus, +.colors-custom input[type="datetime"]:focus, +.colors-custom .colors-custom input[type="datetime-local"]:focus, +.colors-custom input[type="color"]:focus, +.colors-custom textarea:focus, +.colors-custom button.secondary, +.colors-custom input[type="reset"], +.colors-custom input[type="button"].secondary, +.colors-custom input[type="reset"].secondary, +.colors-custom input[type="submit"].secondary, +.colors-custom a, +.colors-custom a:visited, +.colors-custom .site-title, +.colors-custom .site-title a, +.colors-custom .navigation-top a, +.colors-custom .navigation-top a:visited, +.colors-custom .dropdown-toggle, +.colors-custom .menu-toggle, +.colors-custom .page .panel-content .entry-title, +.colors-custom .page-title, +.colors-custom.page:not(.twentyseventeen-front-page) .entry-title, +.colors-custom .page-links a .page-number, +.colors-custom .comment-metadata a.comment-edit-link, +.colors-custom .comment-reply-link .icon, +.colors-custom h2.widget-title, +.colors-custom mark { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 13% ); /* base: #222; */ +} + +body.colors-custom, +.colors-custom button, +.colors-custom input, +.colors-custom select, +.colors-custom textarea, +.colors-custom h3, +.colors-custom h4, +.colors-custom h6, +.colors-custom label, +.colors-custom .entry-title a, +.colors-custom.twentyseventeen-front-page .panel-content .recent-posts article, +.colors-custom .entry-footer .cat-links a, +.colors-custom .entry-footer .tags-links a, +.colors-custom .format-quote blockquote, +.colors-custom .nav-title, +.colors-custom .comment-body { + color: hsl( ' . esc_attr( $hue ) . ', ' . $reduced_saturation . ', 20% ); /* base: #333; */ +} + + +.colors-custom input[type="text"]:focus, +.colors-custom input[type="email"]:focus, +.colors-custom input[type="url"]:focus, +.colors-custom input[type="password"]:focus, +.colors-custom input[type="search"]:focus, +.colors-custom input[type="number"]:focus, +.colors-custom input[type="tel"]:focus, +.colors-custom input[type="range"]:focus, +.colors-custom input[type="date"]:focus, +.colors-custom input[type="month"]:focus, +.colors-custom input[type="week"]:focus, +.colors-custom input[type="time"]:focus, +.colors-custom input[type="datetime"]:focus, +.colors-custom input[type="datetime-local"]:focus, +.colors-custom input[type="color"]:focus, +.colors-custom textarea:focus { + border-color: hsl( ' . esc_attr( $hue ) . ', ' . $reduced_saturation . ', 20% ); /* base: #333; */ +} + +.colors-custom h2, +.colors-custom blockquote, +.colors-custom input[type="text"], +.colors-custom input[type="email"], +.colors-custom input[type="url"], +.colors-custom input[type="password"], +.colors-custom input[type="search"], +.colors-custom input[type="number"], +.colors-custom input[type="tel"], +.colors-custom input[type="range"], +.colors-custom input[type="date"], +.colors-custom input[type="month"], +.colors-custom input[type="week"], +.colors-custom input[type="time"], +.colors-custom input[type="datetime"], +.colors-custom input[type="datetime-local"], +.colors-custom input[type="color"], +.colors-custom textarea, +.colors-custom .entry-content blockquote.alignleft, +.colors-custom .entry-content blockquote.alignright, +.colors-custom .colors-custom .taxonomy-description, +.colors-custom .site-info a, +.colors-custom .wp-caption { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 40% ); /* base: #666; */ +} + +.colors-custom abbr, +.colors-custom acronym { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 40% ); /* base: #666; */ +} + +.colors-custom h5, +.colors-custom .entry-meta, +.colors-custom .entry-meta a, +.colors-custom .nav-subtitle, +.colors-custom .comment-metadata, +.colors-custom .comment-metadata a, +.colors-custom .no-comments, +.colors-custom .comment-awaiting-moderation, +.colors-custom .page-numbers.current, +.colors-custom .page-links .page-number, +.colors-custom .site-description, +.colors-custom .navigation-top .current-menu-item > a, +.colors-custom .navigation-top .current-menu-item > a:visited, +.colors-custom .navigation-top .current_page_item > a, +.colors-custom .navigation-top .current_page_item > a:visited { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 46% ); /* base: #767676; */ +} + +.colors-custom button:hover, +.colors-custom button:focus, +.colors-custom input[type="button"]:hover, +.colors-custom input[type="button"]:focus, +.colors-custom input[type="submit"]:hover, +.colors-custom input[type="submit"]:focus, +.colors-custom .entry-content a:focus, +.colors-custom .entry-content a:hover, +.colors-custom .entry-summary a:focus, +.colors-custom .entry-summary a:hover, +.colors-custom .widget a:focus, +.colors-custom .widget a:hover, +.colors-custom .colors-custom .site-footer .widget-area a:focus, +.colors-custom .site-footer .widget-area a:hover, +.colors-custom .posts-navigation a:focus, +.colors-custom .posts-navigation a:hover, +.colors-custom .comment-navigation a:focus, +.colors-custom .comment-navigation a:hover, +.colors-custom .comment-metadata a:focus, +.colors-custom .comment-metadata a:hover, +.colors-custom .comment-metadata a.comment-edit-link:focus, +.colors-custom .comment-metadata a.comment-edit-link:hover, +.colors-custom .comment-reply-link:focus, +.colors-custom .comment-reply-link:hover, +.colors-custom .widget_authors a:focus strong, +.colors-custom .widget_authors a:hover strong, +.colors-custom .project-terms a:focus, +.colors-custom .project-terms a:hover, +.colors-custom .entry-title a:focus, +.colors-custom .entry-title a:hover, +.colors-custom .entry-meta a:focus, +.colors-custom .entry-meta a:hover, +.colors-custom .page-links a:focus .page-number, +.colors-custom .page-links a:hover .page-number, +.colors-custom .entry-footer a:focus, +.colors-custom .entry-footer a:hover, +.colors-custom .entry-footer .cat-links a:focus, +.colors-custom .entry-footer .cat-links a:hover, +.colors-custom .entry-footer .tags-links a:focus, +.colors-custom .entry-footer .tags-links a:hover, +.colors-custom .post-navigation a:focus, +.colors-custom .post-navigation a:hover, +.colors-custom .logged-in-as a:focus, +.colors-custom .logged-in-as a:hover, +.colors-custom .comment-navigation a:focus, +.colors-custom .comment-navigation a:hover, +.colors-custom a:focus .nav-title, +.colors-custom .colors-custom a:hover .nav-title, +.colors-custom .edit-link a:focus, +.colors-custom .edit-link a:hover, +.colors-custom .pagination a:focus, +.colors-custom .pagination a:hover, +.colors-custom .site-info a:focus, +.colors-custom .site-info a:hover, +.colors-custom .widget .widget-title a:focus, +.colors-custom .widget .widget-title a:hover, +.colors-custom .widget ul li a:focus, +.colors-custom .widget ul li a:hover, +.colors-custom .entry-footer .edit-link a.post-edit-link:hover, +.colors-custom .entry-footer .edit-link a.post-edit-link:focus, +.colors-custom .social-navigation a:hover, +.colors-custom .social-navigation a:focus { + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 46% ); /* base: #767676; */ +} + +.colors-custom .entry-content a, +.colors-custom .entry-content a:visited, +.colors-custom .entry-summary a, +.colors-custom .entry-summary a:visited, +.colors-custom .widget a, +.colors-custom .widget a:visited, +.colors-custom .site-footer .widget-area a, +.colors-custom .site-footer .widget-area a:visited, +.colors-custom .posts-navigation a, +.colors-custom .posts-navigation a:visited, +.colors-custom .widget_authors a strong, +.colors-custom .widget_authors a:visited strong { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 46% ); /* base: #767676; */ +} + +.colors-custom button.secondary:hover, +.colors-custom button.secondary:focus, +.colors-custom input[type="reset"]:hover, +.colors-custom input[type="reset"]:focus, +.colors-custom input[type="button"].secondary:hover, +.colors-custom input[type="button"].secondary:focus, +.colors-custom input[type="reset"].secondary:hover, +.colors-custom input[type="reset"].secondary:focus, +.colors-custom input[type="submit"].secondary:hover, +.colors-custom input[type="submit"].secondary:focus, +.colors-custom .social-navigation a, +.colors-custom hr { + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 73% ); /* base: #bbb; */ +} + +.colors-custom input[type="text"], +.colors-custom input[type="email"], +.colors-custom input[type="url"], +.colors-custom input[type="password"], +.colors-custom input[type="search"], +.colors-custom input[type="number"], +.colors-custom input[type="tel"], +.colors-custom input[type="range"], +.colors-custom input[type="date"], +.colors-custom input[type="month"], +.colors-custom input[type="week"], +.colors-custom input[type="time"], +.colors-custom input[type="datetime"], +.colors-custom input[type="datetime-local"], +.colors-custom input[type="color"], +.colors-custom textarea, +.colors-custom select, +.colors-custom fieldset, +.colors-custom .widget .tagcloud a:hover, +.colors-custom .widget .tagcloud a:focus, +.colors-custom .widget.widget_tag_cloud a:hover, +.colors-custom .widget.widget_tag_cloud a:focus, +.colors-custom .wp_widget_tag_cloud a:hover, +.colors-custom .wp_widget_tag_cloud a:focus { + border-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 73% ); /* base: #bbb; */ +} + +.colors-custom .entry-footer .cat-links .icon, +.colors-custom .entry-footer .tags-links .icon { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 73% ); /* base: #bbb; */ +} + +.colors-custom button.secondary, +.colors-custom input[type="reset"], +.colors-custom input[type="button"].secondary, +.colors-custom input[type="reset"].secondary, +.colors-custom input[type="submit"].secondary, +.colors-custom .prev.page-numbers, +.colors-custom .next.page-numbers { + background-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 87% ); /* base: #ddd; */ +} + +.colors-custom .widget .tagcloud a, +.colors-custom .widget.widget_tag_cloud a, +.colors-custom .wp_widget_tag_cloud a { + border-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 87% ); /* base: #ddd; */ +} + +.colors-custom.twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child), +.colors-custom .widget ul li { + border-top-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 87% ); /* base: #ddd; */ +} + +.colors-custom .widget ul li { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 87% ); /* base: #ddd; */ +} + +.colors-custom pre, +.colors-custom mark, +.colors-custom ins { + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 93% ); /* base: #eee; */ +} + +.colors-custom .navigation-top, +.colors-custom .main-navigation > div > ul, +.colors-custom .pagination, +.colors-custom .comment-navigation, +.colors-custom .entry-footer, +.colors-custom .site-footer { + border-top-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 93% ); /* base: #eee; */ +} + +.colors-custom .navigation-top, +.colors-custom .main-navigation li, +.colors-custom .entry-footer, +.colors-custom #comments { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 93% ); /* base: #eee; */ +} + +.colors-custom .site-header { + background-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 98% ); /* base: #fafafa; */ +} + +.colors-custom .entry-content a:focus, +.colors-custom .entry-content a:hover, +.colors-custom .entry-summary a:focus, +.colors-custom .entry-summary a:hover, +.colors-custom .widget a:focus, +.colors-custom .widget a:hover, +.colors-custom .site-footer .widget-area a:focus, +.colors-custom .site-footer .widget-area a:hover, +.colors-custom .posts-navigation a:focus, +.colors-custom .posts-navigation a:hover, +.colors-custom .comment-navigation a:focus, +.colors-custom .comment-navigation a:hover, +.colors-custom .comment-metadata a:focus, +.colors-custom .comment-metadata a:hover, +.colors-custom .comment-metadata a.comment-edit-link:focus, +.colors-custom .comment-metadata a.comment-edit-link:hover, +.colors-custom .comment-reply-link:focus, +.colors-custom .comment-reply-link:hover, +.colors-custom .widget_authors a:focus strong, +.colors-custom .widget_authors a:hover strong, +.colors-custom .project-terms a:focus, +.colors-custom .project-terms a:hover, +.colors-custom .colors-custom .entry-title a:focus, +.colors-custom .entry-title a:hover, +.colors-custom .entry-meta a:focus, +.colors-custom .entry-meta a:hover, +.colors-custom .page-links a:focus .page-number, +.colors-custom .page-links a:hover .page-number, +.colors-custom .entry-footer a:focus, +.colors-custom .entry-footer a:hover, +.colors-custom .entry-footer .cat-links a:focus, +.colors-custom .entry-footer .cat-links a:hover, +.colors-custom .entry-footer .tags-links a:focus, +.colors-custom .entry-footer .tags-links a:hover, +.colors-custom .post-navigation a:focus, +.colors-custom .post-navigation a:hover, +.colors-custom .logged-in-as a:focus, +.colors-custom .logged-in-as a:hover, +.colors-custom .comment-navigation a:focus, +.colors-custom .comment-navigation a:hover, +.colors-custom a:focus .nav-title, +.colors-custom a:hover .nav-title, +.colors-custom .edit-link a:focus, +.colors-custom .edit-link a:hover, +.colors-custom .pagination a:focus, +.colors-custom .pagination a:hover, +.colors-custom .site-info a:focus, +.colors-custom .site-info a:hover, +.colors-custom .widget .widget-title a:focus, +.colors-custom .widget .widget-title a:hover, +.colors-custom .widget ul li a:focus, +.colors-custom .widget ul li a:hover, +.colors-custom button, +.colors-custom input[type="button"], +.colors-custom input[type="submit"], +.colors-custom .entry-footer .edit-link a.post-edit-link, +.colors-custom .social-navigation a { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ +} + +body.colors-custom, +.colors-custom .navigation-top, +.colors-custom .main-navigation ul { + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ +} + +.colors-custom .bypostauthor > .comment-body > .comment-meta > .comment-author:before { + border-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ +} + +.colors-custom .menu-toggle, +.colors-custom .menu-toggle:hover, +.colors-custom .menu-toggle:focus, +.colors-custom .menu .dropdown-toggle +.colors-custom .menu-scroll-down, +.colors-custom .menu-scroll-down:hover, +.colors-custom .menu-scroll-down:focus { + background-color: transparent; +} + + +@media screen and (min-width: 48em) { + + .colors-custom .nav-links .nav-previous .nav-title .icon, + .colors-custom .nav-links .nav-next .nav-title .icon { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 20% ); /* base: #222; */ + } + + .colors-custom .main-navigation li li:hover, + .colors-custom .main-navigation li li.focus { + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 46% ); /* base: #767676; */ + } + + .colors-custom .menu-scroll-down { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 46% ); /* base: #767676; */; + } + + .colors-custom .main-navigation ul ul { + border-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 93% ); /* base: #eee; */ + background: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ + } + + .colors-custom .main-navigation ul li.menu-item-has-children:before, + .colors-custom .main-navigation ul li.page_item_has_children:before { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 93% ); /* base: #eee; */ + } + + .colors-custom .main-navigation ul li.menu-item-has-children:after, + .colors-custom .main-navigation ul li.page_item_has_children:after { + border-bottom-color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ + } + + .colors-custom .main-navigation li li.focus > a, + .colors-custom .main-navigation li li:focus > a, + .colors-custom .main-navigation li li:hover > a, + .colors-custom .main-navigation li li a:hover, + .colors-custom .main-navigation li li a:focus, + .colors-custom .main-navigation li li.current_page_item a:hover, + .colors-custom .main-navigation li li.current-menu-item a:hover, + .colors-custom .main-navigation li li.current_page_item a:focus, + .colors-custom .main-navigation li li.current-menu-item a:focus { + color: hsl( ' . esc_attr( $hue ) . ', ' . esc_attr( $saturation ) . ', 100% ); /* base: #fff; */ + } +}'; + + return $css; +} diff --git a/src/wp-content/themes/twentyseventeen/inc/custom-header.php b/src/wp-content/themes/twentyseventeen/inc/custom-header.php new file mode 100644 index 0000000000..3a8198e616 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/inc/custom-header.php @@ -0,0 +1,79 @@ + get_parent_theme_file_uri( '/assets/images/header.jpg' ), + 'default-text-color' => 'ffffff', + 'width' => 2000, + 'height' => 1200, + 'flex-height' => true, + 'wp-head-callback' => 'twentyseventeen_header_style', + ) ) ); + + register_default_headers( array( + 'default-image' => array( + 'url' => '%s/assets/images/header.jpg', + 'thumbnail_url' => '%s/assets/images/header.jpg', + 'description' => __( 'Default Header Image', 'twentyseventeen' ), + ), + ) ); +} +add_action( 'after_setup_theme', 'twentyseventeen_custom_header_setup' ); + +if ( ! function_exists( 'twentyseventeen_header_style' ) ) : +/** + * Styles the header image and text displayed on the blog. + * + * @see twentyseventeen_custom_header_setup(). + */ +function twentyseventeen_header_style() { + $header_text_color = get_header_textcolor(); + + // If no custom options for text are set, let's bail. + // get_header_textcolor() options: add_theme_support( 'custom-header' ) is default, hide text (returns 'blank') or any hex value. + if ( get_theme_support( 'custom-header', 'default-text-color' ) === $header_text_color ) { + return; + } + + // If we get this far, we have custom styles. Let's do this. + ?> + + get_setting( 'blogname' )->transport = 'postMessage'; + $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; + $wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage'; + + /** + * Custom colors. + */ + $wp_customize->add_setting( 'colorscheme', array( + 'default' => 'light', + 'transport' => 'postMessage', + 'sanitize_callback' => 'twentyseventeen_sanitize_colorscheme', + ) ); + + $wp_customize->add_setting( 'colorscheme_hue', array( + 'default' => 250, + 'transport' => 'postMessage', + 'sanitize_callback' => 'absint', // The hue is stored as a positive integer. + ) ); + + $wp_customize->add_control( 'colorscheme', array( + 'type' => 'radio', + 'label' => __( 'Color Scheme', 'twentyseventeen' ), + 'choices' => array( + 'light' => __( 'Light', 'twentyseventeen' ), + 'dark' => __( 'Dark', 'twentyseventeen' ), + 'custom' => __( 'Custom', 'twentyseventeen' ), + ), + 'section' => 'colors', + 'priority' => 5, + ) ); + + $wp_customize->add_control( 'colorscheme_hue', array( + 'type' => 'range', + 'input_attrs' => array( + 'min' => 0, + 'max' => 359, + 'step' => 1, + ), + 'section' => 'colors', + 'priority' => 6, + 'description' => 'Temporary hue slider will be replaced with a visual hue picker that is only shown when a custom scheme is selected', // temporary, intentionally untranslated. + // @todo change this to a visual hue picker control, ideally extending the color control and leveraging iris by adding a `hue` mode in core. + // See https://core.trac.wordpress.org/ticket/38263 + // @todo only show this control when the colorscheme is custom. + ) ); + + /** + * Add the Theme Options section. + */ + $wp_customize->add_panel( 'options_panel', array( + 'title' => __( 'Theme Options', 'twentyseventeen' ), + 'description' => __( 'Configure your theme settings', 'twentyseventeen' ), + ) ); + + // Page Options. + $wp_customize->add_section( 'page_options', array( + 'title' => __( 'Single Page Layout', 'twentyseventeen' ), + 'active_callback' => 'twentyseventeen_is_page', + 'panel' => 'options_panel', + ) ); + + $wp_customize->add_setting( 'page_options', array( + 'default' => 'two-column', + 'sanitize_callback' => 'twentyseventeen_sanitize_layout', + 'transport' => 'postMessage', + ) ); + + $wp_customize->add_control( 'page_options', array( + 'label' => __( 'Page Layout', 'twentyseventeen' ), + 'section' => 'page_options', + 'type' => 'radio', + 'description' => __( 'When no sidebar widgets are assigned, you can opt to display all pages with a one column or two column layout. When the two column layout is assigned, the page title is in one column and content is in the other.', 'twentyseventeen' ), + 'choices' => array( + 'one-column' => __( 'One Column', 'twentyseventeen' ), + 'two-column' => __( 'Two Column', 'twentyseventeen' ), + ), + ) ); + + // Panel 1. + $wp_customize->add_section( 'panel_1', array( + 'title' => __( 'Panel 1', 'twentyseventeen' ), + 'active_callback' => 'is_front_page', + 'panel' => 'options_panel', + 'description' => __( 'Add an image to your panel by setting a featured image in the page editor. If you don’t select a page, this panel will not be displayed.', 'twentyseventeen' ), + ) ); + + $wp_customize->add_setting( 'panel_1', array( + 'default' => false, + 'sanitize_callback' => 'absint', + ) ); + + $wp_customize->add_control( 'panel_1', array( + 'label' => __( 'Panel Content', 'twentyseventeen' ), + 'section' => 'panel_1', + 'type' => 'dropdown-pages', + ) ); + + // Panel 2. + $wp_customize->add_section( 'panel_2', array( + 'title' => __( 'Panel 2', 'twentyseventeen' ), + 'active_callback' => 'is_front_page', + 'panel' => 'options_panel', + 'description' => __( 'Add an image to your panel by setting a featured image in the page editor. If you don’t select a page, this panel will not be displayed.', 'twentyseventeen' ), + ) ); + + $wp_customize->add_setting( 'panel_2', array( + 'default' => false, + 'sanitize_callback' => 'absint', + ) ); + + $wp_customize->add_control( 'panel_2', array( + 'label' => __( 'Panel Content', 'twentyseventeen' ), + 'section' => 'panel_2', + 'type' => 'dropdown-pages', + ) ); + + // Panel 3. + $wp_customize->add_section( 'panel_3', array( + 'title' => __( 'Panel 3', 'twentyseventeen' ), + 'active_callback' => 'is_front_page', + 'panel' => 'options_panel', + 'description' => __( 'Add an image to your panel by setting a featured image in the page editor. If you don’t select a page, this panel will not be displayed.', 'twentyseventeen' ), + ) ); + + $wp_customize->add_setting( 'panel_3', array( + 'default' => false, + 'sanitize_callback' => 'absint', + ) ); + + $wp_customize->add_control( 'panel_3', array( + 'label' => __( 'Panel Content', 'twentyseventeen' ), + 'section' => 'panel_3', + 'type' => 'dropdown-pages', + ) ); + + // Panel 4. + $wp_customize->add_section( 'panel_4', array( + 'title' => __( 'Panel 4', 'twentyseventeen' ), + 'active_callback' => 'is_front_page', + 'panel' => 'options_panel', + 'description' => __( 'Add an image to your panel by setting a featured image in the page editor. If you don’t select a page, this panel will not be displayed.', 'twentyseventeen' ), + ) ); + + $wp_customize->add_setting( 'panel_4', array( + 'default' => false, + 'sanitize_callback' => 'absint', + ) ); + + $wp_customize->add_control( 'panel_4', array( + 'label' => __( 'Panel Content', 'twentyseventeen' ), + 'section' => 'panel_4', + 'type' => 'dropdown-pages', + ) ); +} +add_action( 'customize_register', 'twentyseventeen_customize_register' ); + +/** + * Sanitize a radio button. + */ +function twentyseventeen_sanitize_layout( $input ) { + $valid = array( + 'one-column' => __( 'One Column', 'twentyseventeen' ), + 'two-column' => __( 'Two Column', 'twentyseventeen' ), + ); + + if ( array_key_exists( $input, $valid ) ) { + return $input; + } + + return ''; +} + +/** + * Sanitize the colorscheme. + */ +function twentyseventeen_sanitize_colorscheme( $input ) { + $valid = array( 'light', 'dark', 'custom' ); + + if ( in_array( $input, $valid ) ) { + return $input; + } + + return 'light'; +} + +/** + * Binds JS handlers to make Theme Customizer preview reload changes asynchronously. + */ +function twentyseventeen_customize_preview_js() { + wp_enqueue_script( 'twentyseventeen-customizer', get_theme_file_uri( '/assets/js/customizer.js' ), array( 'customize-preview' ), '1.0', true ); +} +add_action( 'customize_preview_init', 'twentyseventeen_customize_preview_js' ); + +/** + * Some extra JavaScript to improve the user experience in the Customizer for this theme. + */ +function twentyseventeen_panels_js() { + wp_enqueue_script( 'twentyseventeen-panel-customizer', get_theme_file_uri( '/assets/js/panel-customizer.js' ), array(), '1.0', true ); +} +add_action( 'customize_controls_enqueue_scripts', 'twentyseventeen_panels_js' ); diff --git a/src/wp-content/themes/twentyseventeen/inc/icon-functions.php b/src/wp-content/themes/twentyseventeen/inc/icon-functions.php new file mode 100644 index 0000000000..13034b3c5d --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/inc/icon-functions.php @@ -0,0 +1,199 @@ + '', + 'title' => '', + 'desc' => '', + 'aria_hidden' => true, // Hide from screen readers. + 'fallback' => false, + ); + + // Parse args. + $args = wp_parse_args( $args, $defaults ); + + // Set aria hidden. + $aria_hidden = ''; + + if ( true === $args['aria_hidden'] ) { + $aria_hidden = ' aria-hidden="true"'; + } + + // Set ARIA. + $aria_labelledby = ''; + + if ( $args['title'] && $args['desc'] ) { + $aria_labelledby = ' aria-labelledby="title desc"'; + } + + // Begin SVG markup. + $svg = ''; + + // If there is a title, display it. + if ( $args['title'] ) { + $svg .= '' . esc_html( $args['title'] ) . ''; + } + + // If there is a description, display it. + if ( $args['desc'] ) { + $svg .= '' . esc_html( $args['desc'] ) . ''; + } + + // Use absolute path in the Customizer so that icons show up in there. + if ( is_customize_preview() ) { + $svg .= ''; + } else { + $svg .= ''; + } + + // Add some markup to use as a fallback for browsers that do not support SVGs. + if ( $args['fallback'] ) { + $svg .= ''; + } + + $svg .= ''; + + return $svg; +} + +/** + * Display SVG icons in social links menu. + * + * @param string $item_output The menu item output. + * @param WP_Post $item Menu item object. + * @param int $depth Depth of the menu. + * @param array $args wp_nav_menu() arguments. + * @return string $item_output The menu item output with social icon. + */ +function twentyseventeen_nav_menu_social_icons( $item_output, $item, $depth, $args ) { + // Get supported social icons. + $social_icons = twentyseventeen_social_links_icons(); + + // Change SVG icon inside social links menu if there is supported URL. + if ( 'social' === $args->theme_location ) { + foreach ( $social_icons as $attr => $value ) { + if ( false !== strpos( $item_output, $attr ) ) { + $item_output = str_replace( $args->link_after, '' . twentyseventeen_get_svg( array( 'icon' => esc_attr( $value ) ) ), $item_output ); + } + } + } + + return $item_output; +} +add_filter( 'walker_nav_menu_start_el', 'twentyseventeen_nav_menu_social_icons', 10, 4 ); + +/** + * Add dropdown icon if menu item has children. + * + * @param string $title The menu item's title. + * @param object $item The current menu item. + * @param array $args An array of wp_nav_menu() arguments. + * @param int $depth Depth of menu item. Used for padding. + * @return string $title The menu item's title with dropdown icon. + */ +function twentyseventeen_dropdown_icon_to_menu_link( $title, $item, $args, $depth ) { + if ( 'top' === $args->theme_location ) { + foreach ( $item->classes as $value ) { + if ( 'menu-item-has-children' === $value || 'page_item_has_children' === $value ) { + $title = $title . twentyseventeen_get_svg( array( 'icon' => 'expand' ) ); + } + } + } + + return $title; +} +add_filter( 'nav_menu_item_title', 'twentyseventeen_dropdown_icon_to_menu_link', 10, 4 ); + +/** + * Returns an array of supported social links (URL and icon name). + * + * @return array $social_links_icons + */ +function twentyseventeen_social_links_icons() { + // Supported social links icons. + $social_links_icons = array( + 'behance.net' => 'behance', + 'codepen.io' => 'codepen', + 'deviantart.com' => 'deviantart', + 'digg.com' => 'digg', + 'dribbble.com' => 'dribbble', + 'dropbox.com' => 'dropbox', + 'facebook.com' => 'facebook', + 'flickr.com' => 'flickr', + 'foursquare.com' => 'foursquare', + 'plus.google.com' => 'google-plus', + 'github.com' => 'github', + 'instagram.com' => 'instagram', + 'linkedin.com' => 'linkedin', + 'mailto:' => 'envelope-o', + 'medium.com' => 'medium', + 'path.com' => 'path', + 'pinterest.com' => 'pinterest-p', + 'getpocket.com' => 'get-pocket', + 'polldaddy.com' => 'polldaddy', + 'reddit.com' => 'reddit-alien', + 'skype.com' => 'skype', + 'skype:' => 'skype', + 'slideshare.net' => 'slideshare', + 'snapchat.com' => 'snapchat-ghost', + 'soundcloud.com' => 'soundcloud', + 'spotify.com' => 'spotify', + 'stumbleupon.com' => 'stumbleupon', + 'tumblr.com' => 'tumblr', + 'twitch.tv' => 'twitch', + 'twitter.com' => 'twitter', + 'vimeo.com' => 'vimeo', + 'vine.co' => 'vine', + 'vk.com' => 'vk', + 'wordpress.org' => 'wordpress', + 'wordpress.com' => 'wordpress', + 'yelp.com' => 'yelp', + 'youtube.com' => 'youtube', + ); + + return apply_filters( 'twentyseventeen_social_links_icons', $social_links_icons ); +} diff --git a/src/wp-content/themes/twentyseventeen/inc/template-functions.php b/src/wp-content/themes/twentyseventeen/inc/template-functions.php new file mode 100644 index 0000000000..8e6da7992a --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/inc/template-functions.php @@ -0,0 +1,99 @@ +' . get_the_author() . '' + ); + + // Finally, let's write all of this to the page. + echo '' . twentyseventeen_time_link() . ' ' . $byline . ''; // WPCS: XSS OK. +} +endif; + + +if ( ! function_exists( 'twentyseventeen_time_link' ) ) : +/** + * Gets a nicely formatted string for the published date. + */ +function twentyseventeen_time_link() { + $time_string = ''; + if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) { + $time_string = ''; + } + + $time_string = sprintf( $time_string, + get_the_date( DATE_W3C ), + get_the_date(), + get_the_modified_date( DATE_W3C ), + get_the_modified_date() + ); + + // Wrap the time string in a link, and preface it with 'Posted on'. + return '' . _x( 'Posted on', 'post date', 'twentyseventeen' ) . ' ' . $time_string . ''; +} +endif; + + +if ( ! function_exists( 'twentyseventeen_entry_footer' ) ) : +/** + * Prints HTML with meta information for the categories, tags and comments. + */ +function twentyseventeen_entry_footer() { + + /* translators: used between list items, there is a space after the comma */ + $separate_meta = __( ', ', 'twentyseventeen' ); + + // Get Categories for posts. + $categories_list = get_the_category_list( $separate_meta ); + + // Get Tags for posts. + $tags_list = get_the_tag_list( '', $separate_meta ); + + // We don't want to output .entry-footer if it will be empty, so make sure its not. + if ( ( ( twentyseventeen_categorized_blog() && $categories_list ) || $tags_list ) || get_edit_post_link() ) { + + echo '
'; + + if ( 'post' === get_post_type() ) { + if ( ( $categories_list && twentyseventeen_categorized_blog() ) || $tags_list ) { + echo ''; + + // Make sure there's more than one category before displaying. + if ( $categories_list && twentyseventeen_categorized_blog() ) { + echo '' . twentyseventeen_get_svg( array( 'icon' => 'folder-open' ) ) . '' . __( 'Categories', 'twentyseventeen' ) . '' . $categories_list . ''; // WPCS: XSS OK. + } + + if ( $tags_list ) { + echo '' . twentyseventeen_get_svg( array( 'icon' => 'hashtag' ) ) . '' . __( 'Tags', 'twentyseventeen' ) . '' . $tags_list . ''; // WPCS: XSS OK. + } + + echo ''; + } + } + + twentyseventeen_edit_link(); + + echo '
'; + } +} +endif; + + +if ( ! function_exists( 'twentyseventeen_edit_link' ) ) : +/** + * Returns an accessibility-friendly link to edit a post or page. + * + * This also gives us a little context about what exactly we're editing + * (post or page?) so that users understand a bit more where they are in terms + * of the template hierarchy and their content. Helpful when/if the single-page + * layout with multiple posts/pages shown gets confusing. + */ +function twentyseventeen_edit_link() { + + $link = edit_post_link( + sprintf( + /* translators: %s: Name of current post */ + __( 'Edit "%s"', 'twentyseventeen' ), + get_the_title() + ), + '', + '' + ); + + return $link; +} +endif; + + +/** + * Returns true if a blog has more than 1 category. + * + * @return bool + */ +function twentyseventeen_categorized_blog() { + $category_count = get_transient( 'twentyseventeen_categories' ); + + if ( false === $category_count ) { + // Create an array of all the categories that are attached to posts. + $categories = get_categories( array( + 'fields' => 'ids', + 'hide_empty' => 1, + // We only need to know if there is more than one category. + 'number' => 2, + ) ); + + // Count the number of categories that are attached to the posts. + $category_count = count( $categories ); + + set_transient( 'twentyseventeen_categories', $category_count ); + } + + return $category_count > 1; +} + + +/** + * Flush out the transients used in twentyseventeen_categorized_blog. + */ +function twentyseventeen_category_transient_flusher() { + if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) { + return; + } + // Like, beat it. Dig? + delete_transient( 'twentyseventeen_categories' ); +} +add_action( 'edit_category', 'twentyseventeen_category_transient_flusher' ); +add_action( 'save_post', 'twentyseventeen_category_transient_flusher' ); diff --git a/src/wp-content/themes/twentyseventeen/index.php b/src/wp-content/themes/twentyseventeen/index.php new file mode 100644 index 0000000000..144ef9a4b9 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/index.php @@ -0,0 +1,67 @@ + + +
+ +
+

+
+ +
+

+
+ + +
+
+ + twentyseventeen_get_svg( array( 'icon' => 'previous' ) ) . '' . __( 'Previous page', 'twentyseventeen' ) . '', + 'next_text' => '' . __( 'Next page', 'twentyseventeen' ) . '' . twentyseventeen_get_svg( array( 'icon' => 'next' ) ), + 'before_page_number' => '' . __( 'Page', 'twentyseventeen' ) . ' ', + ) ); + + else : + + get_template_part( 'components/post/content', 'none' ); + + endif; + ?> + +
+
+ +
+ + + +
+
+
+ + + +
+
+
+ + ul, +li > ol { + margin-left: 0; + margin-right: 1.5em; +} + +/* Forms */ + +input[type="radio"], +input[type="checkbox"] { + margin-left: 0.5em; + margin-right: 0; +} + +/* Media */ + +.mejs-offscreen { + right: -10000px; +} + +/* Site Branding */ + +.custom-logo-link { + padding-left: 1em; + padding-right: 0; +} + +/* Main Navigation */ + +.main-navigation ul { + text-align: right; +} + +.main-navigation ul ul { + padding-left: 0; + padding-right: 1.5em; +} + +.menu-toggle .icon { + margin-left: 0.5em; + margin-right: 0; +} + +.dropdown-toggle { + left: -0.5em; + right: auto; +} + +/* Front Page */ + +.twentyseventeen-panel .recent-posts .entry-header .edit-link { + margin-left: 0; + margin-right: 1em; +} + + +/* Blog, Archive, Search */ + +.blog .entry-meta a.post-edit-link, +.archive .entry-meta a.post-edit-link, +.search .entry-meta a.post-edit-link { + margin-left: 0; + margin-right: 1em; +} + +.search .page .entry-meta a.post-edit-link { + margin-right: 0; +} + +.sticky .icon-pinned { + left: auto; + right: -1em; +} + +.prev.page-numbers .icon, +.next.page-numbers .icon { + display: inline-block; + -ms-transform: rotate(180deg); /* IE 9 */ + -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ + transform: rotate(180deg); +} + +.prev.page-numbers { + float: right; +} + +.next.page-numbers { + float: left; +} + +/* Blog Entries */ + +.entry-footer .cat-links, +.entry-footer .tags-links { + padding-left: 0; + padding-right: 2.5em; +} + +.entry-footer .cat-links .icon, +.entry-footer .tags-links .icon { + left: auto; + margin-left: 0.5em; + margin-right: 0; + right: 0; +} + +/* Comments */ + +.comment-body { + margin-left: 0; + margin-right: 65px; +} + +.comment-reply-link .icon { + left: auto; + right: -2em; + -webkit-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + transform: scale(-1, 1); +} + +.comment-author .avatar { + left: auto; + right: -65px; +} + +.comment-reply-link:before { + left: auto; + right: -2em; +} + +.children .comment-author .avatar { + left: auto; + right: -45px; +} + +.bypostauthor > .comment-body > .comment-meta > .comment-author:before { + left: auto; + right: -65px; + margin: -6px -6px 0 0; +} + +.children .bypostauthor > .comment-body > .comment-meta > .comment-author:before { + left: auto; + right: -45px; +} + +.form-submit { + text-align: left; +} + +/* Post Formats */ + +.format-quote blockquote .icon { + left: auto; + right: -1.25em; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +/* Post Navigation */ + +.nav-links .nav-previous .nav-title .nav-title-icon-wrapper, +.nav-links .nav-next .nav-title .nav-title-icon-wrapper { + display: inline-block; + -ms-transform: rotate(180deg); /* IE 9 */ + -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ + transform: rotate(180deg); +} + +/* Widgets */ + +.widget ul { + margin: 0; +} + +.search-form .search-submit { + left: 3px; + right: auto; +} + +.widget .tagcloud a, +.widget.widget_tag_cloud a, +.wp_widget_tag_cloud a { + float: right; + margin: 4px 0 0 4px !important; /* !important to override inline styles */ +} + +.widget ul li li { + padding-left: 0; + padding-right: 1.5rem; +} + +/* Footer */ + +.social-navigation a { + margin-left: 1em; + margin-right: 0; +} + +/* Customizer styles */ + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel .twentyseventeen-panel-title { + left: 3.2em; + right: auto; +} + +/* Gallery Styles */ + +.gallery-item, +.gallery-caption { + text-align: right; +} + +/* Media queries */ + +@media screen and (min-width: 48em) { + + body.page-template-full-width-page #primary { + float: none; + } + + .has-sidebar:not(.error404) #primary { + float: right; + } + + .has-sidebar #secondary { + float: left; + } + + .error404 #primary { + float: none; + } + + /* Site Branding */ + + .custom-logo-link { + padding-left: 2em; + padding-right: 0; + } + + /* Navigation */ + + .main-navigation ul ul { + padding-right: 0; + } + + .main-navigation ul ul:before, + .main-navigation ul ul:after { + left: 0.5em; + right: auto; + } + + .main-navigation ul ul, + .main-navigation ul ul ul { + left: auto; + right: -999em; + } + + .main-navigation ul ul li:hover > ul, + .main-navigation ul ul li.focus > ul { + left: auto; + right: 100%; + } + + .main-navigation ul li:hover > ul, + .main-navigation ul li.focus > ul { + left: auto; + right: 0.5em; + } + + .main-navigation ul li.menu-item-has-children:before, + .main-navigation ul li.menu-item-has-children:after, + .main-navigation ul li.page_item_has_children:before, + .main-navigation ul li.page_item_has_children:after { + left: 1em; + right: auto; + } + + .main-navigation .menu-item-has-children > a > .icon, + .main-navigation .page_item_has_children > a > .icon { + left: auto; + right: 5px; + } + + .main-navigation ul ul .menu-item-has-children > a > .icon, + .main-navigation ul ul .page_item_has_children > a > .icon { + left: 1em; + right: auto; + -webkit-transform: rotate(90deg); + -ms-transform: rotate(90deg); + transform: rotate(90deg); + } + + /* Scroll down arrow */ + + .navigation-top .menu-scroll-down { + left: 0; + right: auto; + } + + .entry-title a { + margin-left: auto; + margin-right: -2px; + } + + /* Front Page */ + + .page-two-column .panel-content .entry-header { + float: right; + } + + .page-two-column .panel-content .entry-content { + float: left; + } + + /* Front Page - Recent Posts */ + + .page-two-column .panel-content .recent-posts { + clear: left; + float: left; + } + + /* Blog, Archive, Search */ + + .sticky .icon-pinned { + left: auto; + right: -2.5em; + } + + body:not(.has-sidebar) .page-header, + body.has-sidebar.error404 #primary .page-header, + body.page-two-column #primary .entry-header { + float: right; + } + + .blog:not(.has-sidebar) #primary article, + .archive:not(.has-sidebar) #primary article, + .search:not(.has-sidebar) #primary article, + .has-sidebar.error404 #primary .page-content, + .error404.has-sidebar #primary .page-content, + body.page-two-column #primary .entry-content { + float: left; + } + + .entry-footer .edit-link a.post-edit-link { + margin-left: 0; + margin-right: 1em; + } + + /* Entry content */ + + /* with sidebar */ + + .has-sidebar .entry-content blockquote.alignleft { + margin-left: 0; + width: 34%; + } + + .has-sidebar #primary .entry-content blockquote.alignright, + .has-sidebar #primary .entry-content blockquote.alignright.below-entry-meta { + margin-right: 0; + width: 34%; + } + + .has-sidebar #primary .entry-content blockquote.alignleft.below-entry-meta { + margin-left: -72.5%; + width: 62%; + } + + /* blog index and archive */ + + .blog:not(.has-sidebar) .entry-content blockquote.alignleft, + .twentyseventeen-front-page.page-two-column .entry-content blockquote.alignleft, + .archive:not(.has-sidebar) .entry-content blockquote.alignleft, + .page-two-column .entry-content blockquote.alignleft { + margin-left: 0; + width: 34%; + } + + .blog:not(.has-sidebar) .entry-content blockquote.alignright, + .twentyseventeen-front-page.page-two-column #primary .entry-content blockquote.alignright, + .archive:not(.has-sidebar) .entry-content blockquote.alignright, + .page-two-column #primary .entry-content blockquote.alignright { + margin-right: -72.5%; + width: 62%; + } + + /* Post formats */ + + .format-quote blockquote .icon { + left: auto; + right: -1.5em; + } + + .navigation.pagination { + float: left; + } + + .has-sidebar .navigation.pagination { + float: none; + } + + .post-navigation .nav-previous { + float: right; + } + + .post-navigation .nav-next { + float: left; + text-align: left; + } + + /* Comments */ + + ol.children .children { + padding-left: 0; + padding-right: 2em; + } + + /* Post Navigation */ + + .nav-links .nav-previous .nav-title .nav-title-icon-wrapper { + left: auto; + right: -2em; + } + + .nav-links .nav-next .nav-title .nav-title-icon-wrapper { + left: -2em; + right: auto; + } + + /* Footer */ + + .site-footer .widget-column.footer-widget-1 { + float: right; + } + + .site-footer .widget-column.footer-widget-2 { + float: left; + } + + .social-navigation { + clear: right; + float: right; + } + + .site-info { + float: right; + } + + .social-navigation + .site-info { + margin-left: 0; + margin-right: 6%; + } +} + +@media screen and ( min-width: 67em ) { + + /* Sticky posts */ + + .sticky .icon-pinned { + left: auto; + right: -1.25em; + } +} + +@media screen and ( min-width: 79em ) { + + .has-sidebar #primary .entry-content blockquote.alignright, + .has-sidebar #primary .entry-content blockquote.alignright.below-entry-meta { + margin-right: -20%; + } + + .blog:not(.has-sidebar) .entry-content blockquote.alignleft, + .archive:not(.has-sidebar) .entry-content blockquote.alignleft, + .page-two-column .entry-content blockquote.alignleft, + .twentyseventeen-front-page .entry-content blockquote.alignleft { + margin-left: -20%; + } +} diff --git a/src/wp-content/themes/twentyseventeen/screenshot.png b/src/wp-content/themes/twentyseventeen/screenshot.png new file mode 100644 index 0000000000..088b7413e7 Binary files /dev/null and b/src/wp-content/themes/twentyseventeen/screenshot.png differ diff --git a/src/wp-content/themes/twentyseventeen/search.php b/src/wp-content/themes/twentyseventeen/search.php new file mode 100644 index 0000000000..6a221817f7 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/search.php @@ -0,0 +1,62 @@ + + +
+ +
+ +

' . get_search_query() . '' ); ?>

+ +

+ +
+ +
+
+ + twentyseventeen_get_svg( array( 'icon' => 'previous' ) ) . '' . __( 'Previous page', 'twentyseventeen' ) . '', + 'next_text' => '' . __( 'Next page', 'twentyseventeen' ) . '' . twentyseventeen_get_svg( array( 'icon' => 'next' ) ), + 'before_page_number' => '' . __( 'Page', 'twentyseventeen' ) . ' ', + ) ); + + else : ?> + +

+ + +
+
+ +
+ + + + + + diff --git a/src/wp-content/themes/twentyseventeen/sidebar.php b/src/wp-content/themes/twentyseventeen/sidebar.php new file mode 100644 index 0000000000..ae1761af26 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/sidebar.php @@ -0,0 +1,20 @@ + + + diff --git a/src/wp-content/themes/twentyseventeen/single.php b/src/wp-content/themes/twentyseventeen/single.php new file mode 100644 index 0000000000..f1b3721a47 --- /dev/null +++ b/src/wp-content/themes/twentyseventeen/single.php @@ -0,0 +1,43 @@ + + +
+
+
+ + '' . __( 'Previous Post', 'twentyseventeen' ) . ' ' . twentyseventeen_get_svg( array( 'icon' => 'previous' ) ) . '%title', + 'next_text' => '' . __( 'Next Post', 'twentyseventeen' ) . ' %title' . twentyseventeen_get_svg( array( 'icon' => 'next' ) ) . '', + ) ); + + endwhile; // End of the loop. + ?> + +
+
+ +
+ +>> TABLE OF CONTENTS: +---------------------------------------------------------------- +# Normalize +# Accessibility +# Alignments +# Clearings +# Typography +# Forms +# Formatting +# Lists +# Tables +# Links +# Featured Image Hover +# Navigation +# Layout + ## Header + ## Front Page + ## Regular Content + ## Posts + ## Pages + ## Footer +# Comments +# Widgets +# Media + ## Galleries +# Customizer +# Media Queries +--------------------------------------------------------------*/ + +/*-------------------------------------------------------------- +# Normalize +Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css +--------------------------------------------------------------*/ + +html { + font-family: sans-serif; + line-height: 1.15; + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100%; +} + +body { + margin: 0; +} + +article, +aside, +footer, +header, +nav, +section { + display: block; +} + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +figcaption, +figure, +main { + display: block; +} + +figure { + margin: 1em 0; +} + +hr { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; + overflow: visible; +} + +pre { + font-family: monospace, monospace; + font-size: 1em; +} + +a { + background-color: transparent; + -webkit-text-decoration-skip: objects; +} + +a:active, +a:hover { + outline-width: 0; +} + +abbr[title] { + border-bottom: 1px #767676 dotted; + text-decoration: none; +} + +b, +strong { + font-weight: inherit; +} + +b, +strong { + font-weight: bolder; +} + +code, +kbd, +samp { + font-family: monospace, monospace; + font-size: 1em; +} + +dfn { + font-style: italic; +} + +mark { + background-color: #eee; + color: #222; +} + +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; +} + +audio, +video { + display: inline-block; +} + +audio:not([controls]) { + display: none; + height: 0; +} + +img { + border-style: none; +} + +svg:not(:root) { + overflow: hidden; +} + +button, +input, +optgroup, +select, +textarea { + font-family: sans-serif; + font-size: 100%; + line-height: 1.15; + margin: 0; +} + +button, +input { + overflow: visible; +} + +button, +select { + text-transform: none; +} + +button, +html [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 { + border: 1px solid #bbb; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +legend { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + color: inherit; + display: table; + max-width: 100%; + padding: 0; + white-space: normal; +} + +progress { + display: inline-block; + vertical-align: baseline; +} + +textarea { + overflow: auto; +} + +[type="checkbox"], +[type="radio"] { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + 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-cancel-button, +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +} + +details, +menu { + display: block; +} + +summary { + display: list-item; +} + +canvas { + display: inline-block; +} + +template { + display: none; +} + +[hidden] { + display: none; +} + +/*-------------------------------------------------------------- +# Accessibility +--------------------------------------------------------------*/ + +/* Text meant only for screen readers. */ + +.screen-reader-text { + clip: rect(1px, 1px, 1px, 1px); + height: 1px; + overflow: hidden; + position: absolute !important; + width: 1px; +} + +.screen-reader-text:focus { + background-color: #f1f1f1; + -webkit-border-radius: 3px; + border-radius: 3px; + -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); + box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); + clip: auto !important; + color: #21759b; + display: block; + font-size: 14px; + font-size: 0.875rem; + font-weight: 700; + height: auto; + left: 5px; + line-height: normal; + padding: 15px 23px 14px; + text-decoration: none; + top: 5px; + width: auto; + z-index: 100000; /* Above WP toolbar. */ +} + +/* Do not show the outline on the skip link target. */ + +#content[tabindex="-1"]:focus { + outline: 0; +} + +/*-------------------------------------------------------------- +# Alignments +--------------------------------------------------------------*/ + +.alignleft { + display: inline; + float: left; + margin-right: 1.5em; +} + +.alignright { + display: inline; + float: right; + margin-left: 1.5em; +} + +.aligncenter { + clear: both; + display: block; + margin-left: auto; + margin-right: auto; +} + +/*-------------------------------------------------------------- +# Clearings +--------------------------------------------------------------*/ + +.clear:before, +.clear:after, +.entry-content:before, +.entry-content:after, +.entry-footer:before, +.entry-footer:after, +.comment-content:before, +.comment-content:after, +.site-header:before, +.site-header:after, +.site-content:before, +.site-content:after, +.site-footer:before, +.site-footer:after, +.nav-links:before, +.nav-links:after, +.pagination:before, +.pagination:after, +.comment-author:before, +.comment-author:after, +.widget-area:before, +.widget-area:after, +.widget:before, +.widget:after, +.comment-meta:before, +.comment-meta:after { + content: ""; + display: table; + table-layout: fixed; +} + +.clear:after, +.entry-content:after, +.entry-footer:after, +.comment-content:after, +.site-header:after, +.site-content:after, +.site-footer:after, +.nav-links:after, +.pagination:after, +.comment-author:after, +.widget-area:after, +.widget:after, +.comment-meta:after { + clear: both; +} + +/*-------------------------------------------------------------- +# Typography +--------------------------------------------------------------*/ + +body, +button, +input, +select, +textarea { + color: #333; + font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif; + font-size: 15px; + font-size: 0.9375rem; + font-weight: 400; + line-height: 1.66; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + clear: both; + line-height: 1.4; + margin: 0 0 0.75em; + padding: 1.5em 0 0; +} + +h1:first-child, +h2:first-child, +h3:first-child, +h4:first-child, +h5:first-child, +h6:first-child { + padding-top: 0; +} + +h1 { + font-size: 24px; + font-size: 1.5rem; + font-weight: 300; +} + +h2 { + color: #666; + font-size: 20px; + font-size: 1.25rem; + font-weight: 300; +} + +h3 { + color: #333; + font-size: 18px; + font-size: 1.125rem; + font-weight: 300; +} + +h4 { + color: #333; + font-size: 16px; + font-size: 1rem; + font-weight: 800; +} + +h5 { + color: #767676; + font-size: 13px; + font-size: 0.8125rem; + font-weight: 800; + letter-spacing: 0.15em; + text-transform: uppercase; +} + +h6 { + color: #333; + font-size: 15px; + font-size: 0.9375rem; + font-weight: 800; +} + +p { + margin: 0 0 1.5em; + padding: 0; +} + +dfn, +cite, +em, +i { + font-style: italic; +} + +blockquote { + color: #666; + font-size: 18px; + font-size: 1.125rem; + font-style: italic; + line-height: 1.7; + margin: 0; + overflow: hidden; + padding: 0; +} + +blockquote cite { + display: block; + font-style: normal; + font-weight: 600; + margin-top: 0.5em; +} + +address { + margin: 0 0 1.5em; +} + +pre { + background: #eee; + font-family: "Courier 10 Pitch", Courier, monospace; + font-size: 15px; + font-size: 0.9375rem; + line-height: 1.6; + margin-bottom: 1.6em; + max-width: 100%; + overflow: auto; + padding: 1.6em; +} + +code, +kbd, +tt, +var { + font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; + font-size: 15px; + font-size: 0.9375rem; +} + +abbr, +acronym { + border-bottom: 1px dotted #666; + cursor: help; +} + +mark, +ins { + background: #eee; + text-decoration: none; +} + +big { + font-size: 125%; +} + +blockquote { + quotes: "" ""; +} + +q { + quotes: "“" "”" "‘" "’"; +} + +blockquote:before, +blockquote:after { + content: ""; +} + +:focus { + outline: none; +} + +/* Typography for Arabic Font */ + +html[lang="ar"] body, +html[lang="ar"] button, +html[lang="ar"] input, +html[lang="ar"] select, +html[lang="ar"] textarea, +html[lang="ary"] body, +html[lang="ary"] button, +html[lang="ary"] input, +html[lang="ary"] select, +html[lang="ary"] textarea, +html[lang="azb"] body, +html[lang="azb"] button, +html[lang="azb"] input, +html[lang="azb"] select, +html[lang="azb"] textarea, +html[lang="fa-IR"] body, +html[lang="fa-IR"] button, +html[lang="fa-IR"] input, +html[lang="fa-IR"] select, +html[lang="fa-IR"] textarea, +html[lang="haz"] body, +html[lang="haz"] button, +html[lang="haz"] input, +html[lang="haz"] select, +html[lang="haz"] textarea, +html[lang="ps"] body, +html[lang="ps"] button, +html[lang="ps"] input, +html[lang="ps"] select, +html[lang="ps"] textarea, +html[lang="ur"] body, +html[lang="ur"] button, +html[lang="ur"] input, +html[lang="ur"] select, +html[lang="ur"] textarea { + font-family: Tahoma, Arial, sans-serif; +} + +html[lang="ar"] h1, +html[lang="ar"] h2, +html[lang="ar"] h3, +html[lang="ar"] h4, +html[lang="ar"] h5, +html[lang="ar"] h6, +html[lang="ary"] h1, +html[lang="ary"] h2, +html[lang="ary"] h3, +html[lang="ary"] h4, +html[lang="ary"] h5, +html[lang="ary"] h6, +html[lang="azb"] h1, +html[lang="azb"] h2, +html[lang="azb"] h3, +html[lang="azb"] h4, +html[lang="azb"] h5, +html[lang="azb"] h6, +html[lang="fa-IR"] h1, +html[lang="fa-IR"] h2, +html[lang="fa-IR"] h3, +html[lang="fa-IR"] h4, +html[lang="fa-IR"] h5, +html[lang="fa-IR"] h6, +html[lang="haz"] h1, +html[lang="haz"] h2, +html[lang="haz"] h3, +html[lang="haz"] h4, +html[lang="haz"] h5, +html[lang="haz"] h6, +html[lang="ps"] h1, +html[lang="ps"] h2, +html[lang="ps"] h3, +html[lang="ps"] h4, +html[lang="ps"] h5, +html[lang="ps"] h6, +html[lang="ur"] h1, +html[lang="ur"] h2, +html[lang="ur"] h3, +html[lang="ur"] h4, +html[lang="ur"] h5, +html[lang="ur"] h6 { + font-weight: 700; +} + +/* Typography for Chinese Font */ + +html[lang^="zh-"] body, +html[lang^="zh-"] button, +html[lang^="zh-"] input, +html[lang^="zh-"] select, +html[lang^="zh-"] textarea { + font-family: "PingFang TC", "Helvetica Neue", Helvetica, STHeitiTC-Light, Arial, sans-serif; +} + +html[lang^="zh-"] h1, +html[lang^="zh-"] h2, +html[lang^="zh-"] h3, +html[lang^="zh-"] h4, +html[lang^="zh-"] h5, +html[lang^="zh-"] h6 { + font-weight: 700; +} + +/* Typography for Cyrillic Font */ + +html[lang="bg-BG"] body, +html[lang="bg-BG"] button, +html[lang="bg-BG"] input, +html[lang="bg-BG"] select, +html[lang="bg-BG"] textarea, +html[lang="ru-RU"] body, +html[lang="ru-RU"] button, +html[lang="ru-RU"] input, +html[lang="ru-RU"] select, +html[lang="ru-RU"] textarea, +html[lang="uk"] body, +html[lang="uk"] button, +html[lang="uk"] input, +html[lang="uk"] select, +html[lang="uk"] textarea { + font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif; +} + +html[lang="bg-BG"] h1, +html[lang="bg-BG"] h2, +html[lang="bg-BG"] h3, +html[lang="bg-BG"] h4, +html[lang="bg-BG"] h5, +html[lang="bg-BG"] h6, +html[lang="ru-RU"] h1, +html[lang="ru-RU"] h2, +html[lang="ru-RU"] h3, +html[lang="ru-RU"] h4, +html[lang="ru-RU"] h5, +html[lang="ru-RU"] h6, +html[lang="uk"] h1, +html[lang="uk"] h2, +html[lang="uk"] h3, +html[lang="uk"] h4, +html[lang="uk"] h5, +html[lang="uk"] h6 { + font-weight: 700; + line-height: 1.2; +} + +/* Typography for Devanagari Font */ + +html[lang="bn-BD"] body, +html[lang="bn-BD"] button, +html[lang="bn-BD"] input, +html[lang="bn-BD"] select, +html[lang="bn-BD"] textarea, +html[lang="hi-IN"] body, +html[lang="hi-IN"] button, +html[lang="hi-IN"] input, +html[lang="hi-IN"] select, +html[lang="hi-IN"] textarea, +html[lang="mr-IN"] body, +html[lang="mr-IN"] button, +html[lang="mr-IN"] input, +html[lang="mr-IN"] select, +html[lang="mr-IN"] textarea { + font-family: Arial, sans-serif; +} + +html[lang="bn-BD"] h1, +html[lang="bn-BD"] h2, +html[lang="bn-BD"] h3, +html[lang="bn-BD"] h4, +html[lang="bn-BD"] h5, +html[lang="bn-BD"] h6, +html[lang="hi-IN"] h1, +html[lang="hi-IN"] h2, +html[lang="hi-IN"] h3, +html[lang="hi-IN"] h4, +html[lang="hi-IN"] h5, +html[lang="hi-IN"] h6, +html[lang="mr-IN"] h1, +html[lang="mr-IN"] h2, +html[lang="mr-IN"] h3, +html[lang="mr-IN"] h4, +html[lang="mr-IN"] h5, +html[lang="mr-IN"] h6 { + font-weight: 700; +} + +/* Typography for Greek Font */ + +html[lang="el"] body, +html[lang="el"] button, +html[lang="el"] input, +html[lang="el"] select, +html[lang="el"] textarea { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; +} + +html[lang="el"] h1, +html[lang="el"] h2, +html[lang="el"] h3, +html[lang="el"] h4, +html[lang="el"] h5, +html[lang="el"] h6 { + font-weight: 700; + line-height: 1.3; +} + +/* Typography for Gujarati Font */ + +html[lang="gu-IN"] body, +html[lang="gu-IN"] button, +html[lang="gu-IN"] input, +html[lang="gu-IN"] select, +html[lang="gu-IN"] textarea { + font-family: Arial, sans-serif; +} + +html[lang="gu-IN"] h1, +html[lang="gu-IN"] h2, +html[lang="gu-IN"] h3, +html[lang="gu-IN"] h4, +html[lang="gu-IN"] h5, +html[lang="gu-IN"] h6 { + font-weight: 700; +} + +/* Typography for Hebrew Font */ + +html[lang="he-IL"] body, +html[lang="he-IL"] button, +html[lang="he-IL"] input, +html[lang="he-IL"] select, +html[lang="he-IL"] textarea { + font-family: "Arial Hebrew", Arial, sans-serif; +} + +html[lang="he-IL"] h1, +html[lang="he-IL"] h2, +html[lang="he-IL"] h3, +html[lang="he-IL"] h4, +html[lang="he-IL"] h5, +html[lang="he-IL"] h6 { + font-weight: 700; +} + +/* Typography for Japanese Font */ + +html[lang="ja"] body, +html[lang="ja"] button, +html[lang="ja"] input, +html[lang="ja"] select, +html[lang="ja"] textarea { + font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif; +} + +html[lang="ja"] h1, +html[lang="ja"] h2, +html[lang="ja"] h3, +html[lang="ja"] h4, +html[lang="ja"] h5, +html[lang="ja"] h6 { + font-weight: 700; +} + +/* Typography for Korean font */ + +html[lang="ko-KR"] body, +html[lang="ko-KR"] button, +html[lang="ko-KR"] input, +html[lang="ko-KR"] select, +html[lang="ko-KR"] textarea { + font-family: "Apple SD Gothic Neo", "Malgun Gothic", "Nanum Gothic", Dotum, sans-serif; +} + +html[lang="ko-KR"] h1, +html[lang="ko-KR"] h2, +html[lang="ko-KR"] h3, +html[lang="ko-KR"] h4, +html[lang="ko-KR"] h5, +html[lang="ko-KR"] h6 { + font-weight: 600; +} + +/* Typography for Thai Font */ + +html[lang="th"] h1, +html[lang="th"] h2, +html[lang="th"] h3, +html[lang="th"] h4, +html[lang="th"] h5, +html[lang="th"] h6 { + line-height: 1.65; +} + +html[lang="th"] body, +html[lang="th"] button, +html[lang="th"] input, +html[lang="th"] select, +html[lang="th"] textarea { + line-height: 1.8; +} + +/* Remove letter-spacing for all non-latin alphabets */ + +html[lang="ar"] *, +html[lang="ary"] *, +html[lang="azb"] *, +html[lang="haz"] *, +html[lang="ps"] *, +html[lang^="zh-"] *, +html[lang="bg-BG"] *, +html[lang="ru-RU"] *, +html[lang="uk"] *, +html[lang="bn-BD"] *, +html[lang="hi-IN"] *, +html[lang="mr-IN"] *, +html[lang="el"] *, +html[lang="gu-IN"] *, +html[lang="he-IL"] *, +html[lang="ja"] *, +html[lang="ko-KR"] *, +html[lang="th"] * { + letter-spacing: 0 !important; +} + +/*-------------------------------------------------------------- +# Forms +--------------------------------------------------------------*/ + +label { + color: #333; + display: block; + font-weight: 800; + margin-bottom: 0.5em; +} + +fieldset { + margin-bottom: 1em; +} + +input[type="text"], +input[type="email"], +input[type="url"], +input[type="password"], +input[type="search"], +input[type="number"], +input[type="tel"], +input[type="range"], +input[type="date"], +input[type="month"], +input[type="week"], +input[type="time"], +input[type="datetime"], +input[type="datetime-local"], +input[type="color"], +textarea { + color: #666; + border: 1px solid #bbb; + -webkit-border-radius: 3px; + border-radius: 3px; + display: block; + padding: 0.7em; + width: 100%; +} + +input[type="text"]:focus, +input[type="email"]:focus, +input[type="url"]:focus, +input[type="password"]:focus, +input[type="search"]:focus, +input[type="number"]:focus, +input[type="tel"]:focus, +input[type="range"]:focus, +input[type="date"]:focus, +input[type="month"]:focus, +input[type="week"]:focus, +input[type="time"]:focus, +input[type="datetime"]:focus, +input[type="datetime-local"]:focus, +input[type="color"]:focus, +textarea:focus { + color: #222; + border-color: #333; +} + +select { + border: 1px solid #bbb; + -webkit-border-radius: 3px; + border-radius: 3px; + height: 3em; + max-width: 100%; +} + +input[type="radio"], +input[type="checkbox"] { + margin-right: 0.5em; +} + +input[type="radio"] + label, +input[type="checkbox"] + label { + font-weight: 400; +} + +button, +input[type="button"], +input[type="submit"] { + background-color: #222; + border: 0; + -webkit-border-radius: 2px; + border-radius: 2px; + -webkit-box-shadow: none; + box-shadow: none; + color: #fff; + cursor: pointer; + display: inline-block; + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + line-height: 1; + padding: 1em 2em; + text-shadow: none; + -webkit-transition: background 0.2s; + transition: background 0.2s; +} + +input + button, +input + input[type="button"], +input + input[type="submit"] { + padding: 0.75em 2em; +} + +button.secondary, +input[type="reset"], +input[type="button"].secondary, +input[type="reset"].secondary, +input[type="submit"].secondary { + background-color: #ddd; + color: #222; +} + +button:hover, +button:focus, +input[type="button"]:hover, +input[type="button"]:focus, +input[type="submit"]:hover, +input[type="submit"]:focus { + background: #767676; +} + +button.secondary:hover, +button.secondary:focus, +input[type="reset"]:hover, +input[type="reset"]:focus, +input[type="button"].secondary:hover, +input[type="button"].secondary:focus, +input[type="reset"].secondary:hover, +input[type="reset"].secondary:focus, +input[type="submit"].secondary:hover, +input[type="submit"].secondary:focus { + background: #bbb; +} + +/*-------------------------------------------------------------- +# Formatting +--------------------------------------------------------------*/ + +hr { + background-color: #bbb; + border: 0; + height: 1px; + margin-bottom: 1.5em; +} + +/*-------------------------------------------------------------- +# Lists +--------------------------------------------------------------*/ + +ul, +ol { + margin: 0 0 1.5em; + padding: 0; +} + +ul { + list-style: disc; +} + +ol { + counter-reset: item; +} + +ol li { + display: block; + position: relative; +} + +ol li:before { + content: counter(item) "."; + counter-increment: item; + font-weight: 600; + left: -1.5em; + position: absolute; +} + +li > ul, +li > ol { + margin-bottom: 0; + margin-left: 1.5em; +} + +dt { + font-weight: 700; +} + +dd { + margin: 0 1.5em 1.5em; +} + +/*-------------------------------------------------------------- +# Tables +--------------------------------------------------------------*/ + +table { + border-collapse: collapse; + margin: 0 0 1.5em; + width: 100%; +} + +thead th { + border-bottom: 2px solid #bbb; + padding-bottom: 0.5em; +} + +th { + padding: 0.4em 0; + text-align: left; +} + +tr { + border-bottom: 1px solid #eee; +} + +td { + padding: 0.4em; +} + +/*-------------------------------------------------------------- +# Links +--------------------------------------------------------------*/ + +a { + color: #222; + text-decoration: none; +} + +a:focus { + outline: thin dotted; +} + +a:hover, +a:active { + color: #000; + outline: 0; +} + +/* Hover effects */ + +.entry-content a, +.entry-summary a, +.widget a, +.site-footer .widget-area a, +.posts-navigation a, +.widget_authors a strong { + -webkit-box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1); + box-shadow: inset 0 -1px 0 rgba(15, 15, 15, 1); + -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out; +} + +.entry-title a, +.entry-meta a, +.page-links a, +.page-links a .page-number, +.entry-footer a, +.entry-footer .cat-links a, +.entry-footer .tags-links a, +.edit-link a, +.post-navigation a, +.logged-in-as a, +.comment-navigation a, +.comment-metadata a, +.comment-metadata a.comment-edit-link, +.comment-reply-link, +a .nav-title, +.pagination a, +.site-info a, +.widget .widget-title a, +.widget ul li a, +.site-footer .widget-area ul li a, +.site-footer .widget-area ul li a { + -webkit-box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1); + box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 1); + text-decoration: none; + -webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out; + transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out; +} + +.entry-content a:focus, +.entry-content a:hover, +.entry-summary a:focus, +.entry-summary a:hover, +.widget a:focus, +.widget a:hover, +.site-footer .widget-area a:focus, +.site-footer .widget-area a:hover, +.posts-navigation a:focus, +.posts-navigation a:hover, +.comment-metadata a:focus, +.comment-metadata a:hover, +.comment-metadata a.comment-edit-link:focus, +.comment-metadata a.comment-edit-link:hover, +.comment-reply-link:focus, +.comment-reply-link:hover, +.widget_authors a:focus strong, +.widget_authors a:hover strong, +.project-terms a:focus, +.project-terms a:hover { + color: #000; + -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); + box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); +} + +.entry-title a:focus, +.entry-title a:hover, +.entry-meta a:focus, +.entry-meta a:hover, +.page-links a:focus .page-number, +.page-links a:hover .page-number, +.entry-footer a:focus, +.entry-footer a:hover, +.entry-footer .cat-links a:focus, +.entry-footer .cat-links a:hover, +.entry-footer .tags-links a:focus, +.entry-footer .tags-links a:hover, +.post-navigation a:focus, +.post-navigation a:hover, +.logged-in-as a:focus, +.logged-in-as a:hover, +a:focus .nav-title, +a:hover .nav-title, +.edit-link a:focus, +.edit-link a:hover, +.site-info a:focus, +.site-info a:hover, +.widget .widget-title a:focus, +.widget .widget-title a:hover, +.widget ul li a:focus, +.widget ul li a:hover { + color: #000; + -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); + box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgba(0, 0, 0, 1); +} + +/* Fixes linked images */ +.entry-content a img, +.widget a img { + -webkit-box-shadow: 0 0 0 8px #fff; + box-shadow: 0 0 0 8px #fff; +} + +.post-navigation a:focus .icon, +.post-navigation a:hover .icon { + color: #222; +} + +/*-------------------------------------------------------------- +# Featured Image Hover +--------------------------------------------------------------*/ + +.post-thumbnail { + margin-bottom: 1em; +} + +.post-thumbnail a img { + -webkit-backface-visibility: hidden; + -webkit-transition: opacity 0.2s; + transition: opacity 0.2s; +} + +.post-thumbnail a:hover img, +.post-thumbnail a:focus img { + opacity: 0.7; +} + +/*-------------------------------------------------------------- +# Navigation +--------------------------------------------------------------*/ + +.navigation-top { + background: #fff; + border-bottom: 1px solid #eee; + border-top: 1px solid #eee; + font-size: 16px; + font-size: 1rem; +} + +.navigation-top .wrap { + max-width: 1000px; + padding: 0; +} + +.navigation-top a { + color: #222; + font-weight: 600; + -webkit-transition: color 0.2s; + transition: color 0.2s; +} + +.navigation-top .current-menu-item > a, +.navigation-top .current_page_item > a { + color: #767676; +} + +.main-navigation { + clear: both; + display: block; +} + +.main-navigation ul { + background: #fff; + list-style: none; + margin: 0; + padding: 0 1.5em; + text-align: left; +} + +/* Hide the menu on small screens when JavaScript is available. + * It only works with JavaScript. + */ + +.js .main-navigation ul, +.main-navigation .menu-item-has-children > a > .icon, +.main-navigation .page_item_has_children > a > .icon, +.main-navigation ul a > .icon { + display: none; +} + +.main-navigation > div > ul { + border-top: 1px solid #eee; + padding: 0.75em 3.375em; +} + +.js .main-navigation.toggled-on > div > ul { + display: block; +} + +.main-navigation ul ul { + padding: 0 0 0 1.5em; +} + +.main-navigation ul ul.toggled-on { + display: block; +} + +.main-navigation ul ul a { + letter-spacing: 0; + padding: 0.4em 0; + position: relative; + text-transform: none; +} + +.main-navigation li { + border-bottom: 1px solid #eee; + position: relative; +} + +.main-navigation li li, +.main-navigation li:last-child { + border: 0; +} + +.main-navigation a { + display: block; + padding: 0.5em 0; + text-decoration: none; +} + +.main-navigation a:hover { + color: #767676; +} + +/* Menu toggle */ + +.menu-toggle { + background-color: transparent; + border: 0; + -webkit-box-shadow: none; + box-shadow: none; + color: #222; + display: none; + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + line-height: 1.5; + margin: 1px auto 2px; + padding: 1em; + text-shadow: none; +} + +/* Display the menu toggle when JavaScript is available. */ + +.js .menu-toggle { + display: block; +} + +.main-navigation.toggled-on ul.nav-menu { + display: block; +} + +.menu-toggle:hover, +.menu-toggle:focus { + background-color: transparent; + -webkit-box-shadow: none; + box-shadow: none; +} + +.menu-toggle:focus { + outline: thin solid; +} + +.menu-toggle .icon { + margin-right: 0.5em; + top: -2px; +} + +.toggled-on .menu-toggle .icon-bars, +.menu-toggle .icon-close { + display: none; +} + +.toggled-on .menu-toggle .icon-close { + display: inline-block; +} + +/* Dropdown Toggle */ + +.dropdown-toggle { + background-color: transparent; + border: 0; + -webkit-box-shadow: none; + box-shadow: none; + color: #222; + display: block; + font-size: 16px; + right: -0.5em; + line-height: 1.5; + margin: 0 auto; + padding: 0.5em; + position: absolute; + text-shadow: none; + top: 0; +} + +.dropdown-toggle:hover, +.dropdown-toggle:focus { + background: transparent; +} + +.dropdown-toggle:focus { + outline: thin dotted; +} + +.dropdown-toggle.toggled-on .icon { + -ms-transform: rotate(-180deg); /* IE 9 */ + -webkit-transform: rotate(-180deg); /* Chrome, Safari, Opera */ + transform: rotate(-180deg); +} + +/* Scroll down arrow */ + +.navigation-top .menu-scroll-down { + display: none; +} + +/*-------------------------------------------------------------- +# Layout +--------------------------------------------------------------*/ + +html { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + +*, +*:before, +*:after { + /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ + -webkit-box-sizing: inherit; + -moz-box-sizing: inherit; + box-sizing: inherit; +} + +body { + background: #fff; + /* Fallback for when there is no custom background color defined. */ +} + +#page { + position: relative; + -ms-word-wrap: break-word; + word-wrap: break-word; +} + +.wrap { + margin-left: auto; + margin-right: auto; + max-width: 700px; + padding-left: 3em; + padding-right: 3em; +} + +.wrap:after { + clear: both; + content: ""; + display: block; +} + +/*-------------------------------------------------------------- +## Header +--------------------------------------------------------------*/ + +#masthead .wrap { + position: relative; +} + +.site-header { + background-color: #fafafa; + position: relative; +} + +/* Site branding */ + +.site-branding { + padding: 1em 0; + -webkit-transition: margin-bottom 0.2s; + transition: margin-bottom 0.2s; +} + +.site-branding a { + text-decoration: none; + -webkit-transition: opacity 0.2s; + transition: opacity 0.2s; +} + +.site-branding a:hover, +.site-branding a:focus { + opacity: 0.7; +} + +.has-header-image.twentyseventeen-front-page .site-branding, +.has-header-image.home.blog .site-branding { + align-self: flex-end; +} + +.site-title { + clear: none; + font-size: 24px; + font-size: 1.5rem; + font-weight: 800; + line-height: 1.25; + letter-spacing: 0.08em; + margin: 0; + padding: 0; + text-transform: uppercase; +} + +.site-title, +.site-title a { + color: #222; +} + +body.has-header-image .site-title, +body.has-header-image .site-title a { + color: #fff; +} + +.site-description { + color: #666; + font-size: 13px; + font-size: 0.8125rem; + margin-bottom: 0; +} + +body.has-header-image .site-description { + color: #fff; + opacity: 0.8; +} + +.custom-logo-link { + display: inline-block; + padding-right: 1em; + vertical-align: middle; + width: auto; +} + +.custom-logo-link img { + display: inline-block; + max-height: 80px; + width: auto; +} + +body.home.title-tagline-hidden.has-header-image .custom-logo-link img { + max-height: 200px; + max-width: 100%; +} + +.custom-logo-link a:hover, +.custom-logo-link a:focus { + opacity: 0.9; +} + +body:not(.title-tagline-hidden) .site-branding-text { + display: inline-block; + vertical-align: middle; +} + +.custom-header { + position: relative; +} + +.has-header-image.twentyseventeen-front-page .custom-header, +.has-header-image.home.blog .custom-header { + display: flex; + min-height: 300px; + min-height: 75vh; +} + +.custom-header-image { + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size: cover; + background-size: cover; + bottom: 0; + left: 0; + position: absolute; + right: 0; + top: 0; +} + +.custom-header-image:before { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+75 */ + background: -moz-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* FF3.6-15 */ + background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* Chrome10-25,Safari5.1-6 */ + background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 75%, rgba(0, 0, 0, 0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000", endColorstr="#4d000000", GradientType=0); /* IE6-9 */ + bottom: 0; + content: ""; + display: block; + height: 100%; + left: 0; + position: absolute; + right: 0; +} + +.has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-image { + background-position: center bottom; +} + +body:not(.has-header-image) .custom-header-image { + padding: 5% 0; +} + +/*-------------------------------------------------------------- +## Front Page +--------------------------------------------------------------*/ + +.twentyseventeen-front-page .site-content { + padding: 0; +} + +.twentyseventeen-panel { + overflow: hidden; + position: relative; +} + +.panel-image { + background-position: center center; + background-repeat: no-repeat; + -webkit-background-size: cover; + background-size: cover; + position: relative; +} + +.panel-image:before { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.3+100 */ /* FF3.6-15 */ + background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%); /* Chrome10-25,Safari5.1-6 */ + background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.3))); + background: -webkit-linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%); + background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000", endColorstr="#4d000000", GradientType=0); /* IE6-9 */ + bottom: 0; + content: ""; + left: 0; + right: 0; + position: absolute; + top: 100px; +} + +.twentyseventeen-front-page article:not(.has-post-thumbnail):not(:first-child) { + border-top: 1px solid #ddd; +} + +.panel-content { + position: relative; +} + +.panel-content .wrap { + padding-bottom: 0.5em; + padding-top: 1.75em; +} + +/* Panel edit link */ + +.twentyseventeen-panel .edit-link { + display: block; + margin: 0.3em 0 0; +} + +.twentyseventeen-panel .entry-header .edit-link { + font-size: 14px; + font-size: 0.875rem; +} + +/* Front Page - Recent Posts */ + +.twentyseventeen-front-page .panel-content .recent-posts article { + border: 0; + color: #333; + margin-bottom: 3em; +} + +.recent-posts .entry-header { + margin-bottom: 1.2em; +} + +.page .panel-content .recent-posts .entry-title { + font-size: 20px; + font-size: 1.25rem; + font-weight: 300; + letter-spacing: 0; + text-transform: none; +} + +.twentyseventeen-panel .recent-posts .entry-header .edit-link { + color: #222; + display: inline-block; + font-size: 11px; + font-size: 0.6875rem; + margin-left: 1em; +} + +/*-------------------------------------------------------------- +## Regular Content +--------------------------------------------------------------*/ + +.site-content { + padding: 2.5em 0 0; +} + +/*-------------------------------------------------------------- +## Posts +--------------------------------------------------------------*/ + +/* Post Landing Page */ + +.sticky { + position: relative; +} + +.icon-pinned { + display: none; +} + +.sticky .icon-pinned { + display: block; + height: 20px; + left: -1em; + position: absolute; + top: 1.75em; + -ms-transform: rotate(-45deg); /* IE 9 */ + -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */ + transform: rotate(-45deg); + width: 20px; +} + +.page .panel-content .entry-title, +.page-title, +body.page:not(.twentyseventeen-front-page) .entry-title { + color: #222; + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + letter-spacing: 0.14em; + text-transform: uppercase; +} + +.entry-header .entry-title { + margin-bottom: 0.25em; +} + +.entry-title a { + color: #333; + text-decoration: none; + margin-left: -2px; +} + +.entry-title:not(:first-child) { + padding-top: 0; +} + +.entry-meta { + color: #767676; + font-size: 11px; + font-size: 0.6875rem; + font-weight: 800; + letter-spacing: 0.1818em; + padding-bottom: 0.25em; + text-transform: uppercase; +} + +.entry-meta a { + color: #767676; +} + +.byline, +.updated:not(.published) { + display: none; +} + +.single .byline, +.group-blog .byline { + display: inline; +} + +.pagination, +.comments-pagination { + border-top: 1px solid #eee; + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + padding: 2em 0 3em; + text-align: center; +} + +.comments-pagination { + border: 0; +} + +.page-numbers { + padding: 0.5em 1em; +} + +.page-numbers.current { + color: #767676; +} + +.prev.page-numbers, +.next.page-numbers { + background-color: #ddd; + -webkit-border-radius: 2px; + border-radius: 2px; + font-size: 24px; + font-size: 1.5rem; + line-height: 1; + margin-top: -0.3em; + padding: 0.25em 0.5em 0.4em; +} + +.prev.page-numbers, +.next.page-numbers { + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; +} + +.prev.page-numbers:focus, +.prev.page-numbers:hover, +.next.page-numbers:focus, +.next.page-numbers:hover { + background-color: #767676; + color: #fff; +} + +.prev.page-numbers { + float: left; +} + +.next.page-numbers { + float: right; +} + +/* Aligned blockquotes */ + +.entry-content blockquote.alignleft, +.entry-content blockquote.alignright { + color: #666; + font-size: 13px; + font-size: 0.8125rem; + width: 48%; +} + +/* Blog landing, search, archives */ + +.blog .site-main > article, +.archive .site-main > article, +.search .site-main > article { + padding-bottom: 2em; +} + +body:not(.twentyseventeen-front-page) .entry-header { + padding: 1em 0; +} + +body:not(.twentyseventeen-front-page) .entry-header, +body:not(.twentyseventeen-front-page) .entry-content, +body:not(.twentyseventeen-front-page) #comments { + margin-left: auto; + margin-right: auto; +} + +body:not(.twentyseventeen-front-page) .entry-header { + padding-top: 0; +} + +.blog .entry-meta a.post-edit-link, +.archive .entry-meta a.post-edit-link, +.search .entry-meta a.post-edit-link { + color: #222; + display: inline-block; + margin-left: 1em; +} + +.search .page .entry-meta a.post-edit-link { + margin-left: 0; +} + +.taxonomy-description { + color: #666; + font-size: 13px; + font-size: 0.8125rem; +} + +/* More tag */ + +.entry-content .more-link:before { + content: ""; + display: block; + margin-top: 1.5em; +} + +/* Single Post */ + +.single-post:not(.has-sidebar) #primary, +.page.page-one-column:not(.twentyseventeen-front-page) #primary { + margin-left: auto; + margin-right: auto; + max-width: 740px; +} + +.single-featured-image-header { + background-color: #fafafa; + border-bottom: 1px solid #eee; +} + +.single-featured-image-header img { + display: block; + margin: auto; +} + +.page-links { + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + padding: 2em 0 3em; +} + +.page-links .page-number { + color: #767676; + display: inline-block; + padding: 0.5em 1em; +} + +.page-links a { + display: inline-block; +} + +.page-links a .page-number { + color: #222; +} + +/* Entry footer */ + +.entry-footer { + border-bottom: 1px solid #eee; + border-top: 1px solid #eee; + margin-top: 2em; + padding: 2em 0; +} + +.entry-footer .cat-links, +.entry-footer .tags-links { + display: block; + font-size: 11px; + font-size: 0.6875rem; + font-weight: 800; + letter-spacing: 0.1818em; + padding-left: 2.5em; + position: relative; + text-transform: uppercase; +} + +.entry-footer .cat-links + .tags-links { + margin-top: 1em; +} + +.entry-footer .cat-links a, +.entry-footer .tags-links a { + color: #333; +} + +.entry-footer .cat-links .icon, +.entry-footer .tags-links .icon { + color: #999; + left: 0; + margin-right: 0.5em; + position: absolute; + top: 2px; +} + +.entry-footer .edit-link { + display: inline-block; +} + +.entry-footer .edit-link a.post-edit-link { + background-color: #222; + -webkit-border-radius: 2px; + border-radius: 2px; + -webkit-box-shadow: none; + box-shadow: none; + color: #fff; + display: inline-block; + font-size: 14px; + font-size: 0.875rem; + font-weight: 800; + margin-top: 2em; + padding: 0.7em 2em; + -webkit-transition: background-color 0.2s ease-in-out; + transition: background-color 0.2s ease-in-out; +} + +.entry-footer .edit-link a.post-edit-link:hover, +.entry-footer .edit-link a.post-edit-link:focus { + background-color: #767676; +} + +/* Post Formats */ + +.blog .format-status .entry-title, +.archive .format-status .entry-title, +.blog .format-aside .entry-title, +.archive .format-aside .entry-title { + display: none; +} + +.format-quote blockquote { + color: #333; + font-size: 20px; + font-size: 1.25rem; + font-weight: 300; + overflow: visible; + position: relative; +} + +.format-quote blockquote .icon { + display: block; + height: 20px; + left: -1.25em; + position: absolute; + top: 0.4em; + -webkit-transform: scale(-1, 1); + -ms-transform: scale(-1, 1); + transform: scale(-1, 1); + width: 20px; +} + + +/* Post Navigation */ + +.post-navigation { + font-weight: 800; + margin: 3em 0; +} + +.post-navigation .nav-links { + padding: 1em 0; +} + +.nav-subtitle { + background: transparent; + color: #767676; + display: block; + font-size: 11px; + font-size: 0.6875rem; + letter-spacing: 0.1818em; + margin-bottom: 1em; + text-transform: uppercase; +} + +.nav-title { + color: #333; + font-size: 16px; + font-size: 1rem; +} + +.nav-links .nav-next .nav-title .icon, +.nav-links .nav-previous .nav-title .icon { + height: 24px; + height: 1.5rem; + width: 24px; + width: 1.5rem; + font-weight: 400; +} + +.post-navigation .nav-next { + margin-top: 1.5em; +} + +/*-------------------------------------------------------------- +## Pages +--------------------------------------------------------------*/ + +.page-header { + padding-bottom: 2em; +} + +.page .entry-header .edit-link { + font-size: 14px; + font-size: 0.875rem; +} + +.search .page .entry-header .edit-link { + font-size: 11px; + font-size: 0.6875rem; +} + +.page-links { + clear: both; + margin: 0 0 1.5em; +} + +/* 404 page */ + +.error404 .page-content { + padding-bottom: 4em; +} + +.error404 .page-content .search-form, +.search .page-content .search-form { + margin-bottom: 3em; +} + +/*-------------------------------------------------------------- +## Footer +--------------------------------------------------------------*/ + +.site-footer { + border-top: 1px solid #eee; +} + +.site-footer .wrap { + padding-bottom: 1.5em; + padding-top: 2em; +} + +/* Footer widgets */ + +.site-footer .widget-area { + padding-bottom: 2em; + padding-top: 2em; +} + +/* Social nav */ + +.social-navigation { + font-size: 16px; + font-size: 1rem; + margin-bottom: 1em; +} + +.social-navigation ul { + list-style: none; + margin-bottom: 0; + margin-left: 0; +} + +.social-navigation li { + display: inline; +} + +.social-navigation a { + background-color: #767676; + -webkit-border-radius: 40px; + border-radius: 40px; + color: #fff; + display: inline-block; + height: 40px; + margin: 0 1em 0.5em 0; + text-align: center; + width: 40px; +} + +.social-navigation a:hover, +.social-navigation a:focus { + background-color: #333; +} + +.social-navigation .icon { + height: 16px; + top: 12px; + width: 16px; + vertical-align: top; +} + +/* Site info */ + +.site-info { + font-size: 14px; + font-size: 0.875rem; + margin-bottom: 1em; +} + +.site-info a { + color: #666; +} + +.site-info .sep { + margin: 0; + display: block; + visibility: hidden; + height: 0; + width: 100%; +} + +/*-------------------------------------------------------------- +# Comments +--------------------------------------------------------------*/ + +#comments { + padding: 2em 0 0.5em; +} + +.comments-title { + font-size: 20px; + font-size: 1.25rem; + margin-bottom: 1.5em; +} + +.comment-list, +.comment-list .children { + list-style: none; + margin: 0; + padding: 0; +} + +.comment-list li:before { + display: none; +} + +.comment-body { + margin-left: 65px; +} + +.comment-author { + font-size: 16px; + font-size: 1rem; + margin-bottom: 0.4em; + position: relative; + z-index: 2; +} + +.comment-author .avatar { + height: 50px; + left: -65px; + position: absolute; + width: 50px; +} + +.comment-author .says { + display: none; +} + +.comment-meta { + margin-bottom: 1.5em; +} + +.comment-metadata { + color: #767676; + font-size: 10px; + font-size: 0.625rem; + font-weight: 800; + letter-spacing: 0.1818em; + text-transform: uppercase; +} + +.comment-metadata a { + color: #767676; +} + +.comment-metadata a.comment-edit-link { + color: #222; + margin-left: 1em; +} + +.comment-body { + color: #333; + font-size: 14px; + font-size: 0.875rem; + margin-bottom: 4em; +} + +.comment-reply-link { + font-weight: 800; + position: relative; +} + +.comment-reply-link .icon { + color: #222; + left: -2em; + height: 1em; + position: absolute; + top: 0; + width: 1em; +} + +.children .comment-author .avatar { + height: 30px; + left: -45px; + width: 30px; +} + +.bypostauthor > .comment-body > .comment-meta > .comment-author:before { + background: #222; + -webkit-border-radius: 20px; + border-radius: 20px; + border: 1px solid #fff; + color: #fff; + left: -65px; + font-size: 16px; + font-size: 1rem; + height: 20px; + line-height: 1; + margin: -6px 0 0 -6px; + position: absolute; + text-align: center; + width: 20px; + z-index: 2; +} + +.children .bypostauthor > .comment-body > .comment-meta > .comment-author:before { + font-size: 12px; + font-size: 0.75rem; + height: 16px; + left: -45px; + width: 16px; +} + +.no-comments, +.comment-awaiting-moderation { + color: #767676; + font-size: 14px; + font-size: 0.875rem; + font-style: italic; +} + +.comments-pagination { + margin: 2em 0 3em; +} + +.form-submit { + text-align: right; +} + +/*-------------------------------------------------------------- +# Widgets +--------------------------------------------------------------*/ + +#secondary { + padding: 1em 0 2em; +} + +.widget { + padding-bottom: 3em; +} + +h2.widget-title { + color: #222; + font-size: 13px; + font-size: 0.8125rem; + font-weight: 800; + letter-spacing: 0.1818em; + margin-bottom: 1.5em; + text-transform: uppercase; +} + +.widget-title a { + color: inherit; +} + +/* widget forms */ + +.widget select { + width: 100%; +} + + +/* widget lists */ + +.widget ul { + list-style: none; + margin: 0; +} + +.widget ul li { + border-bottom: 1px solid #ddd; + border-top: 1px solid #ddd; + padding: 0.5em 0; +} + +.widget ul li + li { + margin-top: -1px; +} + +.widget ul li ul { + margin: 0 0 -1px; + padding: 0; + position: relative; +} + +.widget ul li li { + border: 0; + padding-left: 1.5rem; +} + +/* Widget lists of links */ + +.widget_top-posts ul li ul, +.widget_rss_links ul li ul, +.widget-grofile ul.grofile-links li ul, +.widget_pages ul li ul, +.widget_meta ul li ul { + bottom: 0; +} + +.widget_nav_menu ul li li, +.widget_top-posts ul li, +.widget_top-posts ul li li, +.widget_rss_links ul li, +.widget_rss_links ul li li, +.widget-grofile ul.grofile-links li, +.widget-grofile ul.grofile-links li li { + padding-bottom: 0.25em; + padding-top: 0.25em; +} + +.widget_rss ul li { + padding-bottom: 1em; + padding-top: 1em; +} + +/* widget markup */ + +.widget .post-date, +.widget .rss-date { + font-size: 0.81em; +} + +/* Text widget */ + +.widget_text { + -ms-word-wrap: break-word; + word-wrap: break-word; +} + +/* RSS Widget */ + +.widget_rss .widget-title .rsswidget:first-child { + float: right; +} + +.widget_rss .widget-title .rsswidget:first-child:hover { + background-color: transparent; +} + +.widget_rss .widget-title .rsswidget:first-child img { + display: block; +} + +.widget_rss ul li { + padding: 2.125em 0; +} + +.widget_rss ul li:first-child { + border-top: none; + padding-top: 0; +} + +.widget_rss li .rsswidget { + font-size: 22px; + font-size: 1.375rem; + font-weight: 300; + line-height: 1.4; +} + +.widget_rss .rss-date, +.widget_rss li cite { + color: #767676; + display: block; + font-size: 10px; + font-size: 0.625rem; + font-style: normal; + font-weight: 800; + letter-spacing: 0.18em; + line-height: 1.5; + text-transform: uppercase; +} + +.widget_rss .rss-date { + margin: 0.5em 0 1.5em; + padding: 0; +} + +.widget_rss .rssSummary { + margin-bottom: 0.5em; +} + +/* Contact Info Widget */ + +.widget_contact_info .contact-map { + margin-bottom: 0.5em; +} + +/* Gravatar */ + +.widget-grofile h4 { + font-size: 16px; + font-size: 1rem; + margin-bottom: 0; +} + +/* Recent Comments */ + +.widget_recent_comments table, +.widget_recent_comments th, +.widget_recent_comments td { + border: 0; +} + +/* Recent Posts widget */ + +.widget_recent_entries .post-date { + display: block; +} + +/* Search */ + +.search-form { + position: relative; +} + +.search-form .search-submit { + bottom: 3px; + padding: 0.5em 1em; + position: absolute; + right: 3px; + top: 3px; +} + +.search-form .search-submit .icon { + height: 24px; + height: 1.5rem; + top: -2px; + width: 24px; + width: 1.5rem; +} + +/* Tag cloud widget */ + +.tagcloud, +.widget_tag_cloud, +.wp_widget_tag_cloud { + line-height: 1.5; +} + +.widget .tagcloud a, +.widget.widget_tag_cloud a, +.wp_widget_tag_cloud a { + border: 1px solid #ddd; + -webkit-box-shadow: none; + box-shadow: none; + display: inline-block; + float: left; + font-size: 14px !important; /* !important to overwrite inline styles */ + font-size: 0.875rem !important; + margin: 4px 4px 0 0 !important; + padding: 4px 10px 5px !important; + position: relative; + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + width: auto; + -ms-word-wrap: break-word; + word-wrap: break-word; + z-index: 0; +} + +.widget .tagcloud a:hover, +.widget .tagcloud a:focus, +.widget.widget_tag_cloud a:hover, +.widget.widget_tag_cloud a:focus, +.wp_widget_tag_cloud a:hover, +.wp_widget_tag_cloud a:focus { + border-color: #bbb; + -webkit-box-shadow: none; + box-shadow: none; + text-decoration: none; +} + +/* Calendar widget */ + +.widget_calendar th, +.widget_calendar td { + text-align: center; +} + +.widget_calendar tfoot td { + border: 0; +} + +/*-------------------------------------------------------------- +# Media +--------------------------------------------------------------*/ + +img { + height: auto; /* Make sure images are scaled correctly. */ + max-width: 100%; /* Adhere to container width. */ +} + +img.alignleft, +img.alignright { + float: none; + margin: 0; +} + +.page-content .wp-smiley, +.entry-content .wp-smiley, +.comment-content .wp-smiley { + border: none; + margin-bottom: 0; + margin-top: 0; + padding: 0; +} + +/* Make sure embeds and iframes fit their containers. */ + +embed, +iframe, +object { + margin-bottom: 1.5em; + max-width: 100%; +} + +.wp-caption, +.gallery-caption { + color: #666; + font-size: 13px; + font-size: 0.8125rem; + font-style: italic; + margin-bottom: 1.5em; + max-width: 100%; +} + +.wp-caption img[class*="wp-image-"] { + display: block; + margin-left: auto; + margin-right: auto; +} + +.wp-caption .wp-caption-text { + margin: 0.8075em 0; +} + +/* Media Elements */ + +.mejs-container { + margin-bottom: 1.5em; +} + +/* Audio Player */ + +.mejs-controls a.mejs-horizontal-volume-slider, +.mejs-controls a.mejs-horizontal-volume-slider:focus, +.mejs-controls a.mejs-horizontal-volume-slider:hover { + background: transparent; + border: 0; +} + +/* Playlist Color Overrides: Light */ + +.site-content .wp-playlist-light { + border-color: #eee; + color: #222; +} + +.site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album { + color: #333; +} + +.site-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist { + color: #767676; +} + +.site-content .wp-playlist-light .wp-playlist-item { + border-bottom: 1px dotted #eee; + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; +} + +.site-content .wp-playlist-light .wp-playlist-item:hover, +.site-content .wp-playlist-light .wp-playlist-item:focus { + border-bottom-color: rgba(0, 0, 0, 0); + background-color: #767676; + color: #fff; +} + +.site-content .wp-playlist-light a.wp-playlist-caption:hover, +.site-content .wp-playlist-light .wp-playlist-item:hover a, +.site-content .wp-playlist-light .wp-playlist-item:focus a { + color: #fff; +} + +/* Playlist Color Overrides: Dark */ + +.site-content .wp-playlist-dark { + background: #222; + border-color: #333; +} + +.site-content .wp-playlist-dark .mejs-container .mejs-controls { + background-color: #333; +} + +.site-content .wp-playlist-dark .wp-playlist-caption { + color: #fff; +} + +.site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album { + color: #eee; +} + +.site-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist { + color: #aaa; +} + +.site-content .wp-playlist-dark .wp-playlist-playing { + background-color: #333; +} + +.site-content .wp-playlist-dark .wp-playlist-item { + border-bottom: 1px dotted #555; + -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; + transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out; +} + +.site-content .wp-playlist-dark .wp-playlist-item:hover, +.site-content .wp-playlist-dark .wp-playlist-item:focus { + border-bottom-color: rgba(0, 0, 0, 0); + background-color: #aaa; + color: #222; +} + +.site-content .wp-playlist-dark a.wp-playlist-caption:hover, +.site-content .wp-playlist-dark .wp-playlist-item:hover a, +.site-content .wp-playlist-dark .wp-playlist-item:focus a { + color: #222; +} + +/* Playlist Style Overrides */ + +.site-content .wp-playlist { + padding: 0.625em 0.625em 0.3125em; +} + +.site-content .wp-playlist-current-item .wp-playlist-item-title { + font-weight: 700; +} + +.site-content .wp-playlist-current-item .wp-playlist-item-album { + font-style: normal; +} + +.site-content .wp-playlist-current-item .wp-playlist-item-artist { + font-size: 10px; + font-size: 0.625rem; + font-weight: 800; + letter-spacing: 0.1818em; + text-transform: uppercase; +} + +.site-content .wp-playlist-item { + padding: 0 0.3125em; + cursor: pointer; +} + +.site-content .wp-playlist-item:last-of-type { + border-bottom: none; +} + +.site-content .wp-playlist-item a { + padding: 0.3125em 0; + border-bottom: none; +} + +.site-content .wp-playlist-item a, +.site-content .wp-playlist-item a:focus, +.site-content .wp-playlist-item a:hover { + -webkit-box-shadow: none; + box-shadow: none; + background: transparent; +} + +.site-content .wp-playlist-item-length { + top: 5px; +} + +/* SVG Icons base styles */ + +.icon { + display: inline-block; + fill: currentColor; + height: 1em; + position: relative; /* Align more nicely with capital letters */ + top: -0.0625em; + vertical-align: middle; + width: 1em; +} + +/*-------------------------------------------------------------- +## Galleries +--------------------------------------------------------------*/ + +.gallery-item { + display: inline-block; + text-align: left; + vertical-align: top; + margin: 0 0 1.5em; + padding: 0 1em 0 0; + width: 50%; +} + +.gallery-columns-1 .gallery-item { + width: 100%; +} + +.gallery-columns-2 .gallery-item { + max-width: 50%; +} + +.gallery-item a, +.gallery-item a:hover, +.gallery-item a:focus { + -webkit-box-shadow: none; + box-shadow: none; + background: none; + display: inline-block; +} + +.gallery-item a img { + display: block; + -webkit-transition: -webkit-filter 0.2s ease-in; + transition: -webkit-filter 0.2s ease-in; + transition: filter 0.2s ease-in; + transition: filter 0.2s ease-in, -webkit-filter 0.2s ease-in; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; +} + +.gallery-item a:hover img, +.gallery-item a:focus img { + -webkit-filter: opacity(60%); + filter: opacity(60%); +} + +.gallery-caption { + display: block; + text-align: left; + padding: 0 10px 0 0; + margin-bottom: 0; +} + +/*-------------------------------------------------------------- +# Customizer +--------------------------------------------------------------*/ + +/* Hide this until we're in the Customizer */ + +.twentyseventeen-panel-title { + display: none; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel { + /* Colour-code all panels (add 1 to account for #twentyseventeen-hero, so 2 is actually panel 1)*/ +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:after { + border: 2px dashed; + bottom: 1em; + content: ""; + display: block; + left: 1em; + position: absolute; + right: 1em; + top: 1em; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel .twentyseventeen-panel-title { + color: #fff; + display: inline-block; + font-size: 14px; + font-size: 0.875rem; + font-weight: 700; + letter-spacing: 1px; + padding: 5px 10px; + position: absolute; + right: 3.2em; + text-transform: uppercase; + top: 3.2em; + -webkit-transform: translate(3px, -3px); + -ms-transform: translate(3px, -3px); + transform: translate(3px, -3px); + z-index: 3; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(1):after { + border: none; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(2) .twentyseventeen-panel-title { + background: #b569a2; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(2):after { + border-color: #b569a2; + color: #b569a2; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(3) .twentyseventeen-panel-title { + background: #8f68bd; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(3):after { + border-color: #8f68bd; + color: #8f68bd; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(4) .twentyseventeen-panel-title { + background: #575ebd; +} + +.twentyseventeen-customizer.twentyseventeen-front-page .twentyseventeen-panel:nth-of-type(4):after { + border-color: #575ebd; + color: #575ebd; +} + +/* Add a highlight class to improve Customizer behaviour */ + +@-webkit-keyframes flash { + + 0%, + 20%, + 40%, + 60%, + 80%, + 100% { + opacity: 1; + } + + 10%, + 30%, + 50%, + 70%, + 90% { + opacity: 0; + } +} + +@keyframes flash { + + 0%, + 20%, + 40%, + 60%, + 80%, + 100% { + opacity: 1; + } + + 10%, + 30%, + 50%, + 70%, + 90% { + opacity: 0; + } +} + +article.panel-placeholder { + display: none; +} + +.twentyseventeen-front-page.twentyseventeen-customizer #primary article.panel-placeholder { + border: 0; +} + +.twentyseventeen-customizer .panel-placeholder.twentyseventeen-highlight { + display: block; + height: 112px; +} + +.twentyseventeen-highlight:after { + -webkit-animation-duration: 2s; + animation-duration: 2s; + -webkit-animation-name: flash; + animation-name: flash; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; + -webkit-animation-fill-mode: both; + animation-fill-mode: both; +} + +/*-------------------------------------------------------------- +## SVGs Fallbacks +--------------------------------------------------------------*/ + +.svg-fallback { + display: none; +} + +.no-svg .svg-fallback { + display: inline-block; +} + +.no-svg .dropdown-toggle .svg-fallback.icon-expand { + font-size: 16px; + font-size: 1em; + font-weight: 400; + line-height: 2.5em; + position: absolute; + top: 8px; + -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ + -ms-transform: rotate(180deg); /* IE 9 */ + transform: rotate(180deg); +} + +.no-svg .dropdown-toggle.toggled-on .svg-fallback.icon-expand { + -webkit-transform: rotate(0); /* Chrome, Safari, Opera */ + -ms-transform: rotate(0); /* IE 9 */ + transform: rotate(0); +} + +.no-svg .dropdown-toggle .svg-fallback.icon-expand:before { + content: "\005E"; + display: block; + height: 25px; + text-align: center; + width: 20px; +} + +/* Social Menu fallbacks */ + +.no-svg .social-navigation a { + background: transparent; + color: #222; + height: auto; + width: auto; +} + +/* Show screen reader text in some cases */ + +.no-svg .next.page-numbers .screen-reader-text, +.no-svg .prev.page-numbers .screen-reader-text, +.no-svg .social-navigation li a .screen-reader-text, +.no-svg .search-submit .screen-reader-text { + clip: auto; + font-size: 16px; + font-size: 1rem; + font-weight: 400; + height: auto; + position: relative !important; /* overrides previous !important styles */ + width: auto; +} + +/*-------------------------------------------------------------- +## Media Queries +--------------------------------------------------------------*/ + +@media screen and (min-width: 30em) { + + /* Typography */ + + body, + button, + input, + select, + textarea { + font-size: 18px; + font-size: 1.125rem; + } + + h1 { + font-size: 30px; + font-size: 1.875rem; + } + + h2, + .page .panel-content .recent-posts .entry-title { + font-size: 26px; + font-size: 1.625rem; + } + + h3 { + font-size: 22px; + font-size: 1.375rem; + } + + h4 { + font-size: 18px; + font-size: 1.125rem; + } + + h5 { + font-size: 13px; + font-size: 0.8125rem; + } + + h6 { + font-size: 16px; + font-size: 1rem; + } + + .entry-content blockquote.alignleft, + .entry-content blockquote.alignright { + font-size: 14px; + font-size: 0.875rem; + } + + /* Fix image alignment */ + img.alignleft { + float: left; + margin-right: 1.5em; + } + + img.alignright { + float: right; + margin-left: 1.5em; + } + + /* Site Branding */ + + .site-branding { + padding: 3em 0; + } + + /* Front Page */ + + .panel-content .wrap { + padding-bottom: 2em; + padding-top: 3.5em; + } + + .page-one-column .panel-content .wrap { + max-width: 740px; + } + + .panel-content .entry-header { + margin-bottom: 4.5em; + } + + .panel-content .recent-posts .entry-header { + margin-bottom: 0; + } + + /* Blog Index, Archive, Search */ + + .taxonomy-description { + font-size: 14px; + font-size: 0.875rem; + } + + + /* Site Footer */ + + .site-footer { + font-size: 16px; + font-size: 1rem; + } + + /* Gallery Columns */ + + .gallery-item { + max-width: 25%; + } + + .gallery-columns-1 .gallery-item { + max-width: 100%; + } + + .gallery-columns-2 .gallery-item { + max-width: 50%; + } + + .gallery-columns-3 .gallery-item { + max-width: 33.33%; + } + + .gallery-columns-4 .gallery-item { + max-width: 25%; + } +} + +@media screen and (min-width: 48em) { + + /* Typography */ + + body, + button, + input, + select, + textarea { + font-size: 16px; + font-size: 1rem; + line-height: 1.5; + } + + .entry-content blockquote.alignleft, + .entry-content blockquote.alignright { + font-size: 13px; + font-size: 0.8125rem; + } + + /* Layout */ + + .wrap { + max-width: 1000px; + } + + .has-sidebar:not(.error404) #primary { + float: left; + width: 58%; + } + + .has-sidebar #secondary { + float: right; + padding-top: 0; + width: 36%; + } + + .error404 #primary { + float: none; + } + + /* Site Branding */ + + .site-branding { + margin-bottom: 0; + } + + .has-header-image.twentyseventeen-front-page .site-branding, + .has-header-image.home.blog .site-branding { + bottom: 0; + padding-top: 0; + position: absolute; + width: 100%; + } + + .has-header-image.twentyseventeen-front-page .custom-header, + .has-header-image.home.blog .custom-header { + display: block; + min-height: 0; + } + + .custom-header-image { + height: 165px; + position: relative; + } + + .has-header-image:not(.twentyseventeen-front-page):not(.home) .custom-header-image { + bottom: 0; + height: auto; + left: 0; + position: absolute; + right: 0; + top: 0; + } + + .twentyseventeen-front-page.has-header-image .custom-header-image, + .home.blog.has-header-image .custom-header-image { + height: 0; + padding-top: 66%; + position: relative; + } + + .custom-logo-link { + padding-right: 2em; + } + + .custom-logo-link img, + body.home.title-tagline-hidden.has-header-image .custom-logo-link img { + max-width: 350px; + } + + .title-tagline-hidden.home.has-header-image .custom-logo-link img { + max-height: 200px; + } + + .site-title { + font-size: 36px; + font-size: 2.25rem; + } + + .site-description { + font-size: 16px; + font-size: 1rem; + } + + /* Navigation */ + + .navigation-top { + bottom: 0; + font-size: 14px; + font-size: 0.875rem; + left: 0; + position: absolute; + right: 0; + width: 100%; + z-index: 3; + } + + .navigation-top .wrap { + max-width: 1000px; + /* The font size is 14px here and we need 50px padding in ems */ + padding: 0.75em 3.4166666666667em; + } + + .navigation-top nav { + margin-left: -1.25em; + } + + .site-navigation-fixed.navigation-top { + bottom: auto; + position: fixed; + left: 0; + right: 0; + top: 0; + width: 100%; + z-index: 7; + } + + .admin-bar .site-navigation-fixed.navigation-top { + top: 32px; + } + + /* Main Navigation */ + + .js .menu-toggle, + .js .dropdown-toggle { + display: none; + } + + .main-navigation { + width: auto; + } + + .js .main-navigation ul, + .js .main-navigation ul ul, + .js .main-navigation > div > ul { + display: block; + } + + .main-navigation ul { + background: transparent; + padding: 0; + } + + .main-navigation > div > ul { + border: 0; + margin-bottom: 0; + padding: 0; + } + + .main-navigation li { + border: 0; + display: inline-block; + } + + .main-navigation li li { + display: block; + } + + .main-navigation a { + padding: 1em 1.25em; + } + + .main-navigation ul ul { + background: #fff; + border: 1px solid #bbb; + left: -999em; + padding: 0; + position: absolute; + top: 100%; + z-index: 99999; + } + + .main-navigation ul li.menu-item-has-children:before, + .main-navigation ul li.menu-item-has-children:after, + .main-navigation ul li.page_item_has_children:before, + .main-navigation ul li.page_item_has_children:after { + border-style: solid; + border-width: 0 6px 6px; + content: ""; + display: none; + height: 0; + position: absolute; + right: 1em; + bottom: -1px; + width: 0; + z-index: 100000; + } + + .main-navigation ul li.menu-item-has-children.focus:before, + .main-navigation ul li.menu-item-has-children:hover:before, + .main-navigation ul li.menu-item-has-children.focus:after, + .main-navigation ul li.menu-item-has-children:hover:after, + .main-navigation ul li.page_item_has_children.focus:before, + .main-navigation ul li.page_item_has_children:hover:before, + .main-navigation ul li.page_item_has_children.focus:after, + .main-navigation ul li.page_item_has_children:hover:after { + display: block; + } + + .main-navigation ul li.menu-item-has-children:before, + .main-navigation ul li.page_item_has_children:before { + border-color: transparent transparent #bbb; + bottom: 0; + } + + .main-navigation ul li.menu-item-has-children:after, + .main-navigation ul li.page_item_has_children:after { + border-color: transparent transparent #fff; + } + + .main-navigation ul ul li:hover > ul, + .main-navigation ul ul li.focus > ul { + left: 100%; + right: auto; + } + + .main-navigation ul ul a { + padding: 0.75em 1.25em; + width: 16em; + } + + .main-navigation li li { + -webkit-transition: background-color 0.2s ease-in-out; + transition: background-color 0.2s ease-in-out; + } + + .main-navigation li li:hover, + .main-navigation li li.focus { + background: #767676; + } + + .main-navigation li li a { + -webkit-transition: color 0.3s ease-in-out; + transition: color 0.3s ease-in-out; + } + + .main-navigation li li.focus > a, + .main-navigation li li:focus > a, + .main-navigation li li:hover > a, + .main-navigation li li a:hover, + .main-navigation li li a:focus, + .main-navigation li li.current_page_item a:hover, + .main-navigation li li.current-menu-item a:hover, + .main-navigation li li.current_page_item a:focus, + .main-navigation li li.current-menu-item a:focus { + color: #fff; + } + + .main-navigation ul li:hover > ul, + .main-navigation ul li.focus > ul { + left: 0.5em; + right: auto; + } + + .main-navigation .menu-item-has-children > a > .icon, + .main-navigation .page_item_has_children > a > .icon { + display: inline; + left: 5px; + position: relative; + top: -2px; + } + + .main-navigation ul ul .menu-item-has-children > a > .icon, + .main-navigation ul ul .page_item_has_children > a > .icon { + margin-top: -9px; + left: auto; + position: absolute; + right: 1em; + top: 50%; + -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */ + -ms-transform: rotate(-90deg); /* IE 9 */ + transform: rotate(-90deg); + } + + .main-navigation ul ul ul { + left: -999em; + margin-top: -1px; + top: 0; + } + + .main-navigation ul ul li.menu-item-has-children.focus:before, + .main-navigation ul ul li.menu-item-has-children:hover:before, + .main-navigation ul ul li.menu-item-has-children.focus:after, + .main-navigation ul ul li.menu-item-has-children:hover:after, + .main-navigation ul ul li.page_item_has_children.focus:before, + .main-navigation ul ul li.page_item_has_children:hover:before, + .main-navigation ul ul li.page_item_has_children.focus:after, + .main-navigation ul ul li.page_item_has_children:hover:after { + display: none; + } + + .site-navigation-fixed.navigation-top .menu-scroll-down { + display: none; + } + + /* Scroll down arrow */ + + .navigation-top .menu-scroll-down { + color: #767676; + display: block; + padding: 0.5em 0.5em 0.4em; + position: absolute; + right: 0; + top: 0.9em; + -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */ + -ms-transform: rotate(90deg); /* IE 9 */ + transform: rotate(90deg); + } + + .menu-scroll-down:focus { + outline: thin dotted; + } + + .menu-scroll-down .icon { + height: 32px; + height: 2rem; + width: 32px; + width: 2rem; + } + + /* Front Page */ + + .twentyseventeen-front-page.has-header-image .site-branding, + .home.blog.has-header-image .site-branding { + margin-bottom: 70px; + } + + .twentyseventeen-front-page.has-header-image .custom-header-image, + .home.blog.has-header-image .custom-header-image { + height: 1200px; + height: 100vh; + max-height: 100%; + padding: 10% 0; + } + + .twentyseventeen-front-page.has-header-image .custom-header-image:before, + .home.blog.has-header-image .custom-header-image:before { + height: 33%; + } + + .admin-bar.twentyseventeen-front-page.has-header-image .custom-header-image, + .admin-bar.home.blog.has-header-image .custom-header-image { + height: calc(100vh - 32px); + } + + .panel-content .wrap { + padding-bottom: 4.5em; + padding-top: 6em; + } + + .panel-image { + height: 100vh; + max-height: 1200px; + } + + .page-two-column .panel-content .entry-header { + float: left; + width: 36%; + } + + .page-two-column .panel-content .entry-content { + float: right; + width: 58%; + } + + /* Front Page - Recent Posts */ + + .page-two-column .panel-content .recent-posts { + clear: right; + float: right; + width: 58%; + } + + .panel-content .recent-posts article { + margin-bottom: 4em; + } + + .panel-content .recent-posts .entry-header, + .page-two-column #primary .panel-content .recent-posts .entry-header, + .panel-content .recent-posts .entry-content, + .page-two-column #primary .panel-content .recent-posts .entry-content { + float: none; + width: 100%; + } + + .panel-content .recent-posts .entry-header { + margin-bottom: 1.5em; + } + + .page .panel-content .recent-posts .entry-title { + font-size: 26px; + font-size: 1.625rem; + } + + /* Posts */ + + .site-content { + padding: 6.5em 0 0; + } + + .single-post .entry-title, + .page .entry-title { + font-size: 26px; + font-size: 1.625rem; + } + + .comments-pagination, + .post-navigation { + clear: both; + } + + .post-navigation .nav-previous { + float: left; + width: 50%; + } + + .post-navigation .nav-next { + float: right; + text-align: right; + width: 50%; + } + + .nav-next, + .post-navigation .nav-next { + margin-top: 0; + } + + /* Blog, archive, search */ + + .sticky .icon { + height: 32px; + left: -2.5em; + top: 1.5em; + width: 32px; + } + + body:not(.has-sidebar) .page-header, + body.has-sidebar.error404 #primary .page-header, + body.page-two-column #primary .entry-header { + float: left; + width: 36%; + } + + .blog:not(.has-sidebar) #primary article, + .archive:not(.has-sidebar) #primary article, + .search:not(.has-sidebar) #primary article, + .error404:not(.has-sidebar) #primary .page-content, + .error404.has-sidebar #primary .page-content, + body.page-two-column #primary .entry-content { + float: right; + width: 58%; + } + + .blog .site-main > article, + .archive .site-main > article, + .search .site-main > article { + padding-bottom: 4em; + } + + .navigation.pagination { + clear: both; + float: right; + width: 58%; + } + + .has-sidebar .navigation.pagination { + float: none; + width: 100%; + } + + .entry-footer { + display: table; + width: 100%; + } + + .entry-footer .cat-tags-links { + display: table-cell; + vertical-align: middle; + width: 100%; + } + + .entry-footer .edit-link { + display: table-cell; + text-align: right; + vertical-align: middle; + } + + .entry-footer .edit-link a.post-edit-link { + margin-top: 0; + margin-left: 1em; + } + + /* Entry content */ + + /* without sidebar */ + + :not(.has-sidebar) .entry-content blockquote.alignleft { + margin-left: -17.5%; + width: 48%; + } + + :not(.has-sidebar) .entry-content blockquote.alignright { + margin-right: -17.5%; + width: 48%; + } + + /* with sidebar */ + + .has-sidebar .entry-content blockquote.alignleft { + margin-left: 0; + width: 34%; + } + + .has-sidebar .entry-content blockquote.alignright { + margin-right: 0; + width: 34%; + } + + .has-sidebar #primary .entry-content blockquote.alignright.below-entry-meta { + margin-right: -72.5%; + width: 62%; + } + + /* blog and archive */ + + .blog:not(.has-sidebar) .entry-content blockquote.alignleft, + .twentyseventeen-front-page.page-two-column .entry-content blockquote.alignleft, + .archive:not(.has-sidebar) .entry-content blockquote.alignleft, + .page-two-column .entry-content blockquote.alignleft { + margin-left: -72.5%; + width: 62%; + } + + .blog:not(.has-sidebar) .entry-content blockquote.alignright, + .twentyseventeen-front-page.page-two-column .entry-content blockquote.alignright, + .archive:not(.has-sidebar) .entry-content blockquote.alignright, + .page-two-column .entry-content blockquote.alignright { + margin-right: 0; + width: 36%; + } + + /* Post formats */ + + .format-quote blockquote .icon { + left: -1.5em; + } + + /* Pages */ + + .page-one-column .entry-header { + margin-bottom: 4em; + } + + /* 404 page */ + + .error404 .page-content { + padding-bottom: 9em; + } + + /* Comments */ + + #comments { + padding-top: 5em; + } + + .comments-title { + margin-bottom: 2.5em; + } + + ol.children .children { + padding-left: 2em; + } + + /* Posts pagination */ + + .nav-links .nav-title { + position: relative; + } + + .nav-title-icon-wrapper { + position: absolute; + text-align: center; + width: 2em; + } + + .nav-links .nav-previous .nav-title .nav-title-icon-wrapper { + left: -2em; + } + + .nav-links .nav-next .nav-title .nav-title-icon-wrapper { + right: -2em; + } + + /* Secondary */ + + #secondary { + font-size: 14px; + font-size: 0.875rem; + line-height: 1.6; + } + + /* Widgets */ + + h2.widget-title { + font-size: 11px; + font-size: 0.6875rem; + margin-bottom: 2em; + } + + /* Footer */ + + .site-footer { + font-size: 14px; + font-size: 0.875rem; + line-height: 1.6; + margin-top: 3em; + } + + .site-footer .widget-column.footer-widget-1 { + float: left; + width: 36%; + } + + .site-footer .widget-column.footer-widget-2 { + float: right; + width: 58%; + } + + .social-navigation { + clear: left; + float: left; + margin-bottom: 0; + width: 36%; + } + + .site-info { + float: left; + padding: 0.7em 0 0; + width: 58%; + } + + .social-navigation + .site-info { + margin-left: 6%; + } + + .site-info .sep { + margin: 0 0.5em; + display: inline; + visibility: visible; + height: auto; + width: auto; + } + + /* Gallery Columns */ + + .gallery-columns-5 .gallery-item { + max-width: 20%; + } + + .gallery-columns-6 .gallery-item { + max-width: 16.66%; + } + + .gallery-columns-7 .gallery-item { + max-width: 14.28%; + } + + .gallery-columns-8 .gallery-item { + max-width: 12.5%; + } + + .gallery-columns-9 .gallery-item { + max-width: 11.11%; + } +} + +@media screen and ( min-width: 55em ) { + + .twentyseventeen-front-page.has-header-image .custom-header-image, + .home.blog.has-header-image .custom-header-image { + background-attachment: fixed; + } + + .panel-image { + background-attachment: fixed; + } +} + +@media screen and ( min-width: 67em ) { + + /* Layout */ + + /* Navigation */ + .navigation-top .wrap { + padding: 0.75em 2em; + } + + .navigation-top nav { + margin-left: 0; + } + + /* Sticky posts */ + + .sticky .icon-pinned { + font-size: 32px; + font-size: 2rem; + height: 32px; + left: -1.25em; + top: 0.75em; + width: 32px; + } + + /* Comments */ + + .comment-body { + margin-left: 0; + } +} + +@media screen and ( min-width: 79em ) { + + .has-sidebar .entry-content blockquote.alignleft { + margin-left: -20%; + } + + .blog:not(.has-sidebar) .entry-content blockquote.alignright, + .archive:not(.has-sidebar) .entry-content blockquote.alignright, + .page-two-column .entry-content blockquote.alignright, + .twentyseventeen-front-page .entry-content blockquote.alignright { + margin-right: -20%; + } +} + +@media screen and ( max-width: 48.875em ) and ( min-width: 48em ) { + + .admin-bar .site-navigation-fixed.navigation-top, + .admin-bar .site-navigation-hidden.navigation-top { + top: 46px; + } +} + +/*-------------------------------------------------------------- +# Print +--------------------------------------------------------------*/ + +@media print { + + /* Hide elements */ + + form, + button, + input, + select, + textarea, + .navigation-top, + .social-navigation, + #secondary, + .content-bottom-widgets, + .header-image, + .panel-image-prop, + .icon-pinned, + .page-links, + .edit-link, + .post-navigation, + .pagination.navigation, + .comments-pagination, + .comment-respond, + .comment-edit-link, + .comment-reply-link, + .comment-metadata .edit-link, + .pingback .edit-link, + .site-footer aside.widget-area, + .site-info { + display: none !important; + } + + .entry-footer, + #comments, + .site-footer, + .single-featured-image-header { + border: 0; + } + + /* Font sizes */ + + body { + font-size: 12pt; + } + + h1 { + font-size: 24pt; + } + + h2 { + font-size: 22pt; + } + + h3 { + font-size: 17pt; + } + + h4 { + font-size: 12pt; + } + + h5 { + font-size: 11pt; + } + + h6 { + font-size: 12pt; + } + + .page .panel-content .entry-title, + .page-title, + body.page:not(.twentyseventeen-front-page) .entry-title { + font-size: 10pt; + } + + /* Layout */ + + .wrap { + padding-left: 5% !important; + padding-right: 5% !important; + max-width: none; + } + + /* Site Branding */ + + .site-header { + background: transparent; + padding: 0; + } + + .custom-header-image { + padding: 0; + } + + .twentyseventeen-front-page.has-header-image .site-branding, + .home.blog.has-header-image .site-branding { + position: relative; + } + + .site-branding { + margin-top: 0; + margin-bottom: 1.75em !important; /* override styles added by JavaScript */ + } + + .site-title { + font-size: 25pt; + } + + .site-description { + font-size: 12pt; + opacity: 1; + } + + /* Posts */ + + .single-featured-image-header { + background: transparent; + } + + .entry-meta { + font-size: 9pt; + } + + /* Colors */ + + body, + .site { + background: none !important; /* Brute force since user agents all print differently. */ + } + + body, + a, + .site-title a, + .twentyseventeen-front-page.has-header-image .site-title, + .twentyseventeen-front-page.has-header-image .site-title a { + color: #222 !important; /* Make sure color schemes don't affect to print */ + } + + h2, + h5, + blockquote, + .site-description, + .twentyseventeen-front-page.has-header-image .site-description, + .entry-meta, + .entry-meta a { + color: #777 !important; /* Make sure color schemes don't affect to print */ + } + + .entry-content blockquote.alignleft, + .entry-content blockquote.alignright { + font-size: 11pt; + width: 34%; + } + + .site-footer { + padding: 0; + } +}