diff --git a/src/app/ideas/ideas.component.html b/src/app/ideas/ideas.component.html
index a25cddf..8baba10 100644
--- a/src/app/ideas/ideas.component.html
+++ b/src/app/ideas/ideas.component.html
@@ -33,6 +33,11 @@
Change log
Change |
Date |
+
+ Bowling average charts moved into a tabs group design.
+ |
+ 02/08/2024 |
+
Major change to responsive design: charts display better in small screens in portrait screen orientation.
|
diff --git a/src/app/strike-rate/strike-rate.component.html b/src/app/strike-rate/strike-rate.component.html
index e463fa6..b0549b7 100644
--- a/src/app/strike-rate/strike-rate.component.html
+++ b/src/app/strike-rate/strike-rate.component.html
@@ -1,9 +1,17 @@
@if (loaded()) {
-Strike rate
+Bowling strike rate
+
-
+
+
+
+
+
}
\ No newline at end of file
diff --git a/src/app/strike-rate/strike-rate.component.ts b/src/app/strike-rate/strike-rate.component.ts
index a8a8ca2..c7e2c57 100644
--- a/src/app/strike-rate/strike-rate.component.ts
+++ b/src/app/strike-rate/strike-rate.component.ts
@@ -6,11 +6,12 @@ import ChartDataLabels from 'chartjs-plugin-datalabels';
import { DataFetchService } from '../data-fetch.service';
import { MatIconModule } from '@angular/material/icon';
import { MatButtonModule } from '@angular/material/button';
+import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'app-strike-rate',
standalone: true,
- imports: [BaseChartDirective, MatButtonModule, MatIconModule],
+ imports: [BaseChartDirective, MatButtonModule, MatIconModule, MatTooltipModule],
templateUrl: './strike-rate.component.html',
styleUrl: './strike-rate.component.css'
})
diff --git a/src/app/wickets-opponent-bar/wickets-opponent-bar.component.html b/src/app/wickets-opponent-bar/wickets-opponent-bar.component.html
index 99cb428..68ab488 100644
--- a/src/app/wickets-opponent-bar/wickets-opponent-bar.component.html
+++ b/src/app/wickets-opponent-bar/wickets-opponent-bar.component.html
@@ -5,12 +5,8 @@ Matches & wickets taken by opposition
[labels]="wicketsData.labels" [options]="barChartOptions" [plugins]="chartPlugins">
-
-
-
-
- Show or hide the five-wicket haul counts.
-
+
}
\ No newline at end of file
diff --git a/src/app/wickets-opponent-bar/wickets-opponent-bar.component.ts b/src/app/wickets-opponent-bar/wickets-opponent-bar.component.ts
index c416544..6ad7e70 100644
--- a/src/app/wickets-opponent-bar/wickets-opponent-bar.component.ts
+++ b/src/app/wickets-opponent-bar/wickets-opponent-bar.component.ts
@@ -6,11 +6,12 @@ import ChartDataLabels from 'chartjs-plugin-datalabels';
import { DataFetchService } from '../data-fetch.service';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
+import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'app-wickets-opponent-bar',
standalone: true,
- imports: [BaseChartDirective, MatButtonModule, MatIconModule],
+ imports: [BaseChartDirective, MatButtonModule, MatIconModule, MatTooltipModule],
templateUrl: './wickets-opponent-bar.component.html',
styleUrl: './wickets-opponent-bar.component.css'
})
diff --git a/src/styles.css b/src/styles.css
index da10900..76c3703 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -67,6 +67,11 @@ body {
margin: 1%;
}
+.tab-conent-top-padding {
+ /* padding: 3%; */
+ padding-top: 3%;
+}
+
/* Small devices (up to 768px) */
@media only screen and (max-width: 666px) {
.chart {