1 files changed, 99 insertions, 0 deletions
diff --git a/browser/components/aboutlogins/content/aboutLogins.css b/browser/components/aboutlogins/content/aboutLogins.css
new file mode 100644
index 0000000000..6b4a16451c
--- /dev/null
+++ b/browser/components/aboutlogins/content/aboutLogins.css
@@ -0,0 +1,99 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+html {
+   position: fixed;
+}
+html,
+body {
+  height: 100%;
+  width: 100%;
+}
+
+body {
+  --sidebar-width: 320px;
+  display: grid;
+  grid-template-columns: var(--sidebar-width) 1fr;
+  grid-template-rows: auto 1fr;
+}
+
+@media (max-width: 830px) {
+  body {
+    --sidebar-width: 270px;
+  }
+}
+
+header {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  background-color: var(--in-content-page-background);
+  padding-block: 9px;
+  padding-inline-start: 16px;
+  padding-inline-end: 23px;
+}
+
+login-filter {
+  min-width: 200px;
+  max-width: 400px;
+  margin-inline: 40px auto;
+  flex-grow: 0.5;
+  align-self: center;
+}
+
+fxaccounts-button,
+menu-button {
+  margin-inline-start: 18px;
+}
+
+login-list {
+  grid-row: 1/4;
+}
+
+:root:not(.initialized) login-intro,
+:root:not(.initialized) login-item,
+:root.empty-search login-intro,
+:root:not(.no-logins, .empty-search, .login-selected) login-intro,
+login-item[data-editing="true"] + login-intro,
+.login-selected login-intro,
+:root:not(.login-selected) login-item:not([data-editing="true"]),
+.no-logins login-item:not([data-editing="true"]) {
+  display: none;
+}
+
+.heading-wrapper {
+  display: flex;
+  justify-content: center;
+  width: var(--sidebar-width);
+  font-weight: 600;
+}
+
+:root:not(.primary-password-auth-required) #primary-password-required-overlay {
+  display: none;
+}
+
+.primary-password-auth-required > body > header,
+.primary-password-auth-required > body > login-list,
+.primary-password-auth-required > body > section {
+  filter: blur(2px)
+}
+
+#primary-password-required-overlay {
+  z-index: 1;
+  position: fixed;
+  width: 100vw;
+  height: 100vh;
+  background-color: rgba(0,0,0,0.2);
+}
+
+body > section {
+  display: grid;
+  grid-template-rows: auto 1fr;
+  overflow-y: hidden;
+  overflow-x: auto;
+}
+
+login-intro {
+  overflow-y: scroll;
+}