diff --git a/src/app/app.component.html b/src/app/app.component.html index 078ca41..0feca51 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,7 +1,7 @@
-
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 1b4f8b3..4bb4d24 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -52,9 +52,7 @@ export class AppComponent implements OnInit { items: [ new MenuItem("intro", "Usage Statistics Intro", "", "/", false, [], null, {}), new MenuItem("countries", "Track Countries Usage Activity", "", "/", false, [], null, {slide: 2}), -/* new MenuItem("chart", "Monthly Usage Events", "", "/", false, [], null, {slide: 3}) -*/ ] }, { diff --git a/src/app/home/home.component.css b/src/app/home/home.component.css index e634d21..e5e4110 100644 --- a/src/app/home/home.component.css +++ b/src/app/home/home.component.css @@ -23,12 +23,20 @@ outline: none; } +.third { + background-image: url("/assets/usage-statistics-assets/home/3.svg"); + background-size: contain; + background-repeat: no-repeat; + background-position: center center; + min-height: 80vh; +} + a.search, a.search:hover { color: #333333; font-weight: 700; } -.second .card { +.card { background: #FFFFFF 0 0 no-repeat padding-box; box-shadow: 0 3px 6px #00000029; border-radius: 4px; @@ -37,9 +45,15 @@ a.search, a.search:hover { position: relative; } -.second .card > img { +.card > img { position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%); } + +iframe { + box-shadow: 1px 10px 12px #00000029; + border: 1px solid #E0E0E0; + border-radius: 5px; +} diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index e4970b1..8c6a1b6 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -46,7 +46,8 @@
{{(country) ? country : 'world wide'}}
Results
-
+
@@ -88,6 +89,17 @@
+ +
+

Monthly Usage Events

+
+
+ +
+
+
+
@@ -95,8 +107,12 @@ + + +
+
diff --git a/src/styles.css b/src/styles.css index 6301d1a..b0132fd 100644 --- a/src/styles.css +++ b/src/styles.css @@ -16,3 +16,7 @@ main { font-size: 16px; line-height: 21px; } + +main.full-height { + min-height: 100vh; +}