@myuw-web-components/myuw-app-bar - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

package.json

 {
   "name": "@myuw-web-components/myuw-app-bar",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "A material top app bar designed for use with other MyUW web components",
@@ -5,0 +5,0 @@ "main": "myuw-app-bar.html",

README.md

@@ -31,4 +31,2 @@ # `<myuw-app-bar>`
     app-url=""
-    background=""
-    color=""
 >
@@ -38,3 +36,3 @@ </myuw-app-bar>
 
-### Configurable properties
+### Configurable properties via attributes
 
@@ -45,5 +43,21 @@ - **themeName (theme-name):** Sets the theme/portal name (defaults to "MyUW")
 - **appUrl (app-url):** Sets then URL to go to when user clicks the app name
-- **background:** Sets the top bar's background color
-- **color:** Sets the top bar's text color (defaults to white)
 
+### Styling the app bar
+
+MyUW app bar exposes custom CSS properties so users can change some of its styles.
+
+- **--myuw-app-bar-bg:** Cahnges the background color of the app bar (default is UW-Madison red)
+- **--myuw-app-bar-color:** Changes the text color of the app bar (default is white)
+
+#### How to use custom CSS properties
+
+Add the following selector to your CSS:
+
+```css
+myuw-app-bar {
+    --myuw-app-bar-bg: #fff;
+    --myuw-app-bar-color: #c5050c;
+}
+```
+
 ### Configuration / child components
@@ -50,0 +64,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

77

increased by22.22%

Worsened metrics

Total package byte prevSize

16012

decreased by-1.08%

No dependency changes