From 2411b8cf4bf574c6fd9e9315743df367feacef25 Mon Sep 17 00:00:00 2001 From: Daniel Egger Date: Wed, 2 Feb 2022 21:51:03 +0100 Subject: [PATCH] Add tailwind and basic base.html styling --- .dockerignore | 2 + .gitignore | 2 + .readthedocs.yml | 12 - gulpfile.js | 20 +- package.json | 6 +- .../static/sass/custom_bootstrap_vars.scss | 0 vbv_lernwelt/static/sass/project.scss | 37 --- vbv_lernwelt/static/tailwind/input.css | 3 + vbv_lernwelt/templates/base.html | 234 ++++++++++++------ 9 files changed, 164 insertions(+), 152 deletions(-) delete mode 100644 .readthedocs.yml delete mode 100644 vbv_lernwelt/static/sass/custom_bootstrap_vars.scss create mode 100644 vbv_lernwelt/static/tailwind/input.css diff --git a/.dockerignore b/.dockerignore index 5518e60a..b4d081d7 100644 --- a/.dockerignore +++ b/.dockerignore @@ -8,3 +8,5 @@ .readthedocs.yml .travis.yml venv +.direnv +node_modules diff --git a/.gitignore b/.gitignore index 5a1f20e2..b96ee850 100644 --- a/.gitignore +++ b/.gitignore @@ -278,3 +278,5 @@ project.min.css vendors.js *.min.js .env + +package-lock.json diff --git a/.readthedocs.yml b/.readthedocs.yml deleted file mode 100644 index b4cf0c08..00000000 --- a/.readthedocs.yml +++ /dev/null @@ -1,12 +0,0 @@ -version: 2 - -sphinx: - configuration: docs/conf.py - -build: - image: testing - -python: - version: 3.9 - install: - - requirements: requirements/local.txt diff --git a/gulpfile.js b/gulpfile.js index 3059801d..c454feea 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -11,14 +11,13 @@ const autoprefixer = require('autoprefixer') const browserSync = require('browser-sync').create() const cssnano = require ('cssnano') -const imagemin = require('gulp-imagemin') const pixrem = require('pixrem') const plumber = require('gulp-plumber') const postcss = require('gulp-postcss') const reload = browserSync.reload const rename = require('gulp-rename') const sass = require('gulp-sass')(require('sass')) -const spawn = require('child_process').spawn +// const spawn = require('child_process').spawn const uglify = require('gulp-uglify-es').default // Relative paths function @@ -77,22 +76,6 @@ function scripts() { .pipe(dest(paths.js)) } -// Image compression -function imgCompression() { - return src(`${paths.images}/*`) - .pipe(imagemin()) // Compresses PNG, JPEG, GIF and SVG images - .pipe(dest(paths.images)) -}// Run django server -function asyncRunServer() { - var cmd = spawn('gunicorn', [ - 'config.asgi', '-k', 'uvicorn.workers.UvicornWorker', '--reload' - ], {stdio: 'inherit'} - ) - cmd.on('close', function(code) { - console.log('gunicorn exited with code ' + code) - }) -} - // Browser sync server for live reload function initBrowserSync() { browserSync.init( @@ -129,7 +112,6 @@ function watchPaths() { const generateAssets = parallel( styles, scripts, - imgCompression ) // Set up dev environment diff --git a/package.json b/package.json index 4b80b901..39d89bfb 100644 --- a/package.json +++ b/package.json @@ -1,13 +1,11 @@ { "name": "vbv_lernwelt", "version": "0.1.0", - "dependencies": {}, "devDependencies": { "autoprefixer": "^10.4.0", "browser-sync": "^2.27.7", "cssnano": "^5.0.11", "gulp": "^4.0.2", - "gulp-imagemin": "^7.1.0", "gulp-plumber": "^1.2.1", "gulp-postcss": "^9.0.1", "gulp-rename": "^2.0.0", @@ -15,7 +13,8 @@ "gulp-uglify-es": "^3.0.0", "pixrem": "^5.0.0", "postcss": "^8.3.11", - "sass": "^1.43.4" + "sass": "^1.43.4", + "tailwindcss": "^3.0.18" }, "engines": { "node": "16" @@ -25,6 +24,7 @@ ], "scripts": { "dev": "gulp", + "tailwind": "tailwindcss -i ./vbv_lernwelt/static/tailwind/input.css -o ./vbv_lernwelt/static/css/output.css --watch", "build": "gulp generate-assets" } } diff --git a/vbv_lernwelt/static/sass/custom_bootstrap_vars.scss b/vbv_lernwelt/static/sass/custom_bootstrap_vars.scss deleted file mode 100644 index e69de29b..00000000 diff --git a/vbv_lernwelt/static/sass/project.scss b/vbv_lernwelt/static/sass/project.scss index 3c8f2616..e69de29b 100644 --- a/vbv_lernwelt/static/sass/project.scss +++ b/vbv_lernwelt/static/sass/project.scss @@ -1,37 +0,0 @@ - - - - -// project specific CSS goes here - -//////////////////////////////// - //Variables// -//////////////////////////////// - -// Alert colors - -$white: #fff; -$mint-green: #d6e9c6; -$black: #000; -$pink: #f2dede; -$dark-pink: #eed3d7; -$red: #b94a48; - -//////////////////////////////// - //Alerts// -//////////////////////////////// - -// bootstrap alert CSS, translated to the django-standard levels of -// debug, info, success, warning, error - -.alert-debug { - background-color: $white; - border-color: $mint-green; - color: $black; -} - -.alert-error { - background-color: $pink; - border-color: $dark-pink; - color: $red; -} diff --git a/vbv_lernwelt/static/tailwind/input.css b/vbv_lernwelt/static/tailwind/input.css new file mode 100644 index 00000000..b5c61c95 --- /dev/null +++ b/vbv_lernwelt/static/tailwind/input.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/vbv_lernwelt/templates/base.html b/vbv_lernwelt/templates/base.html index 700eca41..56b4fd91 100644 --- a/vbv_lernwelt/templates/base.html +++ b/vbv_lernwelt/templates/base.html @@ -1,106 +1,178 @@ {% load static i18n %} {% get_current_language as LANGUAGE_CODE %} - - - - {% block title %}VBV Lernwelt{% endblock title %} - - - + + + + {% block title %}VBV Lernwelt{% endblock title %} + + + - + - {% block css %} + {% block css %} - {% endblock %} - - {# Placed at the top of the document so pages load faster with defer #} - {% block javascript %} - - - + + {% endblock %} + + {# Placed at the top of the document so pages load faster with defer #} + {% block javascript %} + + + - {% endblock javascript %} + {% endblock javascript %} - + - - -
- + +
+
+
+ VBV Ausbildungsportal
-
+
Kurse / Shop
+
Infos zu Berufen
+
Branchennews
+
+
- {% if messages %} - {% for message in messages %} -
- {{ message }} - +
+ + {% if messages %} + {% for message in messages %} +
+ {{ message }} + +
+ {% endfor %} + {% endif %} +
+ + +{% block content %} +
+
+ +
+

Machen Sie hier eine Selbstevaluation

+

Hier steht noch etwas mehr Text

+
+
+
+ +
+
+ +
+
+ image +
+ + Kurs X +
- {% endfor %} - {% endif %} +
+
- {% block content %} -

Use this document as a way to quick start any new project.

- {% endblock content %} +
+
+ image +
+ + Kurs Y + +
+
+
-
+
+
+ image +
+ + Kurs Z + +
+
+
+
+

weitere Kurse entdecken und buchen

- {% block modal %}{% endblock modal %} +
+
- {% block inline_javascript %} - {% comment %} + +{% endblock content %} + + +{% block modal %}{% endblock modal %} + +{% block inline_javascript %} + {% comment %} Script tags with only code, no src (defer by default). To run with a "defer" so that you run inline code: - {% endcomment %} - {% endblock inline_javascript %} - + {% endcomment %} +{% endblock inline_javascript %} +