diff --git a/chrome/browser/ui/webui/interstitials/interstitial_ui.cc b/chrome/browser/ui/webui/interstitials/interstitial_ui.cc
index 59e911bbb7f1d..5498a854fff67 100644
--- a/chrome/browser/ui/webui/interstitials/interstitial_ui.cc
+++ b/chrome/browser/ui/webui/interstitials/interstitial_ui.cc
@@ -617,10 +617,16 @@ std::string InterstitialHTMLSource::GetSupervisedUserInterstitialHTML(
}
}
+ bool show_banner = false;
+ std::string show_banner_string;
+ if (net::GetValueForKeyInQuery(url, "show_banner", &show_banner_string)) {
+ show_banner = show_banner_string == "1";
+ }
+
return supervised_user::BuildErrorPageHtml(
allow_access_requests, profile_image_url, profile_image_url2, custodian,
custodian_email, second_custodian, second_custodian_email, reason,
g_browser_process->GetApplicationLocale(), /*already_sent_request=*/false,
- /*is_main_frame=*/true);
+ /*is_main_frame=*/true, show_banner);
}
#endif
diff --git a/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.css b/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.css
index 4160427df6429..6e686782a33db 100644
--- a/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.css
+++ b/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.css
@@ -5,6 +5,15 @@
/* This is the stylesheet for the interstitial when the
"WebFilterInterstitialRefresh" flag is enabled. */
+.banner {
+ align-items: center;
+ box-shadow: 0 0 2px rgba(60, 64, 67, 0.12), 0 0 6px rgba(60, 64, 67, 0.15);
+ border-radius: 4px;
+ display: flex;
+ flex-direction: row;
+ padding: 16px;
+ }
+
body {
--avatar-stroke-color: var(--google-gray-50);
--custodian-name-color: #333333;
@@ -14,7 +23,7 @@ body {
--paragraph-color: var(--google-gray-700);
--callout-text-color: var(--google-gray-900);
--callout-bg-color: var(--google-gray-100);
- font-family: "Roboto", sans-serif;
+ font-family: 'Roboto', sans-serif;
padding: 24px 24px 20px 24px;
}
@@ -74,6 +83,23 @@ button:active {
border-color: var(--focused-details-button-border);
}
+#family-link-kite {
+ height: 24px;
+ width: 24px;
+ padding: 16px;
+}
+
+.banner-header {
+ color: var(--header-color);
+ line-height: 24px;
+ margin-top: 0;
+}
+
+.banner-content {
+ line-height: 20px;
+ margin-top: 0;
+}
+
h1,
p,
.custodian-contact {
diff --git a/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.html b/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.html
index 191e9851d5809..646bd646dad00 100644
--- a/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.html
+++ b/components/supervised_user/core/browser/resources/supervised_user_block_interstitial_v2.html
@@ -14,6 +14,14 @@
+
+
+
+
+
$i18n{bannerMessage}
+
+