Stack Overflow
Stack Overflow

Questions tagged [material-design-lite]

Material Design Lite (or MDL for short) is an implementation of Material Design for the web by Google. Take note that Material Design Lite is currently in **limited support**, which means that no further development is taking place. Consider using Material Design Components for the Web instead.

Current version

v1.3.0

Purpose

From its GitHub repository:

An implementation of Material Design components in vanilla CSS, JS, and HTML.

Material Design Lite (MDL) lets you add a Material Design look and feel to your static content websites. It doesn't rely on any JavaScript frameworks or libraries. Optimized for cross-device use, gracefully degrades in older browsers, and offers an experience that is accessible from the get-go.

Support

As of 4 March 2018, MDL is currently in limited support. This means that no more work is taking place in the project.

Limited support

Material Design Lite is now in limited support, with development having moved to the Material Components for the web repository.

No further development is taking place in MDL by the core team, but we are happy to review PRs, fix critical bugs and push out new releases. No breaking changes will be accepted.

More info

Resources

640 questions
7
votes
1 answer

creating a slider with editable number field in material design lite

Is there any way to have a slider and next to it an editable field with it's current value? I am using MDL and not polymer, because its light weight and should be distributed with locally run software.
Davoud Taghawi-Nejad
  • 16,142
  • 12
  • 62
  • 82
7
votes
5 answers

How to make MDL tables responsive?

For MDL tables, is there an attribute to make the table responsive?
tw1742
  • 1,424
  • 4
  • 18
  • 37
6
votes
1 answer

ActiveRecord::StatementInvalid. SQLite3::SQLException: no such table

I'm creating a social network and I've a problem when adding a "Friend request". When I press the "Add friend" button, the Rails console shows me the following. Migration Friendships: class CreateFriendships < ActiveRecord::Migration[5.1] def…
José Antonio Camus Godoy
  • 161
  • 1
  • 14
6
votes
1 answer

how to apply a material design to file input tag?

I'm designing a website using google's material design lite, in my home page I have a file input tag the problem is that I can't find the appropriate mdl classes for styling this element
Ali HS
  • 99
  • 1
  • 11
6
votes
4 answers

How can I contain the styles of a Chrome Extension content script?

I'm working on a Chrome extension that injects some UI react components into a page. The UI components come from react-mdl. Using them requires me to include a css file in the top of my project. Unfortunately, once the css is injected into the…
Brandon
  • 7,736
  • 9
  • 47
  • 72
6
votes
0 answers

Pre filled MDL textfield causing issue with Angular2

I am working in a project with pure MDL and Angular2, but I am having an issue with the textfields and ngModel. When the angular component set some value to the object used in the model the MDL component doesn't run the dirty and validity check…
Henrique Rotava
  • 781
  • 1
  • 7
  • 13
6
votes
2 answers

material design lite - change drawer icon color

I can't find a way to change the drawer hamburger icon. Let's the code doing the talk : THE CODE drawer icon color
lemour_a
  • 155
  • 1
  • 7
6
votes
1 answer

Delay and Manually initialize mdl materialLayout

Strange bug..... I have a race condition where my angularJS directives for header and drawer are compiling after material-design-lite initializes the layout. It only seems to happen when I shut my wifi off and work offline. No remote resources are…
d-_-b
  • 21,536
  • 40
  • 150
  • 256
6
votes
2 answers

Using Angular2 With Material Design Lite

I am learning Angular2 but I have problem about using Angular2 with MDL. Why MDL navigation bar is not working with Angular2? When I use Navigation bar with header and drawer, drawer is not working so I cannot click on it, I cannot see drawer's…
Soulmaster
  • 101
  • 1
  • 9
6
votes
3 answers

MDL ready event

MDL is upgrading its components upon page load, so with autofocus attribute looses its focus. I want to set a focus on this input after MDL finishes rerendering. I'm trying to listen to some page ready event…
mu3
  • 739
  • 1
  • 7
  • 19
6
votes
1 answer

Material Design Lite hamburger menu not centered in header

I'm copying code directly from getmdl.io (the component page) and on all devices (multiple PCs, browsers, phones, etc) the hamburger menu is not centered in the header. I can't seem to isolate the menu icon in the css to realign it. All the…
Mike H
  • 109
  • 8
6
votes
1 answer

Material design lite, Check if scroll reached to the bottom

I am Using Material Design lite with Angular.js. Having the problem to get the event called when the event reach to bottom. I have tried almost every solution but not working. Like jQuery solution : $(window).scroll(function() { …
Rahul Sagore
  • 1,588
  • 2
  • 26
  • 47
6
votes
1 answer

hamburger icon is not showing up even if I call componentHandler.upgradeDom();

6
votes
6 answers

How to hide the icon menu on large screens?

I'm new at this and let me know how to hide the menu icon , and it adds automatically without being prompted, i want only to display on small screens. Sorry for the bad English. Thank You.
Juan Henriquez
  • 131
  • 1
  • 4
6
votes
6 answers

How to make icon move to the left on MDL header?

I tried setting the margin,padding to move the back-arrow icon to the left of the header but failed. How should I make this correct?
sammkj
  • 177
  • 2
  • 10
1 2
3
…
42 43