google/material-design-lite
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #1734 from google/issue-1722

Browse Source 
Add namespaced alternatives for what is strictly speaking invalid HTML
This commit is contained in:
Surma 2015-10-13 12:10:29 +01:00
commit e91adf21c4
3 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/menu/README.md
View File

@ -8,7 +8,7 @@ To use any MDL component, you must include the minified CSS and JavaScript files
### To include an MDL **menu** component: ### To include an MDL **menu** component:
&nbsp;1. Code a `<button>` element; this is the clickable toggle that will show and hide the menu options. Include an `id` attribute whose value will match the `for` (or `data-for`) attribute of the unordered list coded in the next step. Inside the button, code a `<i>` or `<span>` element to contain an icon of your choice. &nbsp;1. Code a `<button>` element; this is the clickable toggle that will show and hide the menu options. Include an `id` attribute whose value will match the `for` (or `data-mdl-for`) attribute of the unordered list coded in the next step. Inside the button, code a `<i>` or `<span>` element to contain an icon of your choice.
```html ```html
<button id="menu1"> <button id="menu1">
<i></i> <i></i>
@ -101,5 +101,5 @@ The MDL CSS classes apply various predefined visual and behavioral enhancements
(2) The `i` or `span` element in "button"" element can be used interchangeably. (2) The `i` or `span` element in "button"" element can be used interchangeably.
>**Note:** Disabled versions of the menu options are provided, and are invoked with the standard HTML boolean attribute `disabled`. `<li class="mdl-menu__item" disabled>Medium</li>` >**Note:** Disabled versions of the menu options are provided, and are invoked with the standard HTML boolean attribute `disabled` or `data-mdl-disabled`. `<li class="mdl-menu__item" disabled>Medium</li>`
>This attribute may be added or removed programmatically via scripting. >This attribute may be added or removed programmatically via scripting.

2
src/menu/_menu.scss
View File

@ -151,7 +151,7 @@
border: 0; border: 0;
} }
&[disabled] { &[disabled], &[data-mdl-disabled] {
color: $disabled-item-text-color; color: $disabled-item-text-color;
background-color: transparent; background-color: transparent;
cursor: auto; cursor: auto;

2
src/menu/menu.js
View File

@ -113,7 +113,7 @@
// Find the "for" element and bind events to it. // Find the "for" element and bind events to it.
var forElId = this.element_.getAttribute('for') || var forElId = this.element_.getAttribute('for') ||
this.element_.getAttribute('data-for'); this.element_.getAttribute('data-mdl-for');
var forEl = null; var forEl = null;
if (forElId) { if (forElId) {
forEl = document.getElementById(forElId); forEl = document.getElementById(forElId);