Skip to content
This repository has been archived by the owner on May 4, 2022. It is now read-only.

Enable material icons for directives and app entries #410

Merged
merged 6 commits into from
Apr 25, 2017

Conversation

thevoiceofzeke
Copy link
Contributor

@thevoiceofzeke thevoiceofzeke commented Apr 24, 2017

MUMUP-2781

Scope of this story: If an entity file for an app specifies an mdIcon parameter, it should be used everywhere that app icons are used. Likewise, uw-frame app developers should be able to use material icons in the frame-page or app-header directives.

In this PR:

  • Document the changes described here
  • Add CSS styles for the new uses of material icons
  • Enable mdIcon in circle-button directive
  • Prefer md-icon to fa-icon when specified in all the places icons are used (widget-icon directive, list-of-links widget type, search-with-links widget type, app-header directive) -- note: I'm open to considering some refactoring to make the implementation of this a little clean (ex. fewer ng-if statements), but I think that kind of improvement merits its own story
  • Add a basic widget type sample file for local testing/demoing
  • Trimmed down a couple sample files (no need for relatedApps list)

Demo screenshots

screen shot 2017-04-24 at 12 59 47 pm
screen shot 2017-04-24 at 12 59 50 pm
screen shot 2017-04-24 at 12 59 57 pm

Copy link
Contributor

@ChristianMurphy ChristianMurphy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All the icons 😍
LGTM 👍

@thevoiceofzeke thevoiceofzeke changed the title Enable material icons for app entries Enable material icons for directives and app entries Apr 24, 2017
@Doug-Reed
Copy link
Contributor

👍

@@ -1,6 +1,9 @@
<md-subheader role="heading" class="app-header">
<h1 flex="50" flex-xs="85" class="app-title">
<i class="fa {{::icon}}" aria-hidden="true"></i> {{::title}}</h1>
<i ng-if="icon.indexOf('fa-') > -1" class="fa {{::icon}}" aria-hidden="true"></i>
<md-icon ng-if="icon.indexOf('fa-') <= -1">{{ ::icon }}</md-icon>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this needs an aria-label. Maybe an aria-label of "" to get the aria-hidden="true" behavior.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added

@thevoiceofzeke thevoiceofzeke merged commit 8bd3a07 into uPortal-Attic:master Apr 25, 2017
@vertein vertein added this to the 4.1.0 milestone May 4, 2017
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants