Adds delete and restore for a creator's page

frontend/src/views/profile/ProfilePage.vue

@@ -276,6 +276,25 @@ const closeDialog = () => {
 
           </div>
         </div>
+
+        <div class="card">
+          <div class="card-title">Danger Zone</div>
+          <div class="content">
+            <p>
+              CAUTION: This will delete your creator page and suspend all tips and donations.
+            </p>
+            <button v-if="!creatorProfileStore.creator.isDeleted"
+                    class="danger-action"
+                    @click="creatorProfileStore.removeCreatorPage()">
+              DELETE PAGE
+            </button>
+            <button v-else
+                    class="safe-action"
+                    @click="creatorProfileStore.restoreCreatorPage()">
+              RESTORE PAGE
+            </button>
+          </div>
+        </div>
       </template>
 
     </div>
@@ -286,11 +305,24 @@ const closeDialog = () => {
 
 .action {
   @apply p-2 flex items-center w-full mb-2;
+  @apply font-sans text-base;
   @apply rounded-md;
   @apply transition duration-200 ease-in-out;
   @apply hover:bg-hutopyPrimary active:bg-hutopySecondary;
 }
 
+.danger-action {
+  @apply action;
+  @apply mt-4;
+  @apply bg-red-800 hover:bg-red-700 active:bg-red-600;
+}
+
+.safe-action {
+  @apply action;
+  @apply mt-4;
+  @apply bg-green-800 hover:bg-green-700 active:bg-green-600;
+}
+
 .label {
   @apply flex-none min-w-40 text-left;
 }