more specific selectors

src/app/accounts/hint.component.html

@@ -1,4 +1,4 @@
-<form id="hint" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+<form id="hint-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
     <div class="content">
         <h1>{{'passwordHint' | i18n}}</h1>
         <div class="box last">

src/app/accounts/login.component.html

@@ -1,4 +1,4 @@
-<form id="login" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+<form id="login-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
     <div class="content">
         <img src="../../images/logo@2x.png" alt="bitwarden">
         <p>{{'loginOrCreateNewAccount' | i18n}}</p>

src/app/accounts/register.component.html

@@ -1,4 +1,4 @@
-<form id="register" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
+<form id="register-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
     <div class="content">
         <h1>{{'createAccount' | i18n}}</h1>
         <div class="box">

src/scss/pages.scss

@@ -1,6 +1,6 @@
 @import "variables.scss";
 
-#login {
+#login-page {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -23,7 +23,7 @@
     }
 }
 
-#register, #hint {
+#register-page, #hint-page {
     margin-top: 20px;
 
     .content {
@@ -31,7 +31,7 @@
     }
 }
 
-#login, #register, #hint {
+#login-page, #register-page, #hint-page {
     .content {
         max-width: 300px;
 

src/scss/vault.scss

@@ -4,7 +4,7 @@
     height: 100%;
     display: flex;
 
-    #groupings, #items, #details, #logo {
+    > #groupings, > #items, > #details, > #logo {
         display: flex;
         flex-direction: column;
 
@@ -13,7 +13,7 @@
         }
     }
 
-    #groupings {
+    > #groupings {
         background-color: $background-color-alt;
         width: 15%;
         min-width: 175px;
@@ -110,7 +110,7 @@
         }
     }
 
-    #items {
+    > #items {
         background-color: $background-color;
         width: 25%;
         min-width: 200px;
@@ -133,7 +133,7 @@
         }
     }
 
-    #details {
+    > #details {
         background-color: $background-color-alt2;
         flex: 1;
         min-width: 0;
@@ -161,7 +161,7 @@
         }
     }
 
-    #logo {
+    > #logo {
         flex: 1;
         min-width: 0;