Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/noid/cardcolor #151

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Feature/noid/cardcolor #151

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8f23e8f
Add color to cards globally and locally
newhinton Apr 22, 2020
f1d1510
Add color to collection
newhinton Apr 22, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions dashmachine/main/models.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ class Apps(db.Model):
tags = db.Column(db.String())
type = db.Column(db.String())
urls = db.Column(db.String())
color = db.Column(db.String())


class DataSources(db.Model):
Expand Down
16 changes: 16 additions & 0 deletions dashmachine/main/read_config.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,8 @@ def read_config():

settings.accent = config["Settings"].get("accent", "orange")

settings.cardcolor = config["Settings"].get("cardcolor", False)

settings.background = config["Settings"].get("background", "None")

if "roles" in config["Settings"]:
Expand Down Expand Up @@ -168,6 +170,20 @@ def read_config():

app.urls = config[section].get("urls", None)

app.color = config[section].get("color", None)

if app.color is not None:
app.colorR = int(app.color[1:3], 16)
app.colorG = int(app.color[3:5], 16)
app.colorB = int(app.color[5:7], 16)
app.color = str(app.colorR)+","+str(app.colorG)+","+str(app.colorB)

if app.color is None and settings.cardcolor == "True":
app.color = "var(--theme-primary-rgb)"

if app.color is None:
app.color = ""

