diff --git a/Makefile b/Makefile index b34ec80..dbda126 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,5 @@ .PHONY: \ + build \ clean \ check_code_format \ format_code \ @@ -9,7 +10,11 @@ run \ test +build: + python3 ./manage.py collectstatic + clean: + rm -rf static \ # https://stackoverflow.com/a/41386937/162086 python3 -Bc "for p in __import__('pathlib').Path('.').rglob('*.py[co]'): p.unlink()"; \ python3 -Bc "for p in __import__('pathlib').Path('.').rglob('__pycache__'): p.rmdir()" diff --git a/friendly_cat/static/friendly_cat/css/style.css b/friendly_cat/static/friendly_cat/css/style.css new file mode 100644 index 0000000..52ec185 --- /dev/null +++ b/friendly_cat/static/friendly_cat/css/style.css @@ -0,0 +1,45 @@ +html, +body { + background: #d0d0d0; + height: 100%; +} + +.friendly-cat-container { + align-items: center; + display: flex; + flex-direction: column; + justify-content: center; + height: 100%; +} + +.friendly-cat-frame { + line-height: 0; +} + +.friendly-cat-picture { + border: 1rem solid; + border-image-slice: 1; + border-width: 1rem; + border-image-source: linear-gradient( + to right, + red, + orange, + yellow, + green, + cyan, + blue, + violet + ); +} + +.friendly-cat-caption { + background-color: #404040; + color: #f0f0f0; + /* https://markdotto.com/2018/02/07/github-system-fonts/#the-stack */ + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, + sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + font-size: 1rem; + line-height: 1rem; + padding: 0.5rem; + text-align: center; +} diff --git a/friendly_cat/templates/friendly_cat/index.html b/friendly_cat/templates/friendly_cat/index.html index 3e0962c..6351acb 100644 --- a/friendly_cat/templates/friendly_cat/index.html +++ b/friendly_cat/templates/friendly_cat/index.html @@ -1,21 +1,31 @@ - +{% load static %}