develop #115

Merged
samuel-p merged 3 commits from develop into main 2024-04-10 00:08:57 +00:00
5 changed files with 85 additions and 222 deletions
Showing only changes of commit 7e602d75c3 - Show all commits

45
.eleventy.js Normal file
View file

@ -0,0 +1,45 @@
const pluginRev = require("eleventy-plugin-rev");
const eleventySass = require("eleventy-sass");
const tinyHTML = require('@sardine/eleventy-plugin-tinyhtml');
module.exports = function (eleventyConfig) {
eleventyConfig.addPlugin(pluginRev);
eleventyConfig.addPlugin(tinyHTML);
eleventyConfig.addPlugin(eleventySass, {
sass: {
loadPaths: ["node_modules"],
style: "compressed",
sourceMap: false,
},
compileOptions: {
permalink: function (contents, inputPath) {
return (data) => {
return data.page.filePathStem.replace(/^\/scss\//, "/css/") + ".css";
};
}
},
rev: true
});
eleventyConfig.setUseGitIgnore(false);
eleventyConfig.addPassthroughCopy({
"src/img": "img",
"src/favicon.*": "",
"node_modules/@fortawesome/fontawesome-free/webfonts": "webfonts",
});
return {
// Pre-process *.html files with: (default: `liquid`)
htmlTemplateEngine: "njk",
// Opt-out of pre-processing global data JSON files: (default: `liquid`)
dataTemplateEngine: "njk",
dir: {
input: "src",
// includes: "_includes",
// layouts: "_includes/layouts",
data: "_data",
output: `dist`
}
};
};

View file

@ -1,185 +0,0 @@
/**
* Settings
* Turn on/off build features
*/
var settings = {
clean: true,
styles: true,
copy: true,
reload: true
};
/**
* Paths to project folders
*/
var paths = {
input: 'src/',
output: 'dist/',
styles: {
input: 'src/scss/*.scss',
output: 'dist/css/'
},
copy: {
input: [
'src/*.html',
// 'src/.htaccess',
'src/{img,font}/**/*',
'node_modules/@fortawesome/fontawesome-free/*fonts/**/*'
],
output: 'dist/'
},
reload: './dist/'
};
/**
* Template for banner to add to file headers
*/
var banner = {
main:
'/*!' +
' <%= package.name %> v<%= package.version %>' +
' | (c) ' + new Date().getFullYear() + ' <%= package.author.name %>' +
' | <%= package.license %> License' +
' | <%= package.repository.url %>' +
' */\n'
};
/**
* Gulp Packages
*/
// General
var {src, dest, watch, series, parallel} = require('gulp');
var del = require('del');
var rename = require('gulp-rename');
var header = require('gulp-header');
var package = require('./package.json');
// Styles
var sass = require('gulp-sass')(require('sass'));
var postcss = require('gulp-postcss');
var prefix = require('autoprefixer');
var minify = require('cssnano');
var tildeImporter = require('node-sass-tilde-importer');
// BrowserSync
var browserSync = require('browser-sync');
/**
* Gulp Tasks
*/
// Remove pre-existing content from output folders
var cleanDist = function (done) {
// Make sure this feature is activated before running
if (!settings.clean) return done();
// Clean the dist folder
del.sync([
paths.output
]);
// Signal completion
return done();
};
// Process, and minify Sass files
var buildStyles = function (done) {
// Make sure this feature is activated before running
if (!settings.styles) return done();
// Run tasks on all Sass files
return src(paths.styles.input)
.pipe(sass({
importer: tildeImporter,
outputStyle: 'expanded',
sourceComments: true
}))
.pipe(postcss([
prefix({
cascade: true,
remove: true
})
]))
.pipe(header(banner.main, {package: package}))
.pipe(dest(paths.styles.output))
.pipe(rename({suffix: '.min'}))
.pipe(postcss([
minify({
discardComments: {
removeAll: true
}
})
]))
.pipe(dest(paths.styles.output));
};
// Copy static files into output folder
var copyFiles = function (done) {
// Make sure this feature is activated before running
if (!settings.copy) return done();
// Copy static files
return src(paths.copy.input)
.pipe(dest(paths.copy.output));
};
// Watch for changes to the src directory
var startServer = function (done) {
// Make sure this feature is activated before running
if (!settings.reload) return done();
// Initialize BrowserSync
browserSync.init({
server: {
baseDir: paths.reload
}
});
// Signal completion
done();
};
// Reload the browser when files change
var reloadBrowser = function (done) {
if (!settings.reload) return done();
browserSync.reload();
done();
};
// Watch for changes
var watchSource = function (done) {
watch(paths.input, series(exports.default, reloadBrowser));
done();
};
/**
* Export Tasks
*/
// Default task
// gulp
exports.default = series(
cleanDist,
parallel(
buildStyles,
copyFiles
)
);
// Watch and reload
// gulp watch
exports.watch = series(
exports.default,
startServer,
watchSource
);

View file

@ -3,8 +3,9 @@
"version": "1.0.0", "version": "1.0.0",
"description": "website for sp-magic.de", "description": "website for sp-magic.de",
"scripts": { "scripts": {
"start": "gulp watch", "minify-css": "uncss -n -H dist/en/ -o dist/en/css/main-*.css dist/en/index.html",
"build": "gulp" "build": "eleventy && npm run minify-css",
"start": "eleventy --serve --watch"
}, },
"author": "samuel-p", "author": "samuel-p",
"repository": { "repository": {
@ -15,17 +16,18 @@
"browser-sync": "^3.0.2" "browser-sync": "^3.0.2"
}, },
"devDependencies": { "devDependencies": {
"autoprefixer": "10.4.19", "@11ty/eleventy": "^2.0.1",
"cssnano": "6.1.2", "@node-minify/core": "^8.0.6",
"del": "6.1.1", "@node-minify/crass": "^8.0.6",
"gulp": "5.0.0", "@node-minify/html-minifier": "^8.0.6",
"gulp-header": "2.0.9", "@sardine/eleventy-plugin-tinyhtml": "^0.2.0",
"gulp-postcss": "10.0.0", "eleventy-plugin-rev": "^2.0.0",
"gulp-rename": "2.0.0", "eleventy-sass": "^2.2.4",
"gulp-sass": "5.1.0", "glob": "^10.3.12",
"node-sass-tilde-importer": "^1.0.2", "minify": "^11.1.1",
"postcss": "^8.4.38", "postcss": "^8.4.38",
"sass": "^1.74.1" "sass": "^1.72.0",
"uncss": "^0.17.3"
}, },
"dependencies": { "dependencies": {
"@fortawesome/fontawesome-free": "^5.15.4", "@fortawesome/fontawesome-free": "^5.15.4",

View file

@ -29,8 +29,9 @@
<meta name="twitter:description" content="Samuel Philipp - Magician from Magdeburg"> <meta name="twitter:description" content="Samuel Philipp - Magician from Magdeburg">
<meta name="twitter:image" content="https://sp-magic.de/img/sp-magic.jpg"> <meta name="twitter:image" content="https://sp-magic.de/img/sp-magic.jpg">
<link rel="shortcut icon" href="img/samuel.png"> <link rel="shortcut icon" href="img/samuel.png">
<link rel="stylesheet" href="css/main.min.css"> <link rel="stylesheet" href="{{ '/css/main.css' | rev }}">
<script async defer data-website-id="dfb1ca1d-dc41-488a-8a95-f0e036bd3490" data-domains="sp-magic.de" src="https://umami.sp-codes.de/umami.js"></script> <script async defer data-website-id="dfb1ca1d-dc41-488a-8a95-f0e036bd3490" data-domains="sp-magic.de"
src="https://umami.sp-codes.de/umami.js"></script>
</head> </head>
<body class="d-flex flex-column"> <body class="d-flex flex-column">
<div class="container flex-column flex-grow p-3"> <div class="container flex-column flex-grow p-3">
@ -44,10 +45,10 @@
<div class="col-lg-8 col-md-10 col-12"> <div class="col-lg-8 col-md-10 col-12">
<h1 class="sp-codes">Willkommen bei sp-magic!</h1> <h1 class="sp-codes">Willkommen bei sp-magic!</h1>
<p class="lead text-center mb-2"> <p class="lead text-center mb-2">
Schön dass du hergefunden hast. Mein Name ist Samuel Philipp und ich bin ein Zauberkünstler aus Magdeburg. Schön, dass du hergefunden hast. Mein Name ist Samuel Philipp und ich bin ein Zauberkünstler aus
Bei meinen Auftritten präsentiere ich Tricks mit Spielkarten, Büchern, Nägeln, Feuer und vielen anderen Magdeburg. Bei meinen Auftritten präsentiere ich Tricks mit Spielkarten, Büchern, Nägeln, Feuer und
Dingen. Auf dieser Seite findest du verschiedene Möglichkeiten mit mir in Kontakt zu treten. vielen anderen Dingen. Auf dieser Seite findest du verschiedene Möglichkeiten mit mir in Kontakt zu
Ich freue mich auf deine Nachricht. treten. Ich freue mich auf deine Nachricht.
</p> </p>
</div> </div>
</div> </div>
@ -82,6 +83,6 @@
class="fas fa-code mr-2"></span>Code</a></div> class="fas fa-code mr-2"></span>Code</a></div>
<div><a target="_blank" href="https://umami.sp-codes.de/share/eEm9eppL/sp-magic.de"><span <div><a target="_blank" href="https://umami.sp-codes.de/share/eEm9eppL/sp-magic.de"><span
class="fas fa-chart-line mr-2"></span>Statistiken</a></div> class="fas fa-chart-line mr-2"></span>Statistiken</a></div>
</div> </div>
</body> </body>
</html> </html>

View file

@ -1,13 +1,13 @@
@import "~bootstrap/scss/bootstrap-grid"; @import "bootstrap/scss/bootstrap-grid";
@import "~bootstrap/scss/bootstrap-reboot"; @import "bootstrap/scss/bootstrap-reboot";
@import "~bootstrap/scss/utilities/align"; @import "bootstrap/scss/utilities/align";
@import "~bootstrap/scss/utilities/spacing"; @import "bootstrap/scss/utilities/spacing";
@import "~bootstrap/scss/utilities/display"; @import "bootstrap/scss/utilities/display";
@import "~bootstrap/scss/utilities/text"; @import "bootstrap/scss/utilities/text";
@import "~@fortawesome/fontawesome-free/scss/fontawesome"; @import "@fortawesome/fontawesome-free/scss/fontawesome";
@import "~@fortawesome/fontawesome-free/scss/solid"; @import "@fortawesome/fontawesome-free/scss/solid";
@import "~@fortawesome/fontawesome-free/scss/brands"; @import "@fortawesome/fontawesome-free/scss/brands";
@import "~@fortawesome/fontawesome-free/scss/regular"; @import "@fortawesome/fontawesome-free/scss/regular";
body { body {
background: url('../img/bg.png') no-repeat center center fixed; background: url('../img/bg.png') no-repeat center center fixed;