webview hide

app/mycard.component.css

@@ -82,3 +82,10 @@ li > a:hover, #window-buttons > i:hover {
 .navbar {
     border-radius: initial;
 }
+
+/* https://github.com/electron/electron/issues/7661#event-827104990 */
+.hide {
+    width: 0;
+    height: 0;
+    flex: 0 1;
+}
\ No newline at end of file

app/mycard.component.html

@@ -31,8 +31,8 @@
     </div>
 </nav>
 
-<login class="page" [hidden]="currentPage!= 'login'"></login>
-<store class="page" [hidden]="currentPage!= 'store'"></store>
-<lobby class="page" [hidden]="currentPage!= 'lobby'"></lobby>
-<webview id="community" class="page" [hidden]=" currentPage!= 'community'"
+<login class="page" [ngClass]="{hide: currentPage != 'login'}"></login>
+<store class="page" [ngClass]="{hide: currentPage != 'store'}"></store>
+<lobby class="page" [ngClass]="{hide: currentPage != 'lobby'}"></lobby>
+<webview id="community" class="page" [ngClass]="{hide: currentPage != 'community'}"
          src="https://ygobbs.com"></webview>
\ No newline at end of file

styles.css

@@ -13,16 +13,4 @@ h2, h3 {
 
 body {
     margin: 2em;
-}
-
-/* https://github.com/electron/electron/issues/7661#event-827104990 */
-webview[hidden] {
-    width: 0;
-    height: 0;
-    flex: 0 1;
-    display: block;
-}
-
-#candy {
-    flex: 0 1;
 }
\ No newline at end of file