Add small ad for Factory Time

Author: deniszholob

src/app/app.component.html

@@ -20,3 +20,9 @@
 
 <!-- <app-annex class="section section-nav-margin"></app-annex> -->
 <app-footer class="footer section-nav-margin"></app-footer>
+
+<div class="sticky-left-panel">
+  <a class="btn btn-outline-primary" [href]="APP_INFO.factoryTime.url" target="_blank" rel="noopener noreferrer">
+    Play my game: "Factory Time"
+  </a>
+</div>

src/app/app.component.ts

@@ -8,12 +8,15 @@ import {
 } from '@angular/service-worker';
 import { filter, map, Subject, takeUntil } from 'rxjs';
 
+import { APP_INFO } from './shared/app-settings';
+
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
 })
 export class AppComponent implements OnDestroy {
   private readonly clearSub$ = new Subject<void>();
+  protected readonly APP_INFO = APP_INFO;
 
   constructor(private swUpdate: SwUpdate) {
     this.subToUpdateApp();

src/app/layout/overview/overview.component.html

@@ -65,12 +65,19 @@ <h2>Overview</h2>
         <p class="text-muted">If you find the cheat sheet useful, you can:</p>
         <div class="support-buttons">
           <a class="btn btn-outline-primary" href="https://ko-fi.com/deniszholob" target="_blank" rel="noopener">
-            Buy me Ko-fi
+            Buy me <br />
             <i class="{{ APP_INFO.kofi.icon }}"></i>
+            Ko-fi
           </a>
           <a class="btn btn-outline-primary" href="https://patreon.com/deniszholob" target="_blank" rel="noopener">
-            Support me on Patreon
+            Support me on <br />
             <i class="{{ APP_INFO.patreon.icon }}"></i>
+            Patreon
+          </a>
+          <a class="btn btn-outline-primary" [href]="APP_INFO.factoryTime.url" target="_blank" rel="noopener noreferrer">
+            Play My Game <br />
+            <i class="{{ APP_INFO.factoryTime.icon }}"></i>
+            "Factory Time"
           </a>
         </div>
       </div>

src/app/shared/app-settings.ts

@@ -31,6 +31,12 @@ export const APP_INFO: AppInfo = {
     url: 'https://www.patreon.com/deniszholob',
     icon: 'fab fa-patreon',
   },
+  factoryTime: {
+    name: 'Factory Time Game',
+    url: 'https://deniszholob.github.io/factory-time/',
+    title: 'Factory Time Game',
+    icon: 'fas fa-industry',
+  },
   data_version: '2.0.7',
   // languages: ['en-US'],
   links: {
@@ -56,6 +62,7 @@ export interface AppInfo {
   links: ImageLinks;
   // old_cheat_sheets: Hyperlink[];
   // pdfs: Hyperlink[];
+  factoryTime: Hyperlink;
 }
 
 /** Hyperlink data */

src/styles/styles.scss

@@ -230,3 +230,18 @@ small,
 .justify-center {
   justify-content: center;
 }
+
+.sticky-left-panel {
+  position: fixed;
+  left: 0;
+  top: 50%;
+  --tw-translate-y: -50%;
+  transform: translate(var(--tw-translate-x, 0), var(--tw-translate-y));
+  background: rgba(3, 3, 3);
+  writing-mode: sideways-rl;
+  text-orientation: mixed;
+
+  .btn {
+    padding: 0.5rem 0.25rem;
+  }
+}