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
0
votes
1 answer

MDL - Text field not working when loading view with $.get()

I'm using material design lite and i'm creating a popup through a get() jquery method. When i get the popup elements the mdl text field clicks don't work. But if i load the popup when page load work well. I'm loading de css files and js. I think the…
user3242861
  • 1,839
  • 12
  • 48
  • 93
0
votes
1 answer

Material Design Lite tabs with icons

I'm using Material Design Lite tabs (as with the template shown at https://getmdl.io/templates/text-only/index.html). I would like the links to have an icon as with the Github and download link on the MDL site itself: https://getmdl.io However, on…
nvcleemp
  • 514
  • 8
  • 21
0
votes
1 answer
0
votes
1 answer

What is the correct way to make a MDL button bigger?

I have accepted the fact that MDL does not have a built in "floating at bottom right" FAB button (similar to the Android SDK). However, I have stumbled upon another issue. There is no built-in way to make a regular button bigger. Be it a fab one or…
Dzhuneyt
  • 8,437
  • 14
  • 64
  • 118
0
votes
1 answer

MDL Tooltip not word-wrapping with Knockout

I'm building a table with data that can potentially be very long, so I've chosen to truncate the text if it's too long and add Material Design Lite tooltips to show the rest of the data when the user hovers over it. However, when the tooltip is…
Daniel Baughman
  • 121
  • 1
  • 1
  • 4
0
votes
1 answer

mdl-textfield inside mdl-menu material-design-lite

I am trying to use a material-design-lite mdl-textfield inside of a mdl-menu. The problem is, when I open the menu and click the textfield () it closes the menu. Does anyone know how I can prevent this without recreating/styling the menu…
d-_-b
  • 21,536
  • 40
  • 150
  • 256
0
votes
1 answer

EventEmitter in custom dialog component

I've got a custom dialog component and instead of using a service inside of the dialog component I want to use an event emitter and subscribe to that in the parent component. Is that something that's possible?
grizzm0
  • 33
  • 2
  • 7
0
votes
1 answer

Using Material Design card div element, but contents within card won't be centered

I'm trying to add align="center" to this card that is from Material Design Lite:
Lasagna Cat
  • 297
  • 3
  • 24
0
votes
1 answer

Dialog width too small, any way to change it?

I'm using a Dialog as a Form Container but when I have many Fields or a long h3 title, it gets strange, since the width is small (280px). Is there a way to change it's width without having to change it's css? Maybe a width property?
0
votes
1 answer

Trying to stagger Material Design cards and make them evenly distributed in their row

I am using this MDL template here: https://getmdl.io/templates/portfolio/index.html As you can see, the "cards" are aligned by 3 columns. What I'm having difficulty with is trying to stagger each "card" row by 2 columns, and then 3 columns, and so…
Lasagna Cat
  • 297
  • 3
  • 24
0
votes
1 answer

How to add custom dialog using angular2-mdl?

I am new to angular2 and im using angular2-mdl for my project. i tried to implement custom dialog given in the http://mseemann.io/angular2-mdl/dialogs but i am not to get it work. I am getting errors Cannot find name 'MdlDialogReference'. Property…
0
votes
2 answers

Material design lite smooth scroll

I am trying to implement a smooth scroll with material design lite. I found this thread which was similar in that it suggested to include 'mdl-layout__content' instead of 'html, body', but it didn't help with the problem. Material Design Lite and…
0
votes
2 answers

jQuery trigger click on focus, but not if clicked to focus

I am working on an MDL site. There is known issue that they still don't give a default select form element. The solution I found was to use a menu component, which will show when the input is clicked. Works well. But I noticed that the menu will…
jeffery_the_wind
  • 17,048
  • 34
  • 98
  • 160
0
votes
3 answers

Material Design Lite form button doesn't submit anything

I am rather new to CSS and might miss some basic thing. I get the code for HTML form from tutorial site for Material Design Lite but it doesn't send any HTTP request. What do I miss?
Daisuki Honey
  • 157
  • 4
  • 12
0
votes
1 answer

Show Dialog with Material Design Lite and Angular2

I want to show a dialog with angular2 as shown in this example: https://getmdl.io/components/index.html#dialog-section Therefore I am using the dialog polyfill here: https://github.com/GoogleChrome/dialog-polyfill This polyfill needs a dialog…
Gambo
  • 1,572
  • 3
  • 26
  • 52