new theme: micro (https://github.com/xavortm/wp-theme-micro)

wp-content/themes/micro/404.php

+<?php
+/**
+ * The template for displaying 404 pages (not found).
+ *
+ * @link https://codex.wordpress.org/Creating_an_Error_404_Page
+ *
+ * @package Micro
+ */
+
+get_header(); ?>
+
+	<section class="section-fullwidth section-main">
+		<div class="row">
+			<div class="columns small-12">
+				<div id="primary" class="content-area">
+					<main id="main" class="site-main">
+
+						<div class="error-404 not-found">
+							<header class="page-header">
+								<h1 class="page-title"><?php esc_html_e( 'Oops! That page can&rsquo;t be found.', 'micro' ); ?></h1>
+							</header><!-- .page-header -->
+
+							<div class="page-content">
+								<p><?php esc_html_e( 'It looks like nothing was found at this location. Maybe try one of the links below or a search?', 'micro' ); ?></p>
+
+								<?php
+								get_search_form();
+
+								the_widget( 'WP_Widget_Recent_Posts' );
+
+								// Only show the widget if site has multiple categories.
+								if ( micro_categorized_blog() ) :
+								?>
+
+								<div class="widget widget_categories">
+									<h2 class="widget-title"><?php esc_html_e( 'Most Used Categories', 'micro' ); ?></h2>
+									<ul>
+									<?php
+										wp_list_categories( array(
+											'orderby'    => 'count',
+											'order'      => 'DESC',
+											'show_count' => 1,
+											'title_li'   => '',
+											'number'     => 10,
+										) );
+									?>
+									</ul>
+								</div><!-- .widget -->
+
+								<?php
+								endif;
+
+								/* translators: %1$s: smiley */
+								$archive_content = '<p>' . sprintf( esc_html__( 'Try looking in the monthly archives. %1$s', 'micro' ), convert_smilies( ':)' ) ) . '</p>';
+								the_widget( 'WP_Widget_Archives', 'dropdown=1', "after_title=</h2>$archive_content" );
+
+								the_widget( 'WP_Widget_Tag_Cloud' );
+								?>
+
+							</div><!-- .page-content -->
+						</div><!-- .error-404 -->
+
+					</main><!-- #main -->
+				</div><!-- #primary -->
+			</div><!-- .columns small-12 -->
+		</div><!-- .row -->
+	</section><!-- .section-fullwidth section-main -->
+
+<?php
+get_footer();

wp-content/themes/micro/Gulpfile.js

+var gulp = require('gulp'),
+    autoprefixer = require('gulp-autoprefixer'),
+	livereload = require('gulp-livereload'),
+    sass = require('gulp-sass'),
+	notify = require('gulp-notify'),
+	uglify = require('gulp-uglify'),
+	concat = require('gulp-concat'),
+	cssmin = require('gulp-cssmin'),
+    rename = require('gulp-rename'),
+	imagemin = require('gulp-imagemin'),
+	del = require('del'),
+	moment = require('moment');
+
+gulp.task('sass', function(){
+	return gulp.src('assets/sass/**/*.scss')
+	    .pipe(sass())
+		.pipe(autoprefixer())
+    	.pipe(gulp.dest('assets/css/'))
+    	.pipe(livereload({ start: true }))
+		.pipe(notify({
+			onLast: true,
+			title: "Sass compiled successfully.",
+			message: getFormatDate()
+		}));
+});
+
+gulp.task('scripts', function() {
+	return gulp.src('assets/scripts/scripts.js')
+		.pipe(uglify())
+		.pipe(gulp.dest('./'))
+		.pipe(notify({ message: 'Scripts task complete <%= file.relative %>' }));
+});
+
+gulp.task('cssmin', function () {
+	gulp.src('assets/css/master.css')
+		.pipe(cssmin())
+		.pipe(rename({suffix: '.min'}))
+		.pipe(gulp.dest('assets/css'))
+		.pipe(notify({ message: 'Successfully minified master.min.css' }));
+});
+
+// The files to be watched for minifying. If more dev js files are added this
+// will have to be updated.
+gulp.task('watch', ['sass', 'scripts'], function() {
+	livereload.listen();
+
+	gulp.watch('assets/sass/**/*.scss', ['sass']);
+	gulp.watch('assets/scripts/scripts.js', ['scripts', 'minifyScripts']);
+	gulp.watch('assets/css/master.css', ['cssmin']);
+});
+
+// First combine, then minify all the listed scripts in two files.
+// bundle.js - non-minified version for easy look on the size (development)
+// bundle.min.js - minified version (production)
+gulp.task('minifyScripts', function () {
+
+	// Add separate folders if required.
+	gulp.src([
+			'assets/scripts/vendor/*.js',
+			'assets/scripts/inc/*.js',
+			'assets/scripts/scripts.js',
+		])
+		.pipe(concat('bundle.js'))
+		.pipe(gulp.dest('assets/scripts/'))
+		.pipe(rename('bundle.min.js'))
+		.pipe(uglify())
+		.pipe(gulp.dest('assets/scripts/'));
+});
+
+// What will be run with simply writing "$ gulp"
+gulp.task('default', ['sass', 'watch', 'minifyScripts', 'cssmin']);
+
+
+// Print the current date formatted. Used for the script compile notify messages.
+function getFormatDate() {
+	var currentTime = moment().format("LTS");
+
+	return currentTime;
+}

wp-content/themes/micro/archive.php

+<?php
+/**
+ * The template for displaying archive pages.
+ *
+ * @link https://codex.wordpress.org/Template_Hierarchy
+ *
+ * @package Micro
+ */
+
+get_header(); ?>
+
+	<section class="section-fullwidth section-main">
+		<div class="row">
+			<div class="columns small-12 medium-8">
+				<div id="primary" class="content-area">
+					<main id="main" class="site-main">
+
+					<?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
+						/* 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/content', get_post_format() );
+
+						endwhile;
+
+						the_posts_navigation();
+
+					else :
+
+						get_template_part( 'template-parts/content', 'none' );
+
+					endif; ?>
+
+					</main><!-- #main -->
+				</div><!-- #primary -->
+			</div><!-- .columns small-12 medium-8 -->
+			<div class="columns small-12 medium-4">
+				<?php get_sidebar(); ?>
+			</div><!-- .columns small-12 medium-4 -->
+		</div><!-- .row -->
+	</section><!-- .section-fullwidth section-main -->
+
+<?php
+get_footer();

wp-content/themes/micro/assets/css/editor-style.css

+body {
+  font-family: "Monaco", "PT Mono", "Consolas", "courier new"; }

wp-content/themes/micro/assets/images/menu-icon.svg

+<?xml version="1.0" ?><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg enable-background="new 0 0 32 32" height="32px" id="Слой_1" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="Menu"><path d="M1,7h30c0.552,0,1-0.448,1-1c0-0.552-0.448-1-1-1H1C0.448,5,0,5.448,0,6C0,6.552,0.448,7,1,7z" fill="#ffffff"/><path d="M31,15H1c-0.552,0-1,0.448-1,1c0,0.552,0.448,1,1,1h30c0.552,0,1-0.448,1-1C32,15.448,31.552,15,31,15z" fill="#ffffff"/><path d="M31,25H1c-0.552,0-1,0.448-1,1c0,0.552,0.448,1,1,1h30c0.552,0,1-0.448,1-1C32,25.448,31.552,25,31,25z" fill="#ffffff"/></g><g/><g/><g/><g/><g/><g/></svg>

wp-content/themes/micro/assets/sass/base/_general.scss

+// Allowing to run foundation.js file
+meta.foundation-data-attribute-namespace { font-family: false; }
+
+html {
+	box-sizing: border-box;
+	-webkit-font-smoothing: antialiased;
+}
+
+*, *:before, *:after {
+	box-sizing: inherit;
+}
+
+// Add margin-top to body tag when admin-bar is visible.
+body.admin-bar {
+	padding-top: 32px;
+	@media (max-width: 782px) { padding-top: 46px; }
+}
+
+body {
+	font-family: $font-primary;
+	font-size: $global-font-size;
+	line-height: 1.4;
+	color: $color-text;
+	background: $color-background;
+}
+
+/**
+ * Since this is dashboard layout we need 100% width on all
+ * elements, so there is no empty space left.
+ */
+.row {
+	max-width: 100%;
+	width: 100%;
+}
+
+p:first-child {
+	margin-top: 0;
+}
+
+p:last-child {
+	margin-bottom: 0;
+}
+
+a {
+	text-decoration: underline;
+	color: $color-link;
+
+	&:hover {
+		color: $color-background;
+		background-color: $color-text;
+	}
+}
+
+h1,h2,h3,h4,h5 {
+	line-height: 1.2;
+	font-family: $font-heading;
+
+	// Removes the default margins from the headings.
+	// Add this customly for entry content if needed.
+	margin: 0;
+}
+
+h1 {}
+h2 {}
+h3 {}
+h4 {}
+h5 {}
+
+blockquote {
+	font-style: italic;
+}
+
+hr {
+	height: 1px;
+	border: none;
+	width: 100%;
+	background: #f0f0f0;
+}
+
+// Required WordPress stylings
+img.alignright {
+	margin: 20px 0 20px 20px;
+}
+
+img.alignleft {
+	margin: 20px 20px 20px 0;
+}
+
+img.aligncenter {
+	margin: 20px auto;
+}
+
+img {
+	max-width: 100%;
+	height: auto;
+}
+
+/**
+ * Required classes by WordPress. To pass the theme check
+ * stylings to those must be applied, since the SASS watch
+ * script is skipping classes that have no properties.
+ */
+.sticky { display: block; }
+.bypostauthor { display: block; }
+
+.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;
+}
+
+ol, ul {
+	margin: 0;
+	padding: 0;
+	list-style-type: none;
+}
+
+.screen-reader-text {
+	clip: rect(1px, 1px, 1px, 1px);
+	position: absolute !important;
+	height: 1px;
+	width: 1px;
+	overflow: hidden;
+}
+
+.screen-reader-text:focus {
+	background-color: #f1f1f1;
+	border-radius: 3px;
+	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
+	clip: auto !important;
+	color: #21759b;
+	display: block;
+	font-size: 14px;
+	font-size: 0.875rem;
+	font-weight: bold;
+	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;
+}
+
+// Media
+.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 {
+	max-width: 100%;
+}
+
+
+// Captions
+.wp-caption {
+	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;
+}
+
+.wp-caption-text {
+	text-align: center;
+}
+
+// Gallery defaults
+.gallery {
+	margin-bottom: 1.5em;
+}
+
+.gallery-item {
+	display: inline-block;
+	text-align: center;
+	vertical-align: top;
+	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%;
+}
+
+.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;
+}
+
+// ==========================================================================
+// Basic stylings
+// ==========================================================================
+
+button,
+input,
+select,
+textarea {
+	font-size: 16px;
+	font-size: 1rem;
+	line-height: 1.5;
+	max-width: 100%;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	clear: both;
+}
+
+p {
+	margin-bottom: 1.5em;
+}
+
+dfn,
+cite,
+em,
+i {
+	font-style: italic;
+}
+
+blockquote {
+	margin: 0 1.5em;
+}
+
+address {
+	margin: 0 0 1.5em;
+}
+
+pre {
+	background: #000;
+	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;
+	background: black;
+}
+
+abbr,
+acronym {
+	border-bottom: 1px dotted #666;
+	cursor: help;
+}
+
+mark,
+ins {
+	background: black;
+	border: 1px solid $color-text;
+	text-decoration: none;
+}
+
+big {
+	font-size: 125%;
+}
+
+dt {
+	font-weight: bold;
+}
+
+dd {
+	margin: 0 1.5em 1.5em;
+}
+table {
+	margin: 0 0 1.5em;
+	width: 100%;
+}
\ No newline at end of file

wp-content/themes/micro/assets/sass/base/_helpers.scss

+/**
+ * Place ul element in the middle of its parent. The structure
+ * .center-ul > ul must be followed in order to work. (uds)
+ */
+.center-ul{
+	text-align: center;
+	& > ul { display: inline-block; }
+}
+