1
0
mirror of https://github.com/beestat/app.git synced 2025-05-24 02:14:03 -04:00

Made styling a bit cooler

This commit is contained in:
Jon Ziebell 2021-03-04 20:48:09 -05:00
parent c8c8a98250
commit 692ea2b26d
6 changed files with 20 additions and 7 deletions

View File

@ -6,6 +6,8 @@ beestat.component.card = function() {
};
beestat.extend(beestat.component.card, beestat.component);
beestat.component.card.prototype.box_shadow_ = true;
/**
* [get_class_name_recursive_ description]
*
@ -47,12 +49,17 @@ beestat.component.card.prototype.decorate_ = function(parent) {
this.contents_ = $.createElement('div')
.style({
'padding': (beestat.style.size.gutter),
'padding': beestat.style.size.gutter,
'height': '100%',
'background': beestat.style.color.bluegray.base
'background': beestat.style.color.bluegray.base,
'border-radius': beestat.style.size.border_radius
});
parent.appendChild(this.contents_);
if (this.box_shadow_ === true) {
this.contents_.style('box-shadow', '0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)');
}
parent.appendChild(this.contents_);
this.decorate_back_(this.contents_);
var top_right = $.createElement('div').style('float', 'right');

View File

@ -6,6 +6,8 @@ beestat.component.card.footer = function() {
};
beestat.extend(beestat.component.card.footer, beestat.component.card);
beestat.component.card.footer.prototype.box_shadow_ = false;
beestat.component.card.footer.prototype.decorate_contents_ = function(parent) {
parent.style('background', beestat.style.color.bluegray.light);

View File

@ -51,7 +51,8 @@ beestat.component.card.sensors.prototype.decorate_contents_ = function(parent) {
.style({
'display': 'grid',
'grid-template-columns': 'repeat(auto-fit, minmax(160px, 1fr))',
'margin': '0 0 ' + beestat.style.size.gutter + 'px -' + beestat.style.size.gutter + 'px'
'margin': '0 0 ' + beestat.style.size.gutter + 'px -' + beestat.style.size.gutter + 'px',
'border-radius': beestat.style.size.border_radius
});
parent.appendChild(sensor_container);

View File

@ -349,7 +349,8 @@ beestat.component.card.system.prototype.decorate_time_to_temperature_ = function
'background': beestat.style.color.bluegray.dark,
'padding': beestat.style.size.gutter / 2,
'text-align': 'center',
'margin-top': beestat.style.size.gutter
'margin-top': beestat.style.size.gutter,
'border-radius': beestat.style.size.border_radius
});
parent.appendChild(container);

View File

@ -573,7 +573,9 @@ beestat.component.chart.prototype.tooltip_formatter_helper_ = function(title, se
var tooltip = $.createElement('div')
.style({
'background-color': beestat.style.color.bluegray.dark,
'padding': beestat.style.size.gutter / 2
'padding': beestat.style.size.gutter / 2,
'border-radius': beestat.style.size.border_radius,
'box-shadow': '0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)'
});
var title_div = $.createElement('div')

View File

@ -50,7 +50,7 @@ beestat.component.header.prototype.decorate_ = function(parent) {
'display': 'flex',
'align-items': 'center',
'flex-grow': '1',
'margin': '-' + gutter + 'px 0 0 -' + gutter + 'px'
'margin': '-' + (gutter / 2) + 'px 0 ' + (gutter / 4) + 'px -' + gutter + 'px'
});
parent.appendChild(row);