if "groups" in config[section]:
for group_name in config[section]["groups"].split(","):
if not Groups.query.filter_by(name=group_name.strip()).first():
Expand Down
19 changes: 19 additions & 0 deletions dashmachine/static/css/global/dashmachine-theme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
--theme-surface-1: #fcfcfc;
--theme-surface-2: #e0e0e0;
--theme-primary: #FF9966;
--theme-primary-rgb: 255, 153, 102;
--theme-secondary: #9e9e9e;
--theme-accent: #3399FF;
--theme-color-font: #2c2f3a;
Expand All @@ -28,65 +29,83 @@
}
[data-accent="red"] {
--theme-primary: #f44336;
--theme-primary-rgb: 244, 67, 54;
}
[data-accent="pink"] {
--theme-primary: #e91e63;
--theme-primary-rgb: 233, 30, 99;
}
[data-accent="purple"] {
--theme-primary: #9c27b0;
--theme-primary-rgb: 156, 39, 176;
}
[data-accent="deepPurple"] {
--theme-primary: #673ab7;
--theme-primary-rgb: 103, 58, 183;
}
[data-accent="indigo"] {
--theme-primary: #3f51b5;
--theme-primary-rgb: 63, 81, 181;
}
[data-accent="blue"] {
--theme-primary: #2196f3;
--theme-primary-rgb: 33, 150, 243;
}
[data-accent="lightBlue"] {
--theme-primary: #03a9f4;
--theme-primary-rgb: 3, 169, 244;
--theme-on-primary: #2c2f3a;
}
[data-accent="cyan"] {
--theme-primary: #00bcd4;
--theme-primary-rgb: 0, 188, 212;
--theme-on-primary: #2c2f3a;
}
[data-accent="teal"] {
--theme-primary: #009688;
--theme-primary-rgb: 0, 150, 136;
}
[data-accent="green"] {
--theme-primary: #4caf50;
--theme-primary-rgb: 76, 175, 80;
--theme-on-primary: #2c2f3a;
}
[data-accent="lightGreen"] {
--theme-primary: #8bc34a;
--theme-primary-rgb: 139, 195, 74;
--theme-on-primary: #2c2f3a;
}
[data-accent="lime"] {
--theme-primary: #cddc39;
--theme-primary-rgb: 205, 220, 57;
--theme-on-primary: #2c2f3a;
}
[data-accent="yellow"] {
--theme-primary: #ffeb3b;
--theme-primary-rgb: 255, 235, 59;
--theme-on-primary: #2c2f3a;
}
[data-accent="amber"] {
--theme-primary: #ffc107;
--theme-primary-rgb: 255, 193, 7;
--theme-on-primary: #2c2f3a;
}
[data-accent="deepOrange"] {
--theme-primary: #ff5722;
--theme-primary-rgb: 255, 87, 34;
}
[data-accent="brown"] {
--theme-primary: #795548;
--theme-primary-rgb: 121, 85, 72;
}
[data-accent="grey"] {
--theme-primary: #9e9e9e;
--theme-primary-rgb: 158, 158, 158;
--theme-on-primary: #2c2f3a;
}
[data-accent="blueGrey"] {
--theme-primary: #607d8b;
--theme-primary-rgb: 96, 125, 139;
}
/* THEME CLASSES */
.theme-surface {
Expand Down
8 changes: 4 additions & 4 deletions dashmachine/templates/main/macros.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

{% macro App(app) %}
<div class="col s12 m6 l4 xl3 app-card">
<div class="card theme-surface-transparent">
<div class="card theme-surface-transparent" {% if app.color %}style="background: rgba({{ app.color }},0.7) !important;"{% endif %}>
{{ AppAnchor(app) }}
<div class="card-content center-align scrollbar pt-3 pb-0" style="max-height: 86px; min-height: 86px; scrollbar-width: none;">
{% if app.data_sources.count() > 0 %}
Expand All @@ -39,7 +39,7 @@
</div>
</a>
<div class="card-action center-align scrollbar pr-0" style="max-height: 60px; min-height: 60px; scrollbar-width: none;">
<span class="app-name-{{ app.id }} font-weight-900 card-title theme-primary-text searchable" style="font-size: 1.2rem">{{ app.name }}
<span class="app-name-{{ app.id }} font-weight-900 card-title theme-primary-text searchable" style="font-size: 1.2rem; {% if app.color.startswith("var") %}color: var(--theme-on-primary) !important;{% endif %}">{{ app.name }}
<i class="material-icons activator right theme-secondary-text" style="margin-left: 0px;">more_vert</i>
{% if app.data_sources.count() > 0 %}
<i class="material-icons pointer right theme-secondary-text refresh-data-source-btn">refresh</i>
Expand All @@ -63,9 +63,9 @@

{% macro Collection(app) %}
<div class="col s12 m6 l4 xl3 app-card">
<div class="card theme-surface-transparent scrollbar" style="max-height: 146px; min-height: 146px;">
<div class="card theme-surface-transparent scrollbar" style="max-height: 146px; min-height: 146px; {% if app.color %}background: rgba({{ app.color }},0.7) !important;{% endif %}">
<div class="card-content">
<span class="font-weight-900 card-title theme-primary-text">
<span class="font-weight-900 card-title theme-primary-text" {% if app.color.startswith("var") %}style="color: var(--theme-on-primary) !important;"{% endif %}>
{% if app.icon %}
<i class="material-icons-outlined right">{{app.icon}}</i>
{% endif %}
Expand Down
3 changes: 2 additions & 1 deletion readme_cards.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,10 +22,11 @@ groups = admin_only
| open_in | Yes | open the app in the current tab, an iframe or a new tab | iframe, new_tab, this_tab |
| icon | Yes | Icon for the dashboard. | /static/images/icons/yourpicture.png, external link to image |
| sidebar_icon | No | Icon for the sidenav. | /static/images/icons/yourpicture.png, external link to image |
| description | No | A short description for the app. | HTML |
| description | No | A short description for the app. | HTML |
| data_sources | No | Data sources to be included on the app's card.*Note: you must have a data source set up in the config above this application entry. | comma separated string |
| tags | No | Optionally specify tags for organization on /home | comma separated string |
| groups | No | Optionally specify the access groups that can see this app. | comma separated string |
| color | No | Optionally specify the color of the card | 6-Digit Hex Code (eg. #3399FF) |

##### Collection
These entries provide a card on the dashboard containing a list of links.
Expand Down
1 change: 1 addition & 0 deletions readme_settings.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ tags_expanded = True
| [Settings] | Yes | Config section name. | [Settings] |
| theme | Yes | UI theme. | light, dark |
| accent | Yes | UI accent color | orange, red, pink, purple, deepPurple, indigo, blue, lightBlue,cyan, teal, green, lightGreen, lime, yellow, amber, deepOrange, brown, grey, blueGrey |
| cardcolor | Yes | Card Color. Defines if the card should use the UI-Accent color | True or False (Default: False) |
| background | Yes | Background image for the UI | /static/images/backgrounds/yourpicture.png, external link to image, None, random |
| roles | No | User roles for access groups. | comma separated string, if not defined, this is set to 'admin,user,public_user'. Note: admin, user, public_user roles are required and will be added automatically if omitted. |
| home_access_groups | No | Define which access groups can access the /home page | Groups defined in your config. If not defined, default is admin_only |
Expand Down