Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@myuw-web-components/myuw-app-bar

Package Overview
Dependencies
Maintainers
1
Versions
38
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

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

Comparing version 0.0.1 to 0.1.0

dist/myuw-app-bar.js

13

package.json
{
"name": "@myuw-web-components/myuw-app-bar",
"version": "0.0.1",
"version": "0.1.0",
"description": "Top app bar based on Material guidelines and the UW-Madison app style guide, developed with Polymer 3",
"main": "myuw-app-bar.js",
"main": "dist/myuw-app-bar.js",
"dependencies": {

@@ -12,5 +12,6 @@ "@polymer/app-layout": "^3.0.0-pre.18",

"devDependencies": {
"@polymer/iron-demo-helpers": "^3.0.0-pre.19",
"@webcomponents/webcomponentsjs": "^2.0.0",
"wct-browser-legacy": "^1.0.0"
"wct-browser-legacy": "^1.0.0",
"webpack": "^4.12.0",
"webpack-cli": "^3.0.3"
},

@@ -21,3 +22,5 @@ "directories": {

"scripts": {
"test": "polymer test"
"test": "polymer test",
"start": "npm run build && polymer serve",
"build": "webpack --config webpack.config.js"
},

@@ -24,0 +27,0 @@ "repository": {

@@ -7,10 +7,63 @@ # \<myuw-app-bar\>

## Development and contribution
### Running locally
First, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) and npm (packaged with [Node.js](https://nodejs.org)) installed.
```
$ npm install
$ npm start
```
### Running tests
```
$ polymer test
```
This component is set up to be tested via [web-component-tester](https://github.com/Polymer/web-component-tester).
## How to use
There are two ways to use this component in your project:
1. As a `<script>` tag in your page's `<head>` **(WIP)**
2. As an npm dependency (for Node projects)
### Using the script tag
This method is a work in progress.
### Using the NPM package
Install the package as a dependency of your project:
```
$ npm i --save @myuw-web-components/myuw-app-bar
```
Use the tag in your HTML:
```HTML
<myuw-app-bar
themeName="MyUW"
themeUrl=""
appName=""
appUrl=""
background=""
color=""
font=""
>
</myuw-app-bar>
```
### Configurable properties
- **themeName (theme-name):** Sets the theme/portal name (defaults to "MyUW")
- **themeUrl (theme-url):** Sets then URL to go to when user clicks the theme name
- **appName (app-name):** Sets the app name (e.g. "Bucky Backup"), empty by default
- **appUrl (app-url):** Sets then URL to go to when user clicks the app name
- **background:** Sets the top bar's background color (defaults to UW-Madison branding -- #c5050c)
- **color:** Sets the top bar's text color (defaults to white)
- **font:** Sets the CSS `font-family` attribute on the `<app-header>` element. The specified font must be included on the document, or the header will default to `Roboto, Arial, sans-serif`.

@@ -35,20 +88,1 @@ ### Slots for child components

```
## Development and contribution
### Running locally
First, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) and npm (packaged with [Node.js](https://nodejs.org)) installed.
```
$ npm install
$ polymer serve
```
### Running tests
```
$ polymer test
```
This component is set up to be tested via [web-component-tester](https://github.com/Polymer/web-component-tester).

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc