custom modified

xilou31 · Sep 28, 2022 · dc4fffc · dc4fffc
1 parent 063a3bc
commit dc4fffc
Show file tree

Hide file tree

Showing 11 changed files with 5,412 additions and 0 deletions.
diff --git a/README.md b/README.md
@@ -0,0 +1,50 @@
+# Alto
+
+A clean, minimalist theme featuring a light and dark mode. Launch your online publications with flair. Completely free and fully responsive, released under the MIT license.
+
+**Demo: https://alto.ghost.io**
+
+&nbsp;
+
+# Instructions
+
+1. [Download this theme](https://github.com/TryGhost/Alto/archive/main.zip)
+2. Log into Ghost, and go to the `Design` settings area to upload the zip file
+
+# White Logo
+
+If your logo image isn't recognizable in dark mode, you can set a white version of the logo in `Code injection > Site Header` field.
+
+```html
+<script>
+    var gh_white_logo = 'https://example.com/content/images/white-logo.png';
+</script>
+```
+
+# Development
+
+Styles are compiled using Gulp/PostCSS to polyfill future CSS spec. You'll need [Node](https://nodejs.org/), [Yarn](https://yarnpkg.com/) and [Gulp](https://gulpjs.com) installed globally. After that, from the theme's root directory:
+
+```bash
+# Install
+yarn
+
+# Run build & watch for changes
+$ yarn dev
+```
+
+Now you can edit `/assets/css/` files, which will be compiled to `/assets/built/` automatically.
+
+The `zip` Gulp task packages the theme files into `dist/<theme-name>.zip`, which you can then upload to your site.
+
+```bash
+yarn zip
+```
+
+# PostCSS Features Used
+
+-   Autoprefixer - Don't worry about writing browser prefixes of any kind, it's all done automatically with support for the latest 2 major versions of every browser.
+
+# Copyright & License
+
+Copyright (c) 2013-2022 Ghost Foundation - Released under the [MIT license](LICENSE).
diff --git a/author.hbs b/author.hbs
@@ -0,0 +1,25 @@
+{{!< default}}
+
+<div class="content-area">
+    <main class="site-main">
+        {{#author}}
+            <section class="term container large">
+                {{#if profile_image}}
+                    <div class="term-image-container u-placeholder">
+                        <img class="term-image u-object-fit" src={{img_url profile_image size="xs"}} alt="{{name}}">
+                    </div>
+                {{/if}}
+                <div class="term-wrapper">
+                    <h1 class="term-name">{{name}}</h1>
+                    <div class="term-description">{{bio}}</div>
+                </div>
+            </section>
+        {{/author}}
+        <div class="post-feed">
+            {{#foreach posts}}
+                {{> "loop"}}
+            {{/foreach}}
+        </div>
+        {{pagination}}
+    </main>
+</div>
diff --git a/default.hbs b/default.hbs
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html lang="{{@site.locale}}">
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>{{meta_title}}</title>
+    <link rel="stylesheet" href="{{asset "built/screen.css"}}">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&family=Mulish:ital,wght@0,400;0,700;0,800;1,400;1,700&display=swap">
+
+    <script>
+        if (localStorage.getItem('alto_dark') == 'true') {
+            document.documentElement.classList.add('dark-mode');
+        }
+    </script>
+
+    {{ghost_head}}
+</head>
+
+<body class="{{body_class}}{{#match @custom.title_font "=" "Elegant serif"}} has-serif-title{{/match}}{{#match @custom.body_font "=" "Elegant serif"}} has-serif-body{{/match}}">
+    <div class="site">
+        {{> header}}
+        {{#is "home"}}
+            {{#if @custom.show_featured_posts}}
+                {{> featured}}
+            {{/if}}
+        {{/is}}
+        <div class="site-content">
+            {{{body}}}
+        </div>
+        {{> footer}}
+    </div>
+
+    <div class="dimmer"></div>
+
+    <div class="off-canvas">
+        <div class="canvas-close">
+            <i class="canvas-icon icon icon-window-close"></i>
+        </div>
+        <div class="mobile-menu"></div>
+    </div>
+
+    <script
+        src="https://code.jquery.com/jquery-3.5.1.min.js"
+        integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
+        crossorigin="anonymous">
+    </script>
+    <script src="{{asset "built/main.min.js"}}"></script>
+
+    {{{block "scripts"}}}
+
+    {{ghost_foot}}
+</body>
+
+</html>
diff --git a/gulpfile.js b/gulpfile.js
@@ -0,0 +1,87 @@
+const {series, parallel, watch, src, dest} = require('gulp');
+const pump = require('pump');
+
+// gulp plugins and utils
+const livereload = require('gulp-livereload');
+const postcss = require('gulp-postcss');
+const concat = require('gulp-concat');
+const uglify = require('gulp-uglify');
+const zip = require('gulp-zip');
+const beeper = require('beeper');
+
+// postcss plugins
+const easyimport = require('postcss-easy-import');
+const autoprefixer = require('autoprefixer');
+const cssnano = require('cssnano');
+
+function serve(done) {
+    livereload.listen();
+    done();
+}
+
+function handleError(done) {
+    return function (err) {
+        if (err) {
+            beeper();
+        }
+        return done(err);
+    };
+};
+
+function hbs(done) {
+    pump([
+        src(['*.hbs', 'partials/**/*.hbs', 'members/**/*.hbs']),
+        livereload()
+    ], handleError(done));
+}
+
+function css(done) {
+    pump([
+        src('assets/css/screen.css', {sourcemaps: true}),
+        postcss([
+            easyimport,
+            autoprefixer(),
+            cssnano()
+        ]),
+        dest('assets/built/', {sourcemaps: '.'}),
+        livereload()
+    ], handleError(done));
+}
+
+function js(done) {
+    pump([
+        src([
+            'assets/js/lib/*.js',
+            'assets/js/main.js'
+        ], {sourcemaps: true}),
+        concat('main.min.js'),
+        uglify(),
+        dest('assets/built/', {sourcemaps: '.'}),
+        livereload()
+    ], handleError(done));
+}
+
+function zipper(done) {
+    const filename = require('./package.json').name + '.zip';
+
+    pump([
+        src([
+            '**',
+            '!node_modules', '!node_modules/**',
+            '!dist', '!dist/**',
+            '!yarn-error.log'
+        ]),
+        zip(filename),
+        dest('dist/')
+    ], handleError(done));
+}
+
+const hbsWatcher = () => watch(['*.hbs', 'partials/**/*.hbs', 'members/**/*.hbs'], hbs);
+const cssWatcher = () => watch('assets/css/**/*.css', css);
+const jsWatcher = () => watch('assets/js/**/*.js', js);
+const watcher = parallel(hbsWatcher, cssWatcher, jsWatcher);
+const build = series(css, js);
+
+exports.build = build;
+exports.zip = series(build, zipper);
+exports.default = series(build, serve, watcher);
diff --git a/index.hbs b/index.hbs
@@ -0,0 +1,12 @@
+{{!< default}}
+
+<div class="content-area">
+    <main class="site-main">
+        <div class="post-feed">
+            {{#foreach posts}}
+                {{> "loop"}}
+            {{/foreach}}
+        </div>
+        {{pagination}}
+    </main>
+</div>
diff --git a/package.json b/package.json
@@ -0,0 +1,99 @@
+{
+    "name": "alto",
+    "description": "A Ghost theme",
+    "version": "1.0.0",
+    "engines": {
+        "ghost": ">=4.0.0"
+    },
+    "license": "MIT",
+    "author": {
+        "name": "Ghost Foundation",
+        "email": "[email protected]",
+        "url": "https://ghost.org"
+    },
+    "keywords": [
+        "ghost",
+        "theme",
+        "ghost-theme"
+    ],
+    "config": {
+        "posts_per_page": 999999,
+        "image_sizes": {
+            "xs": {
+                "width": 150
+            },
+            "s": {
+                "width": 400
+            },
+            "m": {
+                "width": 750
+            },
+            "l": {
+                "width": 960
+            },
+            "xl": {
+                "width": 1140
+            },
+            "xxl": {
+                "width": 1920
+            }
+        },
+        "card_assets": true,
+        "custom": {
+            "title_font": {
+                "type": "select",
+                "options": ["Modern sans-serif", "Elegant serif"],
+                "default": "Modern sans-serif"
+            },
+            "body_font": {
+                "type": "select",
+                "options": ["Modern sans-serif", "Elegant serif"],
+                "default": "Modern sans-serif"
+            },
+            "white_logo_for_dark_mode": {
+                "type": "image"
+            },
+            "show_featured_posts": {
+                "type": "boolean",
+                "default": true,
+                "group": "homepage"
+            },
+            "show_share_links": {
+                "type": "boolean",
+                "default": true,
+                "group": "post"
+            },
+            "show_author": {
+                "type": "boolean",
+                "default": false,
+                "group": "post"
+            },
+            "show_related_posts": {
+                "type": "boolean",
+                "default": false,
+                "group": "post"
+            }
+        }
+    },
+    "scripts": {
+        "dev": "gulp",
+        "test": "gscan .",
+        "test:ci": "gscan --fatal --verbose .",
+        "zip": "gulp zip"
+    },
+    "devDependencies": {
+        "autoprefixer": "10.4.4",
+        "beeper": "2.1.0",
+        "cssnano": "5.1.7",
+        "gscan": "4.27.0",
+        "gulp": "4.0.2",
+        "gulp-concat": "2.6.1",
+        "gulp-livereload": "4.0.2",
+        "gulp-postcss": "9.0.1",
+        "gulp-uglify": "3.0.2",
+        "gulp-zip": "5.1.0",
+        "postcss": "8.4.12",
+        "postcss-easy-import": "4.0.0",
+        "pump": "3.0.0"
+    }
+}
diff --git a/page.hbs b/page.hbs
@@ -0,0 +1,15 @@
+{{!< default}}
+
+<div class="content-area">
+    <main class="site-main">
+        {{#post}}
+            <article class="{{post_class}}{{#unless feature_image}} no-image{{/unless}} single-post">
+                {{> post-header single=true big_title=true}}
+                {{> post-media ratio="horizontal" with_caption=true}}
+                <div class="post-content gh-content kg-canvas">
+                    {{content}}
+                </div>
+            </article>
+        {{/post}}
+    </main>
+</div>
diff --git a/post.hbs b/post.hbs
@@ -0,0 +1,31 @@
+{{!< default}}
+
+<div class="content-area">
+    <main class="site-main">
+        {{#post}}
+            <article class="{{post_class}}{{#unless feature_image}} no-image{{/unless}} single-post">
+                {{> post-header single=true big_title=true}}
+                {{> post-media ratio="horizontal" with_caption=true}}
+                <div class="post-content gh-content kg-canvas">
+                    {{content}}
+                </div>
+                <div class="container medium">
+                    {{#if @custom.show_share_links}}
+                        {{> share}}
+                    {{/if}}
+                    {{#if @custom.show_author}}
+                        {{> author}}
+                    {{/if}}
+                </div>
+            </article>
+            {{> post-navigation}}
+
+
+	    {{#if @custom.show_related_posts}}
+                {{> related}}
+            {{/if}}
+
+            {{> comment}}
+        {{/post}}
+    </main>
+</div>
diff --git a/renovate.json b/renovate.json
@@ -0,0 +1,5 @@
+{
+  "extends": [
+    "@tryghost:theme"
+  ]
+}