KevinMidboe/planetposen
1
0
Fork 0
mirror of https://github.com/KevinMidboe/planetposen.git synced 2025-10-29 17:50:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Created header and the start of a shopping cart.

Browse Source
This commit is contained in:
Kevin
2019-12-02 23:46:24 +01:00
parent 36db97a7d6
commit 6f15c53cca
36 changed files with 8341 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
config/env/dev.env.js vendored Normal file
View File

@@ -0,0 +1,3 @@
module.exports = {
NODE_ENV: "development"
};

3
config/env/prod.env.js vendored Normal file
View File

@@ -0,0 +1,3 @@
module.exports = {
NODE_ENV: "production"
};

3
config/env/staging.env.js vendored Normal file
View File

@@ -0,0 +1,3 @@
module.exports = {
NODE_ENV: "staging"
};

15
config/helpers.js Normal file
View File

@@ -0,0 +1,15 @@
"use strict";
const path = require("path");
const _root = path.resolve(__dirname, "..");
exports.root = function(args) {
args = Array.prototype.slice.call(arguments, 0);
return path.join.apply(path, [_root].concat(args));
};
exports.assetsPath = function(_path) {
return path.posix.join("static", _path);
};

93
config/webpack.config.common.js Normal file
View File

@@ -0,0 +1,93 @@
"use strict";
const VueLoaderPlugin = require("vue-loader/lib/plugin");
const MiniCSSExtractPlugin = require("mini-css-extract-plugin");
const helpers = require("./helpers");
const isDev = process.env.NODE_ENV === "development";
const webpackConfig = function(isDev) {
return {
entry: {
main: ["@babel/polyfill", helpers.root("frontend", "main")]
},
resolve: {
extensions: [".js", ".vue"],
alias: {
vue$: isDev ? "vue/dist/vue.runtime.js" : "vue/dist/vue.runtime.min.js",
"@": helpers.root("frontend")
}
},
module: {
rules: [
{
test: /\.vue$/,
loader: "vue-loader",
include: [helpers.root("frontend")]
},
{
test: /\.js$/,
loader: "babel-loader",
include: [helpers.root("frontend")]
},
{
test: /\.css$/,
use: [
isDev ? "vue-style-loader" : MiniCSSExtractPlugin.loader,
{ loader: "css-loader", options: { sourceMap: isDev } }
]
},
{
test: /\.scss$/,
use: [
isDev ? "vue-style-loader" : MiniCSSExtractPlugin.loader,
{ loader: "css-loader", options: { sourceMap: isDev } },
{ loader: "sass-loader", options: { sourceMap: isDev } }
]
},
{
test: /\.sass$/,
use: [
isDev ? "vue-style-loader" : MiniCSSExtractPlugin.loader,
{ loader: "css-loader", options: { sourceMap: isDev } },
{ loader: "sass-loader", options: { sourceMap: isDev } }
]
},
// {
// test: /\.s(c|a)ss$/,
// use: [
// 'vue-style-loader',
// 'css-loader',
// {
// loader: 'sass-loader',
// // Requires sass-loader@^7.0.0
// options: {
// implementation: require('sass'),
// fiber: require('fibers'),
// indentedSyntax: true // optional
// },
// // Requires sass-loader@^8.0.0
// options: {
// implementation: require('sass'),
// sassOptions: {
// fiber: require('fibers'),
// indentedSyntax: true // optional
// },
// },
// },
// ],
// },
{
test: /\.woff(2)?(\?[a-z0-9]+)?$/,
loader: 'url-loader?limit=10000&mimetype=application/font-woff'
},
{
test: /\.(ttf|eot|svg)(\?[a-z0-9]+)?$/,
loader: 'file-loader'
}
]
},
plugins: [new VueLoaderPlugin()]
};
};
module.exports = webpackConfig;

44
config/webpack.config.dev.js Normal file
View File

@@ -0,0 +1,44 @@
"use strict";
const webpack = require("webpack");
const merge = require("webpack-merge");
const FriendlyErrorsPlugin = require("friendly-errors-webpack-plugin");
const HtmlPlugin = require("html-webpack-plugin");
const helpers = require("./helpers");
const commonConfig = require("./webpack.config.common");
const environment = require("./env/dev.env");
const webpackConfig = merge(commonConfig(true), {
mode: "development",
devtool: "cheap-module-eval-source-map",
output: {
path: helpers.root("dist"),
publicPath: "/",
filename: "js/[name].bundle.js",
chunkFilename: "js/[id].chunk.js"
},
optimization: {
runtimeChunk: "single",
splitChunks: {
chunks: "all"
}
},
plugins: [
new webpack.EnvironmentPlugin(environment),
new webpack.HotModuleReplacementPlugin(),
new FriendlyErrorsPlugin(),
new HtmlPlugin({ template: "frontend/index.html", chunksSortMode: "dependency" })
],
devServer: {
compress: true,
historyApiFallback: true,
hot: true,
overlay: true,
port: 8080,
stats: {
normal: true
}
}
});
module.exports = webpackConfig;

55
config/webpack.config.prod.js Normal file
View File

