jekyll-theme-simple-texture 0.1.0

data/_sass/simple-texture/blog/_footer.scss

@@ -0,0 +1,81 @@
+.the-footer {
+    font-size: .9em;
+    line-height: 1.6em;
+
+    padding: 26px;
+
+    text-align: center;
+
+    a {
+        color: $color-text;
+
+        &:hover {
+            -webkit-transition: all .3s ease-in-out;
+               -moz-transition: all .3s ease-in-out;
+                 -o-transition: all .3s ease-in-out;
+                    transition: all .3s ease-in-out;
+
+            color: $color-hover;
+        }
+    }
+
+    p {
+        a {
+            padding: 2px 3px;
+
+            color: #0077CC;
+            border-bottom: 1px dotted #FFD18D;
+
+            &:visited {
+                color: #4A6B82;
+            }
+
+            &:hover {
+                color: $color-text;
+                background-color: $color-hover-transparent;
+            }
+        }
+    }
+
+    h4 {
+        margin-top: 0;
+
+        a:hover {
+            font-weight: bold;
+        }
+    }
+
+    .back-to-top {
+        font-size: .9em;
+
+        position: fixed;
+        right: .25em;
+        bottom: .5em;
+
+        display: none;
+
+        padding: 1.2em 1.2em .2em;
+
+        text-decoration: none;
+
+        background-color: transparent;
+    }
+
+    .social-links {
+        margin-top: 12px;
+
+        $icon-size: 42px;
+
+        a {
+            display: inline-block;
+
+            width: $icon-size;
+            height: $icon-size;
+            margin: 1.5px;
+
+            background-size: $icon-size $icon-size;
+        }
+    }
+}
+
+@import 'simple-texture/common/social-icons';

data/_sass/simple-texture/blog/_header.scss

@@ -0,0 +1,79 @@
+.the-header .unit-head {
+    padding: 26px;
+    padding-bottom: 12px;
+
+    text-align: center;
+
+    .nav-global {
+        .logo {
+            font-family: $fonts-heading;
+            font-weight: bold;
+
+            display: block;
+
+            padding-bottom: 18px;
+
+            a {
+                font-size: 1.5em;
+                line-height: 0;
+
+                display: inline;
+
+                margin-left: 8px;
+
+                &:hover {
+                    color: $color-hover;
+                    background-color: transparent;
+                }
+            }
+
+            button {
+                display: none;
+
+                width: 24px;
+                height: 24px;
+
+                border: none;
+            }
+
+            .btn-menu {
+                float: left;
+
+                background: url('/assets/images/theme/btn-menu.png') no-repeat;
+            }
+
+            .btn-search {
+                float: right;
+
+                background: url('/assets/images/theme/btn-search.png') no-repeat;
+            }
+        }
+
+        ul {
+            margin: 0;
+            padding: 0;
+
+            li {
+                display: inline;
+
+                a {
+                    padding: 12px;
+                    padding-bottom: 18px;
+
+                    color: $color-text;
+                }
+
+                a:active,
+                a:hover {
+                    cursor: pointer;
+                    -webkit-transition: all .3s ease-in-out;
+                       -moz-transition: all .3s ease-in-out;
+                         -o-transition: all .3s ease-in-out;
+                            transition: all .3s ease-in-out;
+
+                    background-color: $color-hover;
+                }
+            }
+        }
+    }
+}

data/_sass/simple-texture/blog/_overlay.scss

