Add SASS preprocessing

This commit is contained in:
Sascha Ißbrücker 2019-06-29 14:03:29 +02:00
parent 10b1570a64
commit 5fad8b798d
9 changed files with 139 additions and 9 deletions

64
.gitignore vendored
View File

@ -158,5 +158,69 @@ venv.bak/
# mypy
.mypy_cache/
### Node template
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Runtime data
pids
*.pid
*.seed
*.pid.lock
# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov
# Coverage directory used by tools like istanbul
coverage
# nyc test coverage
.nyc_output
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
.grunt
# Bower dependency directory (https://bower.io/)
bower_components
# node-waf configuration
.lock-wscript
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
jspm_packages/
# TypeScript v1 declaration files
typings/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Optional REPL history
.node_repl_history
# Output of 'npm pack'
*.tgz
# Yarn Integrity file
.yarn-integrity
# dotenv environment variables file
.env
# next.js build output
.next
### Custom
polls
tmp

4
.idea/watcherTasks.xml Normal file
View File

@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectTasksOptions" suppressed-tasks="SCSS" />
</project>

View File

@ -0,0 +1 @@
@import "../../node_modules/spectre.css/src/spectre";

View File

@ -4,12 +4,14 @@
{% block content %}
<div>
<h2>Bookmarks</h2>
<a href="{% url 'bookmarks:new' %}">Add</a>
<a href="{% url 'bookmarks:new' %}" class="btn btn-primary">Add</a>
</div>
<div>
<form method="get">
<input type="search" name="q" placeholder="Search..." value="{{ query }}">
<input type="submit" value="Search">
<div class="input-group">
<input type="search" name="q" placeholder="Search..." value="{{ query }}">
<input type="submit" value="Search" class="btn input-group-btn">
</div>
</form>
</div>
<ul class="bookmark-list">

View File

@ -1,8 +1,13 @@
{% load static %}
{% load sass_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>linkdings</title>
{# Include SASS styles, files are resolved from bookmarks/styles #}
<link href="{% sass_src 'base.scss' %}" rel="stylesheet" type="text/css" />
</head>
<body>
<header>

13
package-lock.json generated Normal file
View File

@ -0,0 +1,13 @@
{
"name": "linkdings",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"spectre.css": {
"version": "0.5.8",
"resolved": "https://registry.npmjs.org/spectre.css/-/spectre.css-0.5.8.tgz",
"integrity": "sha512-3N4WocWY+Dl6b3e5v3nsZYyp+VSDcBfGDzyyHw/H78ie9BoAhHkxmrhLxo9y8RadxYzVrPjfPdlev3hXEUzR2w=="
}
}
}

23
package.json Normal file
View File

@ -0,0 +1,23 @@
{
"name": "linkdings",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/sissbruecker/linkdings.git"
},
"keywords": [],
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/sissbruecker/linkdings/issues"
},
"homepage": "https://github.com/sissbruecker/linkdings#readme",
"dependencies": {
"spectre.css": "^0.5.8"
}
}

View File

@ -2,10 +2,17 @@ beautifulsoup4==4.7.1
certifi==2019.6.16
chardet==3.0.4
Django==2.2.2
django-appconf==1.0.3
django-compressor==2.3
django-picklefield==2.0
django-sass-processor==0.7.3
idna==2.8
libsass==0.19.2
pytz==2019.1
rcssmin==1.0.6
requests==2.22.0
rjsmin==1.1.0
six==1.12.0
soupsieve==1.9.2
sqlparse==0.3.0
urllib3==1.25.3

View File

@ -15,7 +15,6 @@ import os
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/2.2/howto/deployment/checklist/
@ -27,7 +26,6 @@ DEBUG = True
ALLOWED_HOSTS = []
# Application definition
INSTALLED_APPS = [
@ -38,6 +36,7 @@ INSTALLED_APPS = [
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'sass_processor',
]
MIDDLEWARE = [
@ -70,7 +69,6 @@ TEMPLATES = [
WSGI_APPLICATION = 'siteroot.wsgi.application'
# Database
# https://docs.djangoproject.com/en/2.2/ref/settings/#databases
@ -81,7 +79,6 @@ DATABASES = {
}
}
# Password validation
# https://docs.djangoproject.com/en/2.2/ref/settings/#auth-password-validators
@ -100,7 +97,6 @@ AUTH_PASSWORD_VALIDATORS = [
},
]
# Internationalization
# https://docs.djangoproject.com/en/2.2/topics/i18n/
@ -114,8 +110,23 @@ USE_L10N = True
USE_TZ = True
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.2/howto/static-files/
STATIC_URL = '/static/'
# Location where generated CSS files are saved
SASS_PROCESSOR_ROOT = os.path.join(BASE_DIR, 'bookmarks', 'static', 'build')
# Add SASS preprocessor finder to resolve generated CSS
STATICFILES_FINDERS = [
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
'sass_processor.finders.CssFinder',
]
# Include SASS styles into static path, otherwise they can not be found by the SASS preprocessor
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'bookmarks', 'styles'),
]