@@ -0,0 +1,55 @@
"use strict";
const webpack = require("webpack");
const merge = require("webpack-merge");
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const MiniCSSExtractPlugin = require("mini-css-extract-plugin");
const UglifyJSPlugin = require("uglifyjs-webpack-plugin");
const CompressionPlugin = require("compression-webpack-plugin");
const helpers = require("./helpers");
const commonConfig = require("./webpack.config.common");
const isProd = process.env.NODE_ENV === "production";
const environment = isProd
? require("./env/prod.env")
: require("./env/staging.env");
const webpackConfig = merge(commonConfig(false), {
mode: "production",
output: {
path: helpers.root("dist"),
publicPath: "/",
filename: "js/[name].bundle.js"
},
optimization: {
minimizer: [
new OptimizeCSSAssetsPlugin({
cssProcessorPluginOptions: {
preset: ["default", { discardComments: { removeAll: true } }]
}
}),
new UglifyJSPlugin({
cache: true,
parallel: false,
sourceMap: !isProd
})
]
},
plugins: [
new webpack.EnvironmentPlugin(environment),
new MiniCSSExtractPlugin({
filename: "css/[name].css"
})
]
});
if (!isProd) {
webpackConfig.devtool = "source-map";
if (process.env.npm_config_report) {
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer")
.BundleAnalyzerPlugin;
webpackConfig.plugins.push(new BundleAnalyzerPlugin());
}
}
module.exports = webpackConfig;

BIN
frontend/.DS_Store vendored Normal file
View File

Binary file not shown.

22
frontend/App.vue Normal file
View File

@@ -0,0 +1,22 @@
<template>
<div>
<Header></Header>
<router-view />
</div>
</template>
<script>
import Header from '@/components/Header';
export default {
name: 'App',
components: { Header }
}
</script>
<style lang="scss">
@import './styles/normalize';
@import './styles/icons';
@import './styles/global';
</style>

BIN
frontend/assets/.DS_Store vendored Normal file
View File

Binary file not shown.

BIN
frontend/assets/fonts/.DS_Store vendored Normal file
View File

Binary file not shown.

BIN
frontend/assets/fonts/planetposen-icons/.DS_Store vendored Normal file
View File

Binary file not shown.

BIN
frontend/assets/fonts/planetposen-icons/fonts/planetposen-icons.eot Normal file
View File

Binary file not shown.

28
frontend/assets/fonts/planetposen-icons/fonts/planetposen-icons.svg Normal file
View File

