First commit -> files styles added (theme + scss)

404.php

+<?php
+/**
+ * The template for displaying 404 pages (not found)
+ *
+ * @link https://codex.wordpress.org/Creating_an_Error_404_Page
+ *
+ * @package WordPress
+ * @subpackage Twenty_Seventeen
+ * @since 1.0
+ * @version 1.0
+ */
+
+get_header(); ?>
+
+<div class="wrap">
+ <div id="primary" class="content-area">
+ <main id="main" class="site-main" role="main">
+
+ <section class="error-404 not-found">
+ <header class="page-header">
+ <h1 class="page-title"><?php _e( 'Oops! That page can&rsquo;t be found.', 'twentyseventeen' ); ?></h1>
+ </header><!-- .page-header -->
+ <div class="page-content">
+ <p><?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentyseventeen' ); ?></p>
+
+ <?php get_search_form(); ?>
+
+ </div><!-- .page-content -->
+ </section><!-- .error-404 -->
+ </main><!-- #main -->
+ </div><!-- #primary -->
+</div><!-- .wrap -->
+
+<?php
+get_footer();

README.txt

+=== Twenty Seventeen ===
+Contributors: the WordPress team
+Requires at least: WordPress 4.7
+Tested up to: WordPress 5.0-trunk
+Version: 1.7
+License: GPLv2 or later
+License URI: http://www.gnu.org/licenses/gpl-2.0.html
+Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
+
+== Description ==
+
+Twenty Seventeen brings your site to life with header video and immersive featured images. With a focus on business sites, it features multiple sections on the front page as well as widgets, navigation and social menus, a logo, and more. Personalize its asymmetrical grid with a custom color scheme and showcase your multimedia content with post formats. Our default theme for 2017 works great in many languages, for any abilities, and on any device.
+
+For more information about Twenty Seventeen please go to https://codex.wordpress.org/Twenty_Seventeen.
+
+== Installation ==
+
+1. In your admin panel, go to Appearance -> 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, 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.7 =
+* Released: August 2, 2018
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.7
+
+= 1.6 =
+* Released: May 17, 2018
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.6
+
+= 1.5 =
+* Released: April 4, 2018
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.5
+
+= 1.4 =
+* Released: November 14, 2017
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.4
+
+= 1.3 =
+* Released: June 8, 2017
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.3
+
+= 1.2 =
+* Released: April 18, 2017
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.2
+
+= 1.1 =
+* Released: January 6, 2017
+
+https://codex.wordpress.org/Twenty_Seventeen_Theme_Changelog#Version_1.1
+
+= 1.0 =
+* Released: December 6, 2016
+
+Initial release

archive.php

+<?php
+/**
+ * The template for displaying archive pages
+ *
+ * @link https://codex.wordpress.org/Template_Hierarchy
+ *
+ * @package WordPress
+ * @subpackage Twenty_Seventeen
+ * @since 1.0
+ * @version 1.0
+ */
+
+get_header(); ?>
+
+<div class="wrap">
+
+ <?php if ( have_posts() ) : ?>
+ <header class="page-header">
+ <?php
+ the_archive_title( '<h1 class="page-title">', '</h1>' );
+ the_archive_description( '<div class="taxonomy-description">', '</div>' );
+ ?>
+ </header><!-- .page-header -->
+ <?php endif; ?>
+
+ <div id="primary" class="content-area">
+ <main id="main" class="site-main" role="main">
+
+ <?php
+ if ( have_posts() ) :
+ ?>
+ <?php
+ /* Start the Loop */
+ while ( have_posts() ) :
+ the_post();
+
+ /*
+ * Include the Post-Format-specific template for the content.
+ * If you want to override this in a child theme, then include a file
+ * called content-___.php (where ___ is the Post Format name) and that will be used instead.
+ */
+ get_template_part( 'template-parts/post/content', get_post_format() );
+
+ endwhile;
+
+ the_posts_pagination(
+ array(
+ 'prev_text' => twentyseventeen_get_svg( array( 'icon' => 'arrow-left' ) ) . '<span class="screen-reader-text">' . __( 'Previous page', 'twentyseventeen' ) . '</span>',
+ 'next_text' => '<span class="screen-reader-text">' . __( 'Next page', 'twentyseventeen' ) . '</span>' . twentyseventeen_get_svg( array( 'icon' => 'arrow-right' ) ),
+ 'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'twentyseventeen' ) . ' </span>',
+ )
+ );
+
+ else :
+
+ get_template_part( 'template-parts/post/content', 'none' );
+
+ endif;
+ ?>
+
+ </main><!-- #main -->
+ </div><!-- #primary -->
+ <?php get_sidebar(); ?>
+</div><!-- .wrap -->
+
+<?php
+get_footer();

assets/css/custom.css

+.custom-header {
+ position: absolute !important;
+}
\ No newline at end of file

assets/css/editor-style.css

+/*
+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 {
+ 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;
+ text-align: left;
+}
+
+tr {
+ border-bottom: 1px solid #eee;
+}
+
+td {
+ padding: 0.4em;
+}
+
+th:first-child,
+td:first-child {
+ padding-left: 0;
+}
+
+th:last-child,
+td:last-child {
+ padding-right: 0;
+}
+
+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;
+}
+