colors from template

This commit is contained in:
ville rantanen
2018-07-01 21:26:59 +03:00
parent 99fa595cd4
commit 3d35abbb50
4 changed files with 82 additions and 35 deletions

View File

@@ -11,6 +11,7 @@ The name comes from mispronouncing "files" very badly.
- `cp data/config.json.example data/config.json` - `cp data/config.json.example data/config.json`
- `cp data/shares.json.example data/shares.json` - `cp data/shares.json.example data/shares.json`
- `touch code/notifier.py` - `touch code/notifier.py`
- `touch code/static/css/user.css`
- `docker-compose up --build` - `docker-compose up --build`
- open URL: http://localhost:8136/list/test - open URL: http://localhost:8136/list/test
- `pip install code/manager-requirements.txt` - `pip install code/manager-requirements.txt`

View File

@@ -4,37 +4,56 @@ html {
} }
body { body {
color: #0E6251; color: var(--text-color);
background-color: #FDF2E9; background-color: var(--background-light-color);
min-height: 600px; min-height: 600px;
font: 14px/1.3 'Segoe UI',Arial, sans-serif; font: 14px/1.3 'Segoe UI',Arial, sans-serif;
margin: 8px; margin: 8px;
} }
a:visited { a:visited {
color: #0E3221; color: var(--text-color);
} }
a:link { a:link {
color: #0E6251; color: var(--text-color);
} }
#page { #page {
padding-bottom: 60px; padding-bottom: 60px;
} }
#footer { #footer {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 9vw; left: 9vw;
width: 80vw; width: 80vw;
height: 23px; height: 23px;
background-color: #FAE5D3; text-align: center;
text-align: center; padding-top: 7px;
padding-top: 7px; background-color: var(--background-dark-color);
background: #fdf2e9; /* Old browsers */ background: var(--background-dark-color); /* Old browsers */
background: -moz-linear-gradient(left, #fdf2e9 0%, #fae5d3 50%, #fdf2e9 100%); /* FF3.6-15 */ background: -moz-linear-gradient(
background: -webkit-linear-gradient(left, #fdf2e9 0%,#fae5d3 50%,#fdf2e9 100%); /* Chrome10-25,Safari5.1-6 */ left,
background: linear-gradient(to right, #fdf2e9 0%,#fae5d3 50%,#fdf2e9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ var(--background-light-color) 0%,
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdf2e9', endColorstr='#fdf2e9',GradientType=1 ); /* IE6-9 */ var(--background-dark-color) 50%,
var(--background-light-color) 100%
); /* FF3.6-15 */
background: -webkit-linear-gradient(
left,
var(--background-light-color) 0%,
var(--background-dark-color) 50%,
var(--background-light-color) 100%
); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(
to right,
var(--background-light-color) 0%,
var(--background-dark-color) 50%,
var(--background-light-color) 100%
); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient(
startColorstr='var(--background-light-color)',
endColorstr='var(--background-dark-color)',
GradientType=1
); /* IE6-9 */
} }
.version_number { .version_number {
font-size: xx-small; font-size: xx-small;
@@ -54,15 +73,17 @@ td,th {
} }
th { th {
cursor: pointer; cursor: pointer;
background: #FDF2E9; background: var(--background-light-color);
} }
tr:nth-child(odd) { tr:nth-child(odd) {
background-color: #FAE5D3; background-color: var(--background-dark-color);
background: -moz-linear-gradient(left, #fae5d3 0%, #fae5d3 95%, #fdf2e9 100%); background: linear-gradient(
background: -webkit-linear-gradient(left, #fae5d3 0%,#fae5d3 95%,#fdf2e9 100%); to right,
background: linear-gradient(to right, #fae5d3 0%,#fae5d3 95%,#fdf2e9 100%); var(--background-dark-color) 0%,
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fae5d3', endColorstr='#fdf2e9',GradientType=1 ); var(--background-dark-color) 95%,
var(--background-light-color) 100%
);
} }
.td_right { .td_right {
@@ -88,8 +109,8 @@ tr:nth-child(odd) {
} }
#list_menu, #list_script { #list_menu, #list_script {
padding: 8px; padding: 8px;
border: 4px solid #148F77; border: 4px solid var(--border-color);
background-color: #FAE5D3; background-color: var(--background-dark-color);
line-height: 1.5em; line-height: 1.5em;
position: absolute; position: absolute;
width: 20em; width: 20em;
@@ -144,11 +165,11 @@ tr:nth-child(odd) {
background: linear-gradient( background: linear-gradient(
to bottom, to bottom,
transparent, transparent 5%, transparent, transparent 5%,
#148F77 5%, #148F77 25%, var(--text-color) 5%, var(--text-color) 25%,
transparent 25%, transparent 40%, transparent 25%, transparent 40%,
#148F77 40%, #148F77 60%, var(--text-color) 40%, var(--text-color) 60%,
transparent 60%, transparent 75%, transparent 60%, transparent 75%,
#148F77 75%, #148F77 95%, var(--text-color) 75%, var(--text-color) 95%,
transparent 95%, transparent 100% transparent 95%, transparent 100%
); );
} }
@@ -191,7 +212,7 @@ tr:nth-child(odd) {
} }
.code { .code {
background-color: #FDF2E9; background-color: var(--background-light-color);
font-family: monospace; font-family: monospace;
margin-right: 2em; margin-right: 2em;
margin-bottom: 1em; margin-bottom: 1em;
@@ -208,8 +229,8 @@ tr:nth-child(odd) {
#index_menu { #index_menu {
float:right; float:right;
padding: 12px; padding: 12px;
border: 4px solid #148F77; border: 4px solid var(--border-color);
background-color: #FAE5D3; background-color: var(--background-dark-color);
line-height: 2em; line-height: 2em;
-webkit-border-bottom-left-radius: 15px; -webkit-border-bottom-left-radius: 15px;
-moz-border-radius-bottomleft: 15px; -moz-border-radius-bottomleft: 15px;
@@ -223,14 +244,14 @@ tr:nth-child(odd) {
} }
#progress { #progress {
margin: 4px 4px 4px 4px; margin: 4px 4px 4px 4px;
} }
#progress.success { #progress.success {
color: green; color: green;
} }
#progress.failure { #progress.failure {
color: red; color: red;
} }
.sortarrow { .sortarrow {

View File

@@ -1,7 +1,9 @@
<!doctype html> <!doctype html>
<head> <head>
<title>Flees</title> <title>Flees</title>
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/colors.css') }}">
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/styles.css') }}"> <link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/styles.css') }}">
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/user.css') }}">
<link rel="icon" href="{{ url_for('static', filename='css/flees.ico') }}" type="image/x-icon" /> <link rel="icon" href="{{ url_for('static', filename='css/flees.ico') }}" type="image/x-icon" />
<script src="{{ url_for('static', filename='js/tablesort.js') }}" type="text/javascript"></script> <script src="{{ url_for('static', filename='js/tablesort.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static', filename='js/scripts.js') }}" type="text/javascript"></script> <script src="{{ url_for('static', filename='js/scripts.js') }}" type="text/javascript"></script>

23
create_config.sh Executable file
View File

@@ -0,0 +1,23 @@
#!/bin/bash
set -x
test -f .env || cp env.example .env
test -f data/config.json || cp data/config.json.example data/config.json
test -f data/shares.json || cp data/shares.json.example data/shares.json
test -f code/notifier.py || touch code/notifier.py
test -f code/static/css/colors.css || {
echo '
:root {
--background-light-color: #FDF2E9;
--background-dark-color: #FAE5D3;
--text-color: #0E6251;
--border-color: #0E6251;
}
' > code/static/css/colors.css
}
test -f code/static/css/user.css || touch code/static/css/user.css
set +x
echo Now edit data/config.json
echo See README.md