Move the supervised user error page to a component

chrome/browser/resources/supervised_user_block_interstitial.css

Index: chrome/browser/resources/supervised_user_block_interstitial.css
diff --git a/chrome/browser/resources/supervised_user_block_interstitial.css b/chrome/browser/resources/supervised_user_block_interstitial.css
deleted file mode 100644
index bd37186fea812daa0267409189c2db54c784d66d..0000000000000000000000000000000000000000
--- a/chrome/browser/resources/supervised_user_block_interstitial.css
+++ /dev/null
@@ -1,148 +0,0 @@
-/* Copyright 2014 The Chromium Authors. All rights reserved.
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file. */
-body {
-  background-color: rgb(247, 247, 247);
-  font-size: 10pt;
-  margin: 150px 60px 0 30px;
-}
-
-#main-frame-blocked {
-  margin: auto;
-  max-width: 600px;
-  min-width: 200px;
-}
-
-h1 {
-  font-size: 1.8em;
-  font-weight: normal;
-  margin: 5px 0 25px 0;
-}
-
-.avatar-img {
-  -webkit-user-select: none;
-  border: 3px solid rgb(251, 251, 251);
-  border-radius: 50%;
-  content: -webkit-image-set(
-      url(../../app/theme/default_100_percent/cros/logo_avatar_circle_blue_color.png) 1x,
-      url(../../app/theme/default_200_percent/cros/logo_avatar_circle_blue_color.png) 2x);
-  margin-bottom: 5px;
-  margin-right: 15px;
-  margin-top: 5px;
-  max-width: 45px;
-  position: relative;
-}
-
-#feedback {
-  margin-top: 50px;
-}
-
-#feedback-link {
-  color: rgb(66, 133, 244);
-}
-
-#request-access-button {
-  background-color: rgb(66, 133, 244);
-  color: rgb(255, 255, 255);
-  cursor: pointer;
-  font-size: 12px;
-  font-weight: bold;
-  min-width: 88px;
-  padding: 10px 15px;
-  transition: box-shadow 200ms cubic-bezier(0.4, 0, 0.2, 1);
-  transition-delay: 200ms;
-}
-
-#request-access-button:hover {
-  background-color: rgb(30, 136, 229);
-}
-
-#request-access-button:active {
-  background-color: rgb(25,118,210);
-  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2);
-  transition-delay: 0s;
-}
-
-#details-button-container {
-  color: rgb(97,97,97);
-  cursor: pointer;
-  display: inline;
-  font-size: 12px;
-  text-decoration: underline;
-}
-
-#button-container {
-  align-items: baseline;
-  display: flex;
-  justify-content: space-between;
-  margin-top: 60px;
-}
-
-#details {
-  color: rgb(97,97,97);
-  font-size: 14px;
-}
-
-#details-header {
-  font-weight: bold;
-}
-
-.custodian-information {
-  align-items: center;
-  display: flex;
-  font-size: 12px;
-}
-
-.custodian-name {
-  color: rgb(97,97,97);
-  padding: 1px 0;
-}
-
-.custodian-email {
-  color: rgb(183, 183, 183);
-  padding: 1px 0;
-}
-
-@media (max-width: 600px) {
-  #button-container {
-    display: flex;
-    flex-flow: column;
-    justify-content: flex-start;
-    order: 2;
-    text-transform: uppercase;
-  }
-
-  #details-button-container {
-    font-weight: bold;
-    margin: auto;
-    order: 2;
-  }
-
-  #request-access-button {
-    margin-bottom: 30px;
-    order: 1;
-    text-align: center
-  }
-
-  .button {
-    width: 100%;
-  }
-
-  #details {
-    margin: auto;
-    order: 1;
-  }
-
-  .hidden-on-mobile {
-    display: none;
-  }
-
-  #main-frame-blocked {
-    display: flex;
-    flex-flow: column;
-  }
-
-  #feedback {
-    margin-top: 35px;
-  }
-}