@@ -0,0 +1,196 @@
+.site-notice {
+    text-align: center;
+
+    color: $color-text;
+
+    a {
+        font-size: .95em;
+
+        padding-right: 3px;
+        padding-left: 3px;
+
+        color: #0077CC;
+        border-bottom: 1px dotted #FFD18D;
+
+        &:hover {
+            -webkit-transition: all .3s ease-out;
+               -moz-transition: all .3s ease-out;
+                 -o-transition: all .3s ease-out;
+                    transition: all .3s ease-out;
+
+            color: $color-text;
+            background-color: $color-hover;
+        }
+
+        &:visited {
+            color: #4A6B82;
+        }
+    }
+}
+
+body.nav-overlay,
+body.search-overlay {
+    overflow: hidden;
+
+    &:after {
+        position: fixed;
+        z-index: 9001;
+        top: 0;
+        left: 0;
+
+        width: 100%;
+        height: 100%;
+        min-height: 100%;
+
+        content: '';
+
+        background-color: rgba(25, 25, 25, .95);
+    }
+}
+
+.overlay-wrapper {
+    position: absolute;
+    top: 50px;
+
+    display: none;
+    zoom: 1;
+
+    width: 90%;
+    padding-right: 5%;
+    padding-left: 5%;
+}
+
+.overlay-form {
+    position: relative;
+    z-index: 9002;
+    top: 0;
+    left: -200px;
+
+    width: 100%;
+
+    opacity: 0;
+
+    &.active {
+        top: 0;
+        left: 0;
+
+        opacity: 1;
+    }
+
+    a,
+    h1,
+    h2,
+    h3,
+    h4,
+    li,
+    ol,
+    dl,
+    p,
+    span,
+    button,
+    input {
+        color: #FFFFFF;
+    }
+
+    .overlay-header {
+        font-size: 2em;
+
+        border: none;
+        border-bottom: 1px solid #FFFFFF;
+        background-color: transparent;
+    }
+
+    .search-field {
+        width: 100%;
+        padding-bottom: 12px;
+
+        background-clip: padding-box;
+        box-shadow: none;
+
+        -webkit-appearance: none;
+           -moz-appearance: none;
+                appearance: none;
+    }
+
+    .menu {
+        display: block;
+
+        margin-left: 18px;
+        padding-bottom: 16px;
+
+        text-align: center;
+    }
+
+    .btn-close {
+        position: absolute;
+        z-index: 1;
+        top: .6rem;
+        right: 1rem;
+
+        display: block;
+
+        width: auto;
+        height: auto;
+
+        cursor: pointer;
+        text-align: center;
+
+        &:hover {
+            font-weight: bold;
+
+            -webkit-transition: all .3s ease-in-out;
+               -moz-transition: all .3s ease-in-out;
+                 -o-transition: all .3s ease-in-out;
+                    transition: all .3s ease-in-out;
+        }
+    }
+
+    .results {
+        position: absolute;
+
+        width: 100%;
+        margin: 0;
+        padding: 0;
+
+        outline: 0;
+        text-shadow: none;
+
+        .entry-date {
+            display: none;
+            float: right;
+        }
+
+        li {
+            font-size: 1em;
+
+            margin-left: 12px;
+            padding: 3px;
+
+            &:hover {
+                -webkit-transition: all .3s ease-in-out;
+                   -moz-transition: all .3s ease-in-out;
+                     -o-transition: all .3s ease-in-out;
+                        transition: all .3s ease-in-out;
+
+                border: 1px dashed #FFFFFF;
+            }
+        }
+    }
+}
+
+.nav-form .results {
+    ul {
+        padding: 0;
+        li {
+            list-style: none;
+            a {
+                display: block;
+
+                margin-right: auto;
+                margin-left: auto;
+
+                text-align: center;
+            }
+        }
+    }
+}

data/_sass/simple-texture/blog/_responsive.scss

@@ -0,0 +1,92 @@
+/*
+	Old mobile phone width: [0, 640]
+*/
+@media only screen and (max-width: 640px) {
+    body {
+        font-size: .8em;
+        line-height: 24px;
+    }
+
+    h2,
+    h3,
+    h4 {
+        margin-top: 16px;
+        margin-bottom: 16px;
+    }
+
+    h1,
+    h2 {
+        line-height: 32px;
+    }
+
+    .the-header .unit-head {
+        padding: 16px;
+        padding-bottom: 8px;
+
+        .nav-global .logo {
+            padding-bottom: 0;
+
+            a {
+                margin-left: 14px;
+                padding-top: 6px;
+                padding-bottom: 6px;
+            }
+
+            .btn-menu,
+            .btn-search {
+                display: inline;
+
+                cursor: pointer;
+            }
+        }
+
+        .nav-global ul li {
+            display: none;
+
+            .btn-search {
+                display: none;
+            }
+        }
+    }
+
+    .the-footer .social-links a {
+        width: 24px;
+        height: 24px;
+
+        background-size: 24px 24px;
+    }
+}
+
+/*
+	Smartphone width: [0, 1200]
+*/
+@media only screen and (max-width: 1200px) {
+    .unit-article {
+        .year,
+        header h1 {
+            text-align: center;
+        }
+
+        .date {
+            display: none;
+        }
+    }
+}
+/*
+	Tablet width: [1200, infinity)
+*/
+@media only screen and (min-width: 1200px) {
+    .unit-body {
+        margin-right: 12%;
+        margin-left: 12%;
+    }
+
+    .the-footer h4 a {
+        font-size: 1.25em;
+    }
+
+    .search-form .results .entry-date {
+        display: block;
+        float: right;
+    }
+}