CTPL-242: Updates to alerts, typography styles

nla · Nov 20, 2024 · 85dea48 · 85dea48
1 parent 74811a1
commit 85dea48
Show file tree

Hide file tree

Showing 5 changed files with 86 additions and 1 deletion.
diff --git a/app/assets/stylesheets/nla/_alert.scss b/app/assets/stylesheets/nla/_alert.scss
@@ -0,0 +1,68 @@
+@charset "UTF-8";
+@import "variables";
+@import "nla-custom-bootstrap";
+
+.alert {
+	border-width: 0;
+	border-left-style: solid;
+	border-left-width: 0.25rem;
+	color: $grey-700;
+	padding-left: 3rem;
+	position: relative;
+
+	&:before {
+		position: absolute;
+		top: 1rem;
+		left: 1rem;
+		width: 1rem;
+		height: 1rem;
+		font: var(--fa-font-regular);
+	}
+
+}
+
+
+.alert-success {
+	background: $success-light;
+	border-left-color: $success-dark;
+
+	&:before {
+		content: "\f058";
+		color: $success-dark;
+	}
+}
+
+.alert-info {
+	background: $info-light;
+	border-left-color: $info-dark;
+
+	&:before {
+		content: "\f05a";
+		color: $info-dark;
+	}
+}
+
+.alert-warning {
+	background: $warning-light;
+	border-left-color: $warning-dark;
+
+	&:before {
+		content: "\f06a";
+		color: $warning-dark;
+	}
+}
+
+.alert-error {
+	background: $error-light;
+	border-left-color: $error-dark;
+
+	&:before {
+		content: "\f057";
+		color: $error-dark;
+	}
+}
+
+
+.alert p {
+	margin-bottom: 0;
+}
diff --git a/app/assets/stylesheets/nla/_dark-mode.scss b/app/assets/stylesheets/nla/_dark-mode.scss
@@ -22,6 +22,10 @@
     }
   }
 
+  h1 {
+    color: $body-color-dark;
+  }
+
   .al-show-breadcrumb,
   .title-container,
   .sidebar-section {

diff --git a/app/assets/stylesheets/nla/_nla-arclight.scss b/app/assets/stylesheets/nla/_nla-arclight.scss
@@ -13,6 +13,7 @@
 @import "record";
 @import "typography";
 @import "repository";
+@import "alert";
 
 //@import "./components/show_actions";
 @import "./components/bookmarks";

diff --git a/app/assets/stylesheets/nla/_typography.scss b/app/assets/stylesheets/nla/_typography.scss
@@ -29,4 +29,16 @@ a.page-link {
   &:active {
     box-shadow: none;
   }
+}
+
+h1 {
+  font-family: $font-family-serif;
+  color: $body-color;
+  font-weight: 400;
+}
+
+.blacklight-bookmarks {
+  h1 {
+    margin-top: 3rem;
+  }
 }
diff --git a/app/views/bookmarks/_clear_bookmarks_widget.html.erb b/app/views/bookmarks/_clear_bookmarks_widget.html.erb
@@ -5,4 +5,4 @@
         turbo_method: :delete,
         turbo_confirm: t('blacklight.bookmarks.clear.action_confirm')
       },
-      class: 'clear-bookmarks btn btn-outline-primary' %>
+      class: 'clear-bookmarks btn btn-link' %>