From 903e831399fadfc2052ce7e936c6e3173c232860 Mon Sep 17 00:00:00 2001 From: Taiwo Ladipo Date: Mon, 8 Oct 2018 16:19:53 +0100 Subject: [PATCH] Fix clashing styles; Update composer.lock; --- composer.lock | 12 +++---- src/asset-files/css/styles.css | 36 ++++++++++----------- src/asset-files/less/dashboard-widgets.less | 27 ++++++++-------- src/asset-files/less/dashboard.less | 7 +--- src/assets/DashboardListAsset.php | 2 +- src/assets/DashboardsAsset.php | 3 +- src/widgets/BaseChartsJsWidget.php | 6 ++-- src/widgets/BaseDashboardWidget.php | 12 +++---- src/widgets/CountWidget.php | 13 ++++++-- src/widgets/DashboardListWidget.php | 2 +- 10 files changed, 61 insertions(+), 59 deletions(-) diff --git a/composer.lock b/composer.lock index cb10314..add8f29 100644 --- a/composer.lock +++ b/composer.lock @@ -4,7 +4,7 @@ "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", "This file is @generated automatically" ], - "content-hash": "d1da9a4a0251111b717d3d8600648341", + "content-hash": "c8a06950446237c01cb8c2ca0653aa5a", "packages": [ { "name": "bower-asset/bootstrap", @@ -370,16 +370,16 @@ }, { "name": "cottacush/cricket-base", - "version": "v0.7", + "version": "v0.8", "source": { "type": "git", "url": "https://github.com/CottaCush/cricket-base.git", - "reference": "6cbda9600efbd4e8cdfaa9b38102d8015c76290c" + "reference": "2fa25e3e328ba5168ba5b8ac8e2065696aaa0af7" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/CottaCush/cricket-base/zipball/6cbda9600efbd4e8cdfaa9b38102d8015c76290c", - "reference": "6cbda9600efbd4e8cdfaa9b38102d8015c76290c", + "url": "https://api.github.com/repos/CottaCush/cricket-base/zipball/2fa25e3e328ba5168ba5b8ac8e2065696aaa0af7", + "reference": "2fa25e3e328ba5168ba5b8ac8e2065696aaa0af7", "shasum": "" }, "require": { @@ -438,7 +438,7 @@ "report template", "yii2" ], - "time": "2018-10-05T14:40:51+00:00" + "time": "2018-10-08T14:36:20+00:00" }, { "name": "cottacush/yii2-widgets", diff --git a/src/asset-files/css/styles.css b/src/asset-files/css/styles.css index 6ffd3ea..61d9cf8 100644 --- a/src/asset-files/css/styles.css +++ b/src/asset-files/css/styles.css @@ -18,13 +18,10 @@ line-height: 1.3; } .cricket-wrapper .cricket-dashboard-view__count-widget { - border-radius: 4px; - -webkit-box-shadow: 0 2px 0 rgba(90, 97, 105, 0.07), 0 4px 8px rgba(90, 97, 105, 0.08), 0 10px 10px rgba(90, 97, 105, 0.03), 0 7px 70px rgba(90, 97, 105, 0.08); - box-shadow: 0 2px 0 rgba(90, 97, 105, 0.07), 0 4px 8px rgba(90, 97, 105, 0.08), 0 10px 10px rgba(90, 97, 105, 0.03), 0 7px 70px rgba(90, 97, 105, 0.08); background: #fff; } .cricket-wrapper .cricket-dashboard-view__count-widget--data { - padding: 5px 0; + padding: 15px 0; text-align: center; } .cricket-wrapper .cricket-dashboard-view__count-widget--data-label { @@ -37,58 +34,59 @@ font-weight: 500; color: #777; } -.cricket-wrapper .card { +.cricket-wrapper .cricket-card { + border-radius: 4px; -webkit-box-shadow: 0 2px 0 rgba(90, 97, 105, 0.07), 0 4px 8px rgba(90, 97, 105, 0.08), 0 10px 10px rgba(90, 97, 105, 0.03), 0 7px 70px rgba(90, 97, 105, 0.08); box-shadow: 0 2px 0 rgba(90, 97, 105, 0.07), 0 4px 8px rgba(90, 97, 105, 0.08), 0 10px 10px rgba(90, 97, 105, 0.03), 0 7px 70px rgba(90, 97, 105, 0.08); } -.cricket-wrapper .card .card-text { +.cricket-wrapper .cricket-card .cricket-card-text { margin-bottom: 1.5625rem; } -.cricket-wrapper .card a:hover { +.cricket-wrapper .cricket-card a:hover { text-decoration: none; } -.cricket-wrapper .card-small { +.cricket-wrapper .cricket-card-small { -webkit-box-shadow: 0 2px 0 rgba(90, 97, 105, 0.11), 0 4px 8px rgba(90, 97, 105, 0.12), 0 10px 10px rgba(90, 97, 105, 0.06), 0 7px 70px rgba(90, 97, 105, 0.1); box-shadow: 0 2px 0 rgba(90, 97, 105, 0.11), 0 4px 8px rgba(90, 97, 105, 0.12), 0 10px 10px rgba(90, 97, 105, 0.06), 0 7px 70px rgba(90, 97, 105, 0.1); } -.cricket-wrapper .card-small .card-body { +.cricket-wrapper .cricket-card-small .cricket-card-body { padding: 1rem 1.5rem; } -.cricket-wrapper .card-small .card-footer { +.cricket-wrapper .cricket-card-small .cricket-card-footer { padding: 1rem 1.5rem; } -.cricket-wrapper .card-small .card-header { +.cricket-wrapper .cricket-card-small .cricket-card-header { padding: 1rem 1.5rem; } -.cricket-wrapper .card-body > p:last-child { +.cricket-wrapper .cricket-card-body > p:last-child { margin-bottom: 0; } -.cricket-wrapper .card-title { +.cricket-wrapper .cricket-card-title { font-weight: 500; margin-bottom: 0.75rem; } -.cricket-wrapper .card-subtitle { +.cricket-wrapper .cricket-card-subtitle { margin-top: -1.09375rem; } -.cricket-wrapper .card-link + .card-link { +.cricket-wrapper .cricket-card-link + .cricket-card-link { margin-left: 1.875rem; } -.cricket-wrapper .card-header { +.cricket-wrapper .cricket-card-header { padding: 1.09375rem 1.875rem; background-color: #fff; border-bottom: none; text-align: left; font-weight: 500; } -.cricket-wrapper .card-header:first-child { +.cricket-wrapper .cricket-card-header:first-child { border-radius: 4px 4px 0 0; } -.cricket-wrapper .card-footer { +.cricket-wrapper .cricket-card-footer { padding: 1.09375rem 1.875rem; background-color: #fff; border-top: none; } -.cricket-wrapper .card-footer:last-child { +.cricket-wrapper .cricket-card-footer:last-child { border-radius: 0 0 0.625rem 0.625rem; } .cricket-wrapper .form-control { diff --git a/src/asset-files/less/dashboard-widgets.less b/src/asset-files/less/dashboard-widgets.less index 918bb2c..41b4115 100644 --- a/src/asset-files/less/dashboard-widgets.less +++ b/src/asset-files/less/dashboard-widgets.less @@ -1,11 +1,12 @@ @white: #fff; .cricket-wrapper { - .card { + .cricket-card { + border-radius: 4px; box-shadow: 0 2px 0 rgba(90, 97, 105, .07), 0 4px 8px rgba(90, 97, 105, .08), 0 10px 10px rgba(90, 97, 105, .03), 0 7px 70px rgba(90, 97, 105, .08); - .card-text { + .cricket-card-text { margin-bottom: 1.5625rem; } a { @@ -14,41 +15,41 @@ } } } - .card-small { + .cricket-card-small { box-shadow: 0 2px 0 rgba(90, 97, 105, .11), 0 4px 8px rgba(90, 97, 105, .12), 0 10px 10px rgba(90, 97, 105, .06), 0 7px 70px rgba(90, 97, 105, .1); - .card-body { + .cricket-card-body { padding: 1rem 1.5rem; } - .card-footer { + .cricket-card-footer { padding: 1rem 1.5rem; } - .card-header { + .cricket-card-header { padding: 1rem 1.5rem; } } - .card-body { + .cricket-card-body { > p { &:last-child { margin-bottom: 0; } } } - .card-title { + .cricket-card-title { font-weight: 500; margin-bottom: .75rem; } - .card-subtitle { + .cricket-card-subtitle { margin-top: -1.09375rem; } - .card-link { - & + .card-link { + .cricket-card-link { + & + .cricket-card-link { margin-left: 1.875rem; } } - .card-header { + .cricket-card-header { padding: 1.09375rem 1.875rem; background-color: @white; border-bottom: none; @@ -58,7 +59,7 @@ border-radius: 4px 4px 0 0; } } - .card-footer { + .cricket-card-footer { padding: 1.09375rem 1.875rem; background-color: @white; border-top: none; diff --git a/src/asset-files/less/dashboard.less b/src/asset-files/less/dashboard.less index e0e2228..2f52f17 100644 --- a/src/asset-files/less/dashboard.less +++ b/src/asset-files/less/dashboard.less @@ -1,16 +1,11 @@ .cricket-wrapper { .cricket-dashboard-view { &__count-widget { - border-radius: 4px; - box-shadow: 0 2px 0 rgba(90,97,105,.07), - 0 4px 8px rgba(90,97,105,.08), - 0 10px 10px rgba(90,97,105,.03), - 0 7px 70px rgba(90,97,105,.08); background: #fff; } &__count-widget--data { - padding: 5px 0; + padding: 15px 0; text-align: center; } diff --git a/src/assets/DashboardListAsset.php b/src/assets/DashboardListAsset.php index 02d88ea..8a41e24 100644 --- a/src/assets/DashboardListAsset.php +++ b/src/assets/DashboardListAsset.php @@ -10,6 +10,6 @@ class DashboardListAsset extends BaseDashboardsAsset { public $depends = [ - 'CottaCush\Cricket\Report\Assets\DashboardsAsset', + 'CottaCush\Cricket\Dashboards\Assets\DashboardsAsset', ]; } diff --git a/src/assets/DashboardsAsset.php b/src/assets/DashboardsAsset.php index faffc13..74cb019 100644 --- a/src/assets/DashboardsAsset.php +++ b/src/assets/DashboardsAsset.php @@ -10,8 +10,7 @@ class DashboardsAsset extends BaseDashboardsAsset { public $css = [ - 'css/styles.css', - 'css/custom-bootstrap.css' + 'css/styles.css' ]; public $depends = [ diff --git a/src/widgets/BaseChartsJsWidget.php b/src/widgets/BaseChartsJsWidget.php index d944514..9309e54 100644 --- a/src/widgets/BaseChartsJsWidget.php +++ b/src/widgets/BaseChartsJsWidget.php @@ -77,14 +77,14 @@ public function init() protected function renderHeader() { - echo $this->beginDiv('card-header border-bottom'); + echo $this->beginDiv('cricket-card-header border-bottom'); echo Html::tag('span', $this->model->name, ['class' => 'h4']); echo $this->endDiv(); } protected function renderBody() { - echo $this->beginDiv('card-body pt-0'); + echo $this->beginDiv('cricket-card-body'); $this->renderFilter(); $this->renderChart(); @@ -138,7 +138,7 @@ protected function getRandomColors($count = 1, $format = 'rgb', $isRandom = fals protected function renderFooter() { - echo $this->beginDiv('card-footer border-top'); + echo $this->beginDiv('cricket-card-footer border-top'); echo $this->beginDiv('text-right '); echo ' '; diff --git a/src/widgets/BaseDashboardWidget.php b/src/widgets/BaseDashboardWidget.php index e19be03..051fbd1 100644 --- a/src/widgets/BaseDashboardWidget.php +++ b/src/widgets/BaseDashboardWidget.php @@ -38,9 +38,9 @@ abstract class BaseDashboardWidget extends Yii2BaseWidget protected $queryFunction = SQLGenerator::QUERY_ALL; public static $sizes = [ - self::LOCATION_TOP => 'col-lg-2 col-md-3 col-sm-6 col-12 my-4', - self::LOCATION_MIDDLE => 'col-lg-4 col-md-6 col-12 my-4', - self::LOCATION_BOTTOM => 'col-md-6 col-sm-12 my-4', + self::LOCATION_TOP => 'col-lg-3 col-md-3 col-sm-6 col-12 form-group', + self::LOCATION_MIDDLE => 'col-lg-4 col-md-6 col-12 form-group', + self::LOCATION_BOTTOM => 'col-md-6 col-sm-12 form-group', ]; public $dbConnection; @@ -55,7 +55,7 @@ public function init() public function renderWidget() { echo $this->beginDiv($this->getSize()); - echo $this->beginDiv('card card-small'); + echo $this->beginDiv('cricket-card cricket-card-small equal-height'); $this->renderHeader(); @@ -90,7 +90,7 @@ protected function getDataColumns($data = []) protected function renderHeader() { - echo $this->beginDiv('card-header border-bottom'); + echo $this->beginDiv('cricket-card-header border-bottom'); echo Html::tag('span', $this->model->name, ['class' => 'h4']); echo $this->endDiv(); } @@ -108,7 +108,7 @@ protected function renderFilter() return; } - echo $this->beginDiv('row border-bottom px-2 py-3 bg-light'); + echo $this->beginDiv('row border-bottom bg-light'); echo ''; echo $this->endDiv(); } diff --git a/src/widgets/CountWidget.php b/src/widgets/CountWidget.php index b2ca021..6e59f96 100644 --- a/src/widgets/CountWidget.php +++ b/src/widgets/CountWidget.php @@ -22,13 +22,22 @@ protected function renderHeader() return; } + public function init() + { + parent::init(); + + if (empty($this->data)) { + $this->data = 0; + } + } + protected function renderBody() { - echo $this->beginDiv('card-body cricket-dashboard-view__count-widget equal-height'); + echo $this->beginDiv('cricket-card-body cricket-dashboard-view__count-widget'); echo $this->beginDiv('cricket-dashboard-view__count-widget--data'); echo Html::tag( 'h1', - $this->getData(), + $this->data, ['class' => 'cricket-dashboard-view__count-widget--data-value'] ); echo Html::tag('span', $this->model->name, ['class' => 'cricket-dashboard-view__count-widget--data-label']); diff --git a/src/widgets/DashboardListWidget.php b/src/widgets/DashboardListWidget.php index 8acc5d5..c709e07 100644 --- a/src/widgets/DashboardListWidget.php +++ b/src/widgets/DashboardListWidget.php @@ -36,7 +36,7 @@ private function renderDashboards() echo $this->beginDiv('cricket-dashboard-list'); echo $this->beginDiv('row'); foreach ($this->dashboards as $dashboard) { - echo $this->beginDiv('col-lg-3 col-md-3 col-sm-4 col-xs-12'); + echo $this->beginDiv('col-lg-3 col-md-3 col-sm-4 col-xs-12 form-group'); echo $this->beginDiv('cricket-dashboard-list__item'); echo Html::a( ArrayHelper::getValue($dashboard, 'name'),