@@ -0,0 +1,28 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="planetposen-icons" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="basket-outline" d="M800 512v192c0 70.4-57.6 128-128 128h-320c-70.4 0-128-57.6-128-128v-192h-160l105-388.6c9.4-34 40.8-59.4 78.2-59.4h529.4c37.4 0 68.8 25 78.6 59l104.8 389h-160zM918 480h0.2l-25.8-96h-156.4v96h182zM140.4 352h147.6v-128h-113l-34.6 128zM320 352h176v-128h-176v128zM704 384h-176v96h176v-96zM496 384h-176v96h176v-96zM496 192v-96h-176v96h176zM528 192h176v-96h-176v96zM528 224v128h176v-128h-176zM736 352h147.8l-34.4-128h-113.4v128zM256 704c0 25.6 10 49.6 28.2 67.8s42.2 28.2 67.8 28.2h320c25.6 0 49.6-10 67.8-28.2s28.2-42.2 28.2-67.8v-192h-512v192zM288 480v-96h-156.2l-26 96h182.2zM200 131.8l-16.4 60.2h104.4v-96h-40.8c-22 0-41.4 14.6-47.2 35.8zM824.6 131.6c-6.2-21-25.8-35.6-47.8-35.6h-40.8v96h104.8l-16.2-60.4z" />
<glyph unicode="&#xe901;" glyph-name="basket" d="M800 512v192c0 70.4-57.6 128-128 128h-320c-70.4 0-128-57.6-128-128v-192h-160l105-388.6c9.4-34 40.8-59.4 78.2-59.4h529.4c37.4 0 68.8 25 78.6 59l104.8 389h-160zM256 704c0 25.6 10 49.6 28.2 67.8s42.2 28.2 67.8 28.2h320c25.6 0 49.6-10 67.8-28.2s28.2-42.2 28.2-67.8v-192h-512v192zM883.8 352h-147.8v-128h113.4l-8.6-32h-104.8v-96h-32v96h-176v-96h-32v96h-176v-96h-32v96h-104.4l-8.6 32h113v128h-147.6l-8.6 32h156.2v96h32v-96h176v96h32v-96h176v96h32v-96h156.4l-8.6-32zM528 352h176v-128h-176zM320 352h176v-128h-176z" />
<glyph unicode="&#xe902;" glyph-name="card-outline" d="M864 736h-704c-35.2 0-64-28.8-64-64v-448c0-35.2 28.8-64 64-64h704c35.2 0 64 28.8 64 64v448c0 35.2-28.8 64-64 64zM160 704h704c17.6 0 32-14.4 32-32v-64h-768v64c0 17.6 14.4 32 32 32zM896 576v-96h-768v96h768zM864 192h-704c-17.6 0-32 14.4-32 32v224h768v-224c0-17.6-14.4-32-32-32zM192 320h64v-32h-64zM320 320h384v-32h-384z" />
<glyph unicode="&#xe903;" glyph-name="card" d="M864 736h-704c-35.2 0-64-28.8-64-64v-448c0-35.2 28.8-64 64-64h704c35.2 0 64 28.8 64 64v448c0 35.2-28.8 64-64 64zM160 704h704c17.6 0 32-14.4 32-32v-64h-768v64c0 17.6 14.4 32 32 32zM864 192h-704c-17.6 0-32 14.4-32 32v224h768v-224c0-17.6-14.4-32-32-32zM192 320h64v-32h-64zM320 320h384v-32h-384z" />
<glyph unicode="&#xe904;" glyph-name="cart-outline" d="M320 160c-26.496 0-48-21.504-48-48s21.504-48 48-48 48 21.504 48 48-21.504 48-48 48zM320 96c-8.82 0-16 7.18-16 16s7.18 16 16 16 16-7.18 16-16-7.18-16-16-16zM769 160c-26.496 0-48-21.504-48-48s21.504-48 48-48 48 21.504 48 48-21.504 48-48 48zM769 96c-8.82 0-16 7.18-16 16s7.18 16 16 16 16-7.18 16-16-7.18-16-16-16zM896 704l-649.646 64.708c-3.256 13.944-8.74 29.32-23.676 41.334-18.63 14.978-48.718 21.958-94.678 21.958v-32c37.228 0 62.334-5.014 74.624-14.896 8.916-7.17 11.288-16.846 14.33-31.98l-0.048-0.006 84.104-467.28c4.826-28.84 14.388-50.416 26.58-65.97 14.498-18.492 33.478-27.868 56.41-27.868h480v32h-480c-9.454 0-38.272-0.246-51.5 67.51l-10.856 60.32 542.356 96.17 32 256zM837.18 475.304l-521.2-91.98-63.466 352.6 607.74-61.216-23.074-199.404z" />
<glyph unicode="&#xe905;" glyph-name="cart" d="M320 160c-26.496 0-48-21.504-48-48s21.504-48 48-48 48 21.504 48 48-21.504 48-48 48zM769 160c-26.496 0-48-21.504-48-48s21.504-48 48-48 48 21.504 48 48-21.504 48-48 48zM896 704l-649.646 64.708c-3.256 13.944-8.74 29.32-23.676 41.334-18.63 14.978-48.718 21.958-94.678 21.958v-32c37.228 0 62.334-5.014 74.624-14.896 8.916-7.17 11.288-16.846 14.33-31.98l-0.048-0.006 84.104-467.28c4.826-28.84 14.388-50.416 26.58-65.97 14.498-18.492 33.478-27.868 56.41-27.868h480v32h-480c-9.454 0-38.272-0.246-51.5 67.51l-10.856 60.32 542.356 96.17 32 256z" />
<glyph unicode="&#xe906;" glyph-name="cash-outline" d="M80 224h864v-32h-864zM96 160h832v-32h-832zM64 768v-512h896v512h-896zM928 288h-832v448h832v-448zM768 704h128v-32h-128zM768 352h128v-32h-128zM128 704h128v-32h-128zM128 352h128v-32h-128zM512 368c-79.4 0-144 64.6-144 144s64.6 144 144 144 144-64.6 144-144-64.6-144-144-144zM512 624c-61.8 0-112-50.2-112-112s50.2-112 112-112 112 50.2 112 112-50.2 112-112 112z" />
<glyph unicode="&#xe907;" glyph-name="cash" d="M80 224h864v-32h-864zM96 160h832v-32h-832zM512 624c-61.8 0-112-50.2-112-112s50.2-112 112-112 112 50.2 112 112-50.2 112-112 112zM64 768v-512h896v512h-896zM256 320h-128v32h128v-32zM256 672h-128v32h128v-32zM512 368c-79.4 0-144 64.6-144 144s64.6 144 144 144 144-64.6 144-144-64.6-144-144-144zM896 320h-128v32h128v-32zM896 672h-128v32h128v-32z" />
<glyph unicode="&#xe908;" glyph-name="close-circle-outline" d="M806.2 742.2c-162.4 162.4-425.8 162.4-588.4 0s-162.4-425.8 0-588.4c162.4-162.4 425.8-162.4 588.4 0s162.4 426 0 588.4zM781.6 178.4c-148.6-148.6-390.6-148.6-539.2 0s-148.6 390.6 0 539.2 390.6 148.6 539.2 0c148.8-148.6 148.8-390.6 0-539.2zM680.4 640l-168.8-168.4-168 167.6-23.6-23.6 168-167.6-168-167.6 23.6-23.6 168 167.6 168.8-168.4 23.6 23.6-168.8 168.4 168.8 168.4z" />
<glyph unicode="&#xe909;" glyph-name="close-circle" d="M806.2 742.2c-162.4 162.4-425.8 162.4-588.4 0s-162.4-425.8 0-588.4c162.4-162.4 425.8-162.4 588.4 0s162.4 426 0 588.4zM704 279.6l-23.6-23.6-168.8 168.4-168-167.6-23.6 23.6 168 167.6-168 167.6 23.6 23.6 168-167.6 168.8 168.4 23.6-23.6-168.8-168.4 168.8-168.4z" />
<glyph unicode="&#xe90b;" glyph-name="at-outline" d="M867.8 270.8c-65.8-127.6-195.2-206.8-337.6-206.8-101 0-194.6 39.8-263.8 112.2-68.8 72-106.6 168.4-106.6 271.8s37.8 199.8 106.6 271.8c69.2 72.4 163 112.2 263.8 112.2 101.8 0 187.8-38.6 242.2-108.4 52.6-67.6 69-156.2 46.4-249.8-21.8-90.2-67-131.6-101-150.4-35-19.4-83.6-26.8-104.8-8.8-0.6 0.6-1.2 1.2-1.6 1.8-3 3.8-4.6 10.8-4.8 17s0.4 13.4 2 21.4c1.6 8 3.8 16.8 6.4 25.4l77.2 233.8h-42.6l-20-53c-9.2 24.2-21.2 41.6-36.2 52-15 10.6-31.4 15.8-49 15.8-28.4 0-54.4-7-77.8-20.8-23.6-13.8-43.6-31.8-60.2-54.2s-29.4-47.6-38.6-75.4c-9.2-27.8-13.6-55.8-13.6-83.8 0-16.2 2.4-31.4 7.2-45.4s11.8-26.4 20.8-37.2c9-10.8 20.2-19.4 33.4-25.6s28-9.4 44.6-9.4c20.4 0 39.4 5.4 57 16.8s32.6 24.2 45 36.2h1.6c1.6-18 9.4-31 19.6-40.2 5.2-4.6 12.6-9 22.2-12.2v-0.2c42.2-14.4 84.2-6 127.6 18 39.6 22 92.2 69.4 116.6 171 25 103.2 6.4 201.6-52.4 277.2-60.4 77.6-155.4 120.4-267.2 120.4-109.6 0-211.4-43.4-286.6-122-74.6-78-115.6-182.4-115.6-294s41-216 115.6-294c75.2-78.8 177.2-122 286.6-122 154.2 0 294.4 85.8 365.8 224l-28.2 14.8zM567 387.2c-12.2-19.6-26.6-36-43-49.6-16.4-13.4-34-20.2-53.2-20.2-19.6 0-35.8 7.2-48.6 21.4-12.8 14.4-19.2 33.8-19.2 58.6 0 19.2 3.2 40 9.8 62.4 6.6 22.2 16 43 28.2 62s27 34.8 44.2 47.4c17.2 12.6 36.2 19 56.8 19 8.2 0 16-2.2 23.8-6.6 7.6-4.4 14.4-10.2 20.4-17.4s11-15.2 14.8-24.4c3.8-9 5.8-18.6 5.8-28.4 0-18.2-3.6-38.6-10.6-61.2-7.2-22.4-17-43.4-29.2-63z" />
<glyph unicode="&#xe90c;" glyph-name="at" d="M768 775.8c10.6-10 20.4-21 29.4-32.6 58.8-75.4 77.4-173.8 52.4-277.2-24.6-101.4-77-149-116.6-171-43.4-24-85.4-32.4-127.6-18v0.2c-9.6 3.2-17 7.6-22.2 12.2-10.2 9.2-18 22.2-19.6 40.2h-1.6c-12.4-12-27.2-24.8-45-36.2s-36.6-16.8-57-16.8c-16.6 0-31.4 3-44.6 9.4-13.2 6.2-24.2 14.8-33.4 25.6s-16 23.2-20.8 37.2c-4.8 14-7.2 29.2-7.2 45.4 0 28 4.6 56 13.6 83.8s22 53 38.6 75.4c16.6 22.4 36.6 40.6 60.2 54.2 23.6 13.8 49.4 20.8 77.8 20.8 17.6 0 34-5.2 49-15.8s27-27.8 36.2-52l20 53h42.6l-77-233.6c-2.6-8.6-4.8-17.4-6.4-25.4s-2.2-15.2-2-21.4c0.2-6.2 1.8-13.2 4.8-17 0.4-0.6 1-1.2 1.6-1.8 21.2-18.2 69.8-10.6 104.8 8.8 34.2 18.8 79.4 60.2 101 150.4 22.6 93.6 6 182.2-46.4 249.8-45.6 58.4-109.2 117.6-193.6 133-27.8 5-44.2 7.6-67 7.6-229.8 0-416-186.2-416-416s186.2-416 416-416 416 186.2 416 416c0 133.2-62.6 251.8-160 327.8zM422.2 338.8c12.8-14.2 29-21.4 48.6-21.4 19.2 0 36.8 6.8 53.2 20.2 16.4 13.6 30.8 30 43 49.6s22 40.6 29 63.2 10.6 43 10.8 61c0 9.8-2 19.4-5.8 28.4-2 4.6-4.2 9-6.6 13.2-2.4 4-5.2 7.8-8.2 11.4-6 7.2-12.8 13-20.4 17.4s-15.6 6.6-23.8 6.6c-20.8 0-39.6-6.4-56.8-19s-32-28.4-44.2-47.4c-12.2-19-21.6-39.6-28.2-62-6.6-22.2-9.8-43-9.8-62.4v-0.2c0-24.8 6.4-44.2 19.2-58.6z" />
<glyph unicode="&#xe913;" glyph-name="checkmark-circle-outline" d="M680.2 605.4l-249.6-251.4-94.4 94.4-35.6-35.6 112-112c5-5 11.8-9 17.8-9s12.6 4 17.6 8.8l267.4 268.8-35.2 36zM512 864c-229.8 0-416-186.2-416-416s186.2-416 416-416 416 186.2 416 416-186.2 416-416 416zM512 66.6c-210.2 0-381.4 171-381.4 381.4 0 210.2 171 381.4 381.4 381.4 210.2 0 381.4-171 381.4-381.4 0-210.2-171.2-381.4-381.4-381.4z" />
<glyph unicode="&#xe914;" glyph-name="checkmark-circle" d="M512 864c-229.8 0-416-186.2-416-416s186.2-416 416-416 416 186.2 416 416-186.2 416-416 416zM447.8 300.6c-4.8-4.8-11.6-8.8-17.6-8.8s-12.8 4.2-17.8 9l-112 112 35.6 35.6 94.4-94.4 249.6 251.4 35-36.2-267.2-268.6z" />
<glyph unicode="&#xe92c;" glyph-name="key-outline" d="M685.2 523.8c-26.6 0-52.2 0-76.2-8.2-103.2 86.2-375.6 313.8-396.4 335-9.6 9.8-20.2 13.4-30.6 13.4-17.4 0-34-10.4-43.4-19.2-14-13.2-51.2-53.6-41-64 30.6-30.8 54.8-53 67.4-65.6 9.6-9.6 26.8 1.6 39.2-6.6 11-7.2 20-19.8 29.2-29 10.6-10.8 18-15.6 17.8-31.4-0.2-16.6 1-27.6 12.6-40 9.4-10 18.2-15.2 31.8-15.4 18.4-0.4 29.8-4.8 41.8-19.8 11.4-14.2 4.2-28.4 9.8-44 3.6-10.2 32-36.2 36-40.2s22 0 26.6-4.6 34.4-31.6 36.4-40.8-6-18-4-27.2c2.4-11.2 14.4-24.2 21.2-34.8-13.6-31-21.2-65.2-21.2-101.4 0-137 108.8-248 242.8-248s243 111 243 248-108.8 243.8-242.8 243.8zM685.2 64c-116.4 0-211 97-211 216 0 30.8 6.2 60.6 18.4 88.4l7 15.8s-15.4 26.8-20.8 32.4c-5.4 5.4 4.4 26.2-1.2 33.2-5.8 7-39.2 50.4-49.4 60.6s-28 3.6-33.4 9c-5.4 5.4-14.6 15.8-17.4 20.8-0.4 1.6-0.4 4.8-0.6 7.6-0.2 10.4-0.6 28-14.2 44.8-17.2 21.6-37 31-65.8 31.8-3.2 0-4.4 0.2-9.4 5.4-3.2 3.4-4 4.4-4 17.8 0.2 27.4-13.4 40.8-23.2 50.4l-38.2 37.2c-15.4 10.2-30.2 10.4-39.8 10.4-2.6 0-5.2 0-6.8 0.4l-43.6 45.4c2 6 15.4 17.8 21.2 23 2.8 2.4 5.2 4.8 7.8 7 5.6 5.2 14.8 10.6 21.6 10.6 2 0 4.2-0.2 7.8-3.8 20.8-21.2 258.8-220.4 398.8-337.2l13.6-11.4 16.8 5.6c19.2 6.4 41.8 6.4 66 6.4 56.6 0 109.6-21.8 149.2-61.2 39.8-39.6 61.6-93.2 61.6-150.6 0-118.8-94.6-215.8-211-215.8zM768 256c-35.4 0-64-28.6-64-64s28.6-64 64-64 64 28.6 64 64-28.6 64-64 64zM768 160c-17.6 0-32 14.4-32 32s14.4 32 32 32 32-14.4 32-32-14.4-32-32-32z" />
<glyph unicode="&#xe92d;" glyph-name="key" d="M768 224c-17.6 0-32-14.4-32-32s14.4-32 32-32 32 14.4 32 32-14.4 32-32 32zM685.2 523.8c-26.6 0-52.2 0-76.2-8.2-103.2 86.2-375.6 313.8-396.4 335-9.6 9.8-20.2 13.4-30.6 13.4-17.4 0-34-10.4-43.4-19.2-14-13.2-51.2-53.6-41-64 30.6-30.8 54.8-53 67.4-65.6 9.6-9.6 26.8 1.6 39.2-6.6 11-7.2 20-19.8 29.2-29 10.6-10.8 18-15.6 17.8-31.4-0.2-16.6 1-27.6 12.6-40 9.4-10 18.2-15.2 31.8-15.4 18.4-0.4 29.8-4.8 41.8-19.8 11.4-14.2 4.2-28.4 9.8-44 3.6-10.2 32-36.2 36-40.2s22 0 26.6-4.6 34.4-31.6 36.4-40.8-6-18-4-27.2c2.4-11.2 14.4-24.2 21.2-34.8-13.6-31-21.2-65.2-21.2-101.4 0-137 108.8-248 242.8-248s243 111 243 248-108.8 243.8-242.8 243.8zM768 128c-35.4 0-64 28.6-64 64s28.6 64 64 64 64-28.6 64-64-28.6-64-64-64z" />
<glyph unicode="&#xe92e;" glyph-name="lock-outline" d="M720 512v144c0 114.86-93.124 208-207.968 208-114.908 0-208.032-93.14-208.032-208v-144h-112v-480h640v480h-112zM336 656c0 97.046 78.968 176 176.032 176 97.028 0 175.968-78.954 175.968-176v-144h-352v144zM800 64h-576v416h576v-416zM512 384c-35.346 0-64-28.654-64-64 0-29.82 20.396-54.88 48-61.984v-66.016h32v66.016c27.604 7.106 48 32.164 48 61.984 0 35.346-28.654 64-64 64zM512 288c-17.644 0-32 14.356-32 32s14.356 32 32 32 32-14.356 32-32-14.356-32-32-32z" />
<glyph unicode="&#xe92f;" glyph-name="lock" d="M720 512v144c0 114.86-93.124 208-207.968 208-114.908 0-208.032-93.14-208.032-208v-144h-112v-480h640v480h-112zM528 258.016v-66.016h-32v66.016c-27.604 7.106-48 32.164-48 61.984 0 35.346 28.654 64 64 64s64-28.654 64-64c0-29.82-20.396-54.88-48-61.984zM688 512h-352v144c0 97.046 78.968 176 176.032 176 97.028 0 175.968-78.954 175.968-176v-144zM512 352c-17.644 0-32-14.356-32-32s14.356-32 32-32 32 14.356 32 32-14.356 32-32 32z" />
</font></defs></svg>
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
frontend/assets/fonts/planetposen-icons/fonts/planetposen-icons.ttf Normal file
View File

Binary file not shown.

BIN
frontend/assets/fonts/planetposen-icons/fonts/planetposen-icons.woff Normal file
View File

Binary file not shown.

1
frontend/assets/fonts/planetposen-icons/selection.json Normal file
View File

File diff suppressed because one or more lines are too long

81
frontend/assets/fonts/planetposen-icons/style.css Normal file
View File

@@ -0,0 +1,81 @@
@font-face {
font-family: 'planetposen-icons';
src: url('fonts/planetposen-icons.eot?11e7i0');
src: url('fonts/planetposen-icons.eot?11e7i0#iefix') format('embedded-opentype'),
url('fonts/planetposen-icons.ttf?11e7i0') format('truetype'),
url('fonts/planetposen-icons.woff?11e7i0') format('woff'),
url('fonts/planetposen-icons.svg?11e7i0#planetposen-icons') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
.icon {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'planetposen-icons' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon--at-outline:before {
content: "\e90b";
}
.icon--at:before {
content: "\e90c";
}
.icon--basket-outline:before {
content: "\e900";
}
.icon--basket:before {
content: "\e901";
}
.icon--card-outline:before {
content: "\e902";
}
.icon--card:before {
content: "\e903";
}
.icon--cart-outline:before {
content: "\e904";
}
.icon--cart:before {
content: "\e905";
}
.icon--cash-outline:before {
content: "\e906";
}
.icon--cash:before {
content: "\e907";
}
.icon--checkmark-circle-outline:before {
content: "\e913";
}
.icon--checkmark-circle:before {
content: "\e914";
}
.icon--close-circle-outline:before {
content: "\e908";
}
.icon--close-circle:before {
content: "\e909";
}
.icon--key-outline:before {
content: "\e92c";
}
.icon--key:before {
content: "\e92d";
}
.icon--lock-outline:before {
content: "\e92e";
}
.icon--lock:before {
content: "\e92f";
}

120
frontend/assets/fonts/planetposen-icons/style.scss Normal file
View File

@@ -0,0 +1,120 @@
@import "variables";
@font-face {
font-family: '#{$icomoon-font-family}';
src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?11e7i0');
src: url('#{$icomoon-font-path}/#{$icomoon-font-family}.eot?11e7i0#iefix') format('embedded-opentype'),
url('#{$icomoon-font-path}/#{$icomoon-font-family}.ttf?11e7i0') format('truetype'),
url('#{$icomoon-font-path}/#{$icomoon-font-family}.woff?11e7i0') format('woff'),
url('#{$icomoon-font-path}/#{$icomoon-font-family}.svg?11e7i0##{$icomoon-font-family}') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
.icon {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: '#{$icomoon-font-family}' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon--at-outline {
&:before {
content: $icon--at-outline;
}
}
.icon--at {
&:before {
content: $icon--at;
}
}
.icon--basket-outline {
&:before {
content: $icon--basket-outline;
}
}
.icon--basket {
&:before {
content: $icon--basket;
}
}
.icon--card-outline {
&:before {
content: $icon--card-outline;
}
}
.icon--card {
&:before {
content: $icon--card;
}
}
.icon--cart-outline {
&:before {
content: $icon--cart-outline;
}
}
.icon--cart {
&:before {
content: $icon--cart;
}
}
.icon--cash-outline {
&:before {
content: $icon--cash-outline;
}
}
.icon--cash {
&:before {
content: $icon--cash;
}
}
.icon--checkmark-circle-outline {
&:before {
content: $icon--checkmark-circle-outline;
}
}
.icon--checkmark-circle {
&:before {
content: $icon--checkmark-circle;
}
}
.icon--close-circle-outline {
&:before {
content: $icon--close-circle-outline;
}
}
.icon--close-circle {
&:before {
content: $icon--close-circle;
}
}
.icon--key-outline {
&:before {
content: $icon--key-outline;
}
}
.icon--key {
&:before {
content: $icon--key;
}
}
.icon--lock-outline {
&:before {
content: $icon--lock-outline;
}
}
.icon--lock {
&:before {
content: $icon--lock;
}
}

23
frontend/assets/fonts/planetposen-icons/variables.scss Normal file
View File

@@ -0,0 +1,23 @@
$icomoon-font-family: "planetposen-icons" !default;
// @import './frontend/assets/fonts/planetposen-icons/style.scss';
$icomoon-font-path: "assets/fonts/planetposen-icons/fonts" !default;
$icon--at-outline: "\e90b";
$icon--at: "\e90c";
$icon--basket-outline: "\e900";
$icon--basket: "\e901";
$icon--card-outline: "\e902";
$icon--card: "\e903";
$icon--cart-outline: "\e904";
$icon--cart: "\e905";
$icon--cash-outline: "\e906";
$icon--cash: "\e907";
$icon--checkmark-circle-outline: "\e913";
$icon--checkmark-circle: "\e914";
$icon--close-circle-outline: "\e908";
$icon--close-circle: "\e909";
$icon--key-outline: "\e92c";
$icon--key: "\e92d";
$icon--lock-outline: "\e92e";
$icon--lock: "\e92f";

BIN
frontend/assets/images/IMG_1122.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.5 MiB

91
frontend/components/Cart.vue Normal file
View File

@@ -0,0 +1,91 @@
<template>
<div class="container cart">
<div class="row header">
<div class="product">
<h2>Product</h2>
</div>
<div class="info">
<h2>Quantity</h2>
<h2>Price</h2>
</div>
</div>
<div class="row">
<div class="product">
<img src="https://planetposen.no/Planetposen/Kjp_na_files/Media/IMG_1244/IMG_1244.jpg" />
<div class="flex-direction-column">
<h3>Christmas joy</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
</div>
</div>
<div class="info">
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Cart'
}
</script>
<style lang="scss" scoped>
.cart {
width: 95%;
margin: 0 auto;
}
.row {
display: flex;
flex-direction: row;
height: 150px;
&.header {
height: min-content;
h2 {
font-weight: 300;
}
}
.product {
width: 60%;
height: 100%;
display: inherit;
flex-direction: inherit;
align-items: center;
img {
height: 100%;
width: auto;
margin-right: 2rem;
}
h3, p {
margin: 0;
}
h3 {
font-weight: 500;
font-size: 1.5rem;
margin-bottom: 0.5rem;
}
}
.info {
width: 40%;
display: inherit;
flex-direction: inherit;
h2 {
width: 50%;
}
}
}
</style>

102
frontend/components/Header.vue Normal file
View File

@@ -0,0 +1,102 @@
<template>
<header class="flex space-between">
<div>
<img class="logo" src="https://planetposen.no/Planetposen/Hjem_files/shapeimage_1.png" />
<router-link to="/" class="header-element">
<span>Hjem</span>
</router-link>
<router-link to="/" class="header-element">
<span>Om oss</span>
</router-link>
<router-link to="/" class="header-element">
<span>Produkter</span>
</router-link>
</div>
<div>
<!-- <i class="icon icon--profile"></i> -->
<router-link to="/cart">
<i class="icon icon--cart-outline header-element"></i>
</router-link>
</div>
</header>
</template>
<script>
export default {
name: 'Header'
}
</script>
<style lang="scss" scoped>
@import "./frontend/styles/variables";
$header-height: 80px;
header {
display: flex;
justify-content: space-between;
background-color: #3b945e; // 3
height: $header-height;
color: #f2f2f2; // 3
> div {
display: flex;
align-items: center;
height: $header-height;
a {
text-decoration: unset;
color: inherit;
height: 100%;
}
// background-color: $green; // 1
// background-color: #3aafa9; // 2
// background-color: #3b945e; // 3
// color: $text-color; // 1
// color: white; // 2
// color: #f2f2f2; // 3
.logo {
display: block;
height: 100%;
width: auto;
}
.header-element {
display: flex;
align-items: center;
padding: 0 0.7rem;
height: 100%;
cursor: pointer;
&:hover {
// background-color: #379683; // 1
background-color: #def2f1; // 2
// background-color: #57ba98; // 3
color: white; // 1
color: $text-color; // 2
color: #182628; // 3
// background-color: #8ee4af;
}
// &:first-of-type {
// margin-left: 5rem;
// }
span {
letter-spacing: 2.5px;
text-transform: lowercase;
font-weight: 300;
align-items: center;
}
}
.icon {
font-size: 1.75rem;
font-weight: 700;
}
}
}
</style>

34
frontend/components/Home.vue Normal file
View File

@@ -0,0 +1,34 @@
<template>
<div class="container">
<!-- <div class="img" :style="{'background-image': 'url(https://i.imgur.com/GTPZgje.jpg)'}"></div> -->
<div class="img" :style="{'background-image': 'url(./frontend/assets/images/IMG_1122.jpeg)'}"></div>
<h1>Welcome home</h1>
</div>
</template>
<script>
export default {
name: 'Home',
}
</script>
<style lang="scss" scoped>
.container {
height: 200vh;
}
.img {
height: calc(80vh - 80px);
width: 100vw;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
h1 {
font-weight: 500;
padding: 1rem;
margin: 0;
}
</style>

11
frontend/index.html Normal file
View File

@@ -0,0 +1,11 @@
<!DOCTYPE html>
<html>
<head>
<title>Planetposen</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
</head>
<body>
<div id="app"></div>
</body>
</html>

16
frontend/main.js Normal file
View File

@@ -0,0 +1,16 @@
import Vue from 'vue'
import VueRouter from 'vue-router'
import router from './routes'
// import store from './store'
import App from './App.vue'
Vue.use(VueRouter)
new Vue({
el: '#app',
router,
// store,
components: { App },
render: h => h(App)
})

117
frontend/modules/playerModule.js Normal file
View File

@@ -0,0 +1,117 @@
export default {
namespaced: true,
state: {
player: undefined,
playlist: [],
authenticatedAdmin: false,
channelSettings: null,
clientSettings: null,
nowPlaying: null,
userSuggested: [],
externalSuggested: [],
PLAYER_STATES: {
BUFFERING: 3,
CUED: 5,
ENDED: 0,
PAUSED: 2,
PLAYING: 1,
UNSTARTED: -1
},
socket: null,
channel: "summér"
},
getters: {
channel: state => {
return state.channel;
},
socket: state => {
return state.socket
},
PLAYER_STATES: state => {
return state.PLAYER_STATES;
},
authenticatedAdmin: state => {
return state.authenticatedAdmin;
},
playlist: state => {
return state.playlist;
},
channelSettings: state => {
return state.channelSettings;
},
clientSettings: state => {
return state.clientSettings;
},
nowPlaying: state => {
return state.nowPlaying;
},
userSuggested: state => {
return state.userSuggested;
},
externalSuggested: state => {
return state.externalSuggested;
},
player: state => {
return state.player;
}
},
mutations: {
SET_CHANNEL: (state, channel) => {
state.channel = channel;
},
SET_AUTHENTICATED_ADMIN: (state, authenticatedAdmin) => {
state.authenticatedAdmin = authenticatedAdmin;
},
SET_PLAYLIST: (state, playlist) => {
state.playlist = playlist;
},
SET_CHANNEL_SETTINGS: (state, channelSettings) => {
state.channelSettings = channelSettings;
},
SET_CLIENT_SETTINGS: (state, clientSettings) => {
state.clientSettings = clientSettings;
},
SET_NOW_PLAYING: (state, nowPlaying) => {
state.nowPlaying = nowPlaying;
},
SET_USER_SUGGESTED: (state, userSuggested) => {
state.userSuggested = userSuggested;
},
SET_EXTERNAL_SUGGESTED: (state, externalSuggested) => {
state.externalSuggested = externalSuggested;
},
SET_PLAYER: (state, player) => {
state.player = player;
}
},
actions: {
setChannel({ commit }, channel) {
commit("SET_CHANNEL", channel.toLowerCase());
},
setAuthenticatedAdmin({ commit }, authenticatedAdmin) {
commit("SET_AUTHENTICATED_ADMIN", authenticatedAdmin);
},
setPlaylist({ commit }, playlist) {
commit("SET_PLAYLIST", playlist);
},
setChannelSettings({ commit }, channelSettings) {
commit("SET_CHANNEL_SETTINGS", channelSettings);
},
setClientSettings({ commit }, clientSettings) {
commit("SET_CLIENT_SETTINGS", clientSettings);
},
setNowPlaying({ commit }, nowPlaying) {
commit("SET_NOW_PLAYING", nowPlaying);
},
setUserSuggested({ commit }, userSuggested) {
commit("SET_USER_SUGGESTED", userSuggested);
},
setExternalSuggested({ commit }, externalSuggested) {
commit("SET_EXTERNAL_SUGGESTED", externalSuggested);
},
setPlayer({ commit }, player) {
commit("SET_PLAYER", player);
}
}
};

36
frontend/routes.js Normal file
View File

@@ -0,0 +1,36 @@
import Vue from 'vue'
import VueRouter from 'vue-router';
Vue.use(VueRouter)
let routes = [
{
name: 'Home',
path: '/',
component: (resolve) => require(['./components/Home.vue'], resolve)
},
{
name: 'Cart',
path: '/cart',
component: (resolve) => require(['./components/Cart.vue'], resolve)
},
// {
// name: 'styleguide',
// path: '/styleguide',
// component: (resolve) => require(['./components/Styleguide.vue'], resolve)
// },
// {
// name: '404',
// path: '/404',
// component: (resolve) => require(['./components/404.vue'], resolve)
// }
];
const router = new VueRouter({
mode: 'hash',
base: '/',
routes,
linkActiveClass: 'is-active'
});
export default router;

14
frontend/store.js Normal file
View File

@@ -0,0 +1,14 @@
import Vue from 'vue';
import Vuex from 'vuex';
import playerModule from '@/modules/playerModule';
Vue.use(Vuex);
const store = new Vuex.Store({
modules: {
playerModule
}
})
export default store;

17
frontend/styles/global.scss Normal file
View File

@@ -0,0 +1,17 @@
.flex {
display: flex;
}
.justify-content-center {
justify-content: center;
}
.align-items-center {
align-items: center;
}
.flex-direction-column {
display: flex;
flex-direction: column;
}

1
frontend/styles/icons.scss Normal file
View File

@@ -0,0 +1 @@
@import './frontend/assets/fonts/planetposen-icons/style.scss';

6
frontend/styles/normalize.scss vendored Normal file
View File

@@ -0,0 +1,6 @@
body {
margin: 0;
padding: 0;
font-family: sans-serif;
}

3
frontend/styles/variables.scss Normal file
View File

@@ -0,0 +1,3 @@
$green: #5cdb95;
$text-color: #05386B;

53
package.json Normal file
View File

@@ -0,0 +1,53 @@
{
"name": "planetposen",
"version": "0.1.0",
"description": "homepage for planetposen - selling sustialable giftbags",
"main": "server.js",
"repository": "git@github.com:kevinmidboe/planetposen.git",
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --progress"
},
"author": "KevinMidboe <kevin.midboe@gmail.com>",
"license": "MIT",
"dependencies": {
"@babel/polyfill": "~7.2",
"clean-webpack-plugin": "^3.0.0",
"extract-text-webpack-plugin": "^3.0.2",
"moment": "^2.24.0",
"node-fetch": "^2.6.0",
"node-sass": "^4.13.0",
"vue": "~2.6",
"vue-router": "~3.0",
"vuex": "^3.1.1"
},
"devDependencies": {
"@babel/core": "~7.2",
"@babel/plugin-proposal-class-properties": "~7.3",
"@babel/plugin-proposal-decorators": "~7.3",
"@babel/plugin-proposal-json-strings": "~7.2",
"@babel/plugin-syntax-dynamic-import": "~7.2",
"@babel/plugin-syntax-import-meta": "~7.2",
"@babel/preset-env": "~7.3",
"babel-loader": "~8.0",
"compression-webpack-plugin": "~2.0",
"cross-env": "^6.0.3",
"css-loader": "^3.2.0",
"file-loader": "^4.2.0",
"friendly-errors-webpack-plugin": "~1.7",
"html-webpack-plugin": "~3.2",
"mini-css-extract-plugin": "~0.5",
"optimize-css-assets-webpack-plugin": "~3.2",
"sass-loader": "~7.1",
"uglifyjs-webpack-plugin": "~1.2",
"url-loader": "^2.2.0",
"vue-loader": "~15.6",
"vue-style-loader": "~4.1",
"vue-template-compiler": "~2.6",
"webpack": "~4.29",
"webpack-bundle-analyzer": "^3.6.0",
"webpack-cli": "~3.2",
"webpack-dev-server": "~3.1",
"webpack-hot-middleware": "~2.24",
"webpack-merge": "~4.2"
}
}

9
webpack.config.js Normal file
View File

@@ -0,0 +1,9 @@
"use strict";
const environment = (process.env.NODE_ENV || "development").trim();
if (environment === "development") {
module.exports = require("./config/webpack.config.dev");
} else {
module.exports = require("./config/webpack.config.prod");
}

7340
yarn.lock Normal file
View File

File diff suppressed because it is too large Load Diff