Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Jan 14 10:14
    cimenta commented #6123
  • Jan 13 16:04
    Dogfalo deleted #6649
  • Jan 13 16:04
    Dogfalo deleted #6665
  • Jan 12 21:11
    leonardorafael commented #6665
  • Jan 12 21:02
    DanielRuf commented #6665
  • Jan 12 20:59
    leonardorafael commented #6665
  • Jan 11 11:19
    les113 commented #3829
  • Jan 08 22:53
    stap123 commented #5756
  • Jan 08 22:45
    stap123 commented #5756
  • Jan 08 22:42
    ncovercash commented #5756
  • Jan 08 22:40
    stap123 closed #5756
  • Jan 08 13:28
    ignasdamunskis commented #6464
  • Jan 06 12:43
    MadhaviMandalia synchronize #6664
  • Jan 06 07:49
    MadhaviMandalia synchronize #6664
  • Jan 05 19:00
    MadhaviMandalia synchronize #6664
  • Jan 05 18:54
    MadhaviMandalia synchronize #6664
  • Jan 05 17:22
    MadhaviMandalia synchronize #6664
  • Jan 05 17:03
    MadhaviMandalia synchronize #6664
  • Jan 04 11:40
    MadhaviMandalia synchronize #6664
  • Jan 03 08:16
    MadhaviMandalia synchronize #6664
ShinProg (Logan Tann)
@LoganTann
!important is considerate as a bad practice, the best way is to use strong CSS selectors
Chuck McKnight
@cmcknight
I'm not sure I know what you mean by a strong CSS selector. Could you explain
SirePi
@SirePi

hello everyone, I'm having a bit of an issue with the select component in materialize + angular (using it as a common js library)
In particular, I can initialize the select, but once I click on it I get an ERROR TypeError: can't access property "getBoundingClientRect", this.el.offsetParent is null

I tried poking inside the code, and the problem is

 key: '_getDropdownPosition',
value: function () {
  this.el.offsetParent.getBoundingClientRect(); <<< here
  var t = this.el.getBoundingClientRect(),

in addition, it seems that that line is useless (unless it forces a recalculation that has some other side effects).
I'm initializing the select like this

  ngDoCheck(): void {
    var elems = document.querySelectorAll('select');
    if(elems.length)
      M.FormSelect.init(elems, {});
  }

so that every time something changes, it is reinitialized. Am I doing something wrong?

Emiliano
@emilinao:matrix.org
[m]
Hey! I've never used css i was following a php tutorial but it seems like some things have changed since the tutorial was made cause the same exact code doesn't work.
or at least, it works but it comes up in a different scaling
the class section is supposed to space out stuff right?
Emiliano
@emilinao:matrix.org
[m]
aight found the solution
ShinProg (Logan Tann)
@LoganTann

I'm not sure I know what you mean by a strong CSS selector. Could you explain

instead of .switch label input[type="checkbox"]:checked + .lever that marterialize uses, you will have to override it to .switch.custom-color label input[type="checkbox"]:checked + .lever and add the custom-color class to the switch element


Hello @SirePi can you share a codepen demonstrating your issue? If that's a bug, we can fix it in the community repository (github.com/materializecss)
suporteeja
@suporteeja
Hi
I need help
1 reply
MumblingFumbler
@MumblingFumbler
I want to use materialize icons in developing a google workspace add-on. The JSON for the add-on requires a URL for the icon. From Google Quickstart:
MumblingFumbler
@MumblingFumbler

The above message was cut off:
From Google Add-on Quickstart JSON:
"logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/pets_black_48dp.png"
How do I derive the icon URL from the materialize icons described here:
https://materializecss.com/icons.html

Thanks for your help,
Mumbling Fumbler

MumblingFumbler
@MumblingFumbler
OK, I think I figured it out, but it would be great if the mapping were documented somewhere.
supergnaw
@supergnaw
Is there a class for <table> elements to make the rows more compact? I thought there was a while back but I'm re-reading the documentation and can't find it anymore.
Junior
@Muhammad-Waleed-Hafeez
image.png
hi there!
i'm adding html sel;ect tag in my project but for some reason Materialize's select adding another "select-wrapper class inside my select . can anyone tell me what am i doing wrong here?
i'm new to Materialize theme.
Junior
@Muhammad-Waleed-Hafeez
<div class="row">
                    <div class="input-field col s12 m6">
                        <select asp-for="CityId" asp-items="@ViewBag.CitiesSelectList">
                            <option value="" disabled selected>Select City...</option>
                        </select>
                        <span asp-validation-for="CityId" class="text-danger"></span>
                    </div>
                </div>
this is my code
Bharath8785
@Bharath8785
Hello people,
this is Bharath. amateur in coding
i just came across cdn thing there i have seen 2 links. one for css and other for js. so i just want to know the difference between those 2
Karthick Sundar Subramanian
@karthicksndr

Hi there! I was using materialize autocomplete form until 2 days ago and it suddenly stopped working

<div class="input-field col s6">
                  <i class="material-icons prefix">find_in_page</i>
                  <input type="text" id="projSel" class="autocomplete" required>
                  <label for="projSel">Select Project</label>
   </div>

this is my autocomplete element


google.script.run.withSuccessHandler(pickProj).projPikcer()
  });

  function pickProj(options)
  {
   var projPicker = document.getElementById('projSel');  
   var instances = M.Autocomplete.init(projPicker, options);
   }

Confirmed that projPikcer() is returning a list of options but pickProj() callback isn't setting up the autocomplete list.

Stephanieliling
@Stephanieliling
Hello 👋
beaulowenstern
@beaulowenstern
@karthicksndr I've just found the same issue with all my autocomplete forms on my web app. Can anyone else confirm this or give any solutions?
beaulowenstern
@beaulowenstern

@karthicksndr I don't know whether you found a solution, but changing 'null' to 'false' in the autocomplete object did the trick.

Courtesy of a commenter on YouTube (not from me):
The autocomplete list object was being populated correctly serverside (logs showed {bob=null, fred=null, jane=null} etc. but clientside, I was suddenly retrieving an empty object {}. After a LOT of headscratching, it seems something has changed with the way "null" is handled. Previously this worked:

options[v[0]] = null;

As of today (well, for me anyway, who knows how long it's been happening given server upgrades etc.) I need to use:

options[v[0]] = false;

Hope this helps!

Sean Doherty
@doughballs
@ArelGindosKornit there is a callback for on cycle to I believe, check the docs for that page (options)
Anthony Leonardi
@AJLeonardi
I'm having trouble initializing new select elements. Basically I'm adding select elements to the DOM when a user clicks a button. I've tried re-initializing all selects, I've tried initializing just the selects that are added, but the 'new' ones never work. Here's a js fiddle of the code I've got (without the fixes I tried...). https://jsfiddle.net/AJLeonardi/szt1enob/23/
18 replies
I'm hoping someone out there has an easy fix. thanks!
Matthew Reichardt
@matthewjamesr
Hey all! Is Materialize still supported? Meaning, is someone able to path the security vulnerabilities that are currently present? A merge has not occurred in a while.
1 reply
Bharath8785
@Bharath8785
Hey guys
is anyone there
Iam trying to create a website where iam using materialize css. there I used a slider with 2 images. and text animation on those 2 images. now here what i want is a layer between the image and the text on both slides. and that layers should be transparent
jshster
@jshster

Hey all! Is Materialize still supported? Meaning, is someone able to path the security vulnerabilities that are currently present? A merge has not occurred in a while.

Are you aware of the new fork?

1 reply
Bharath8785
@Bharath8785
can anyone of you people help me in this
15 replies
jshster
@jshster
image.png
dgoersvocera
@dgoersvocera
Hi. I have a <select> element with a few AngularJS directives including ng-disabled and ng-change. When I initialize the <select> using const elems = document.querySelectorAll('select'); const instances = M.FormSelect.init(elems, {});
It seems the <select> is permanently set to whatever the value of ng-disabled was. However, ng-change continues to work.
aISA
@IsaAgverdiev
hello, how can i customize the carousel like in circle
David
@ddtch
Hi guys, pls does anyone get succes to off autofill and autocomplete for matInput fields?
murphcoder
@murphcoder
Hello. I'm working on a Ruby On Rails app with the Materialize gem, and I'm having difficulty solving an issue. I have two identical select menus on my page that are part of different ruby generated forums. Whenever I use the select menu twice on one page, neither instance appears
FilipExor
@FilipExor
image.png
Hi, when using the multiple property on a select we notice that the placeholder remains after selecting options. Is there a way to remove this when an option is selected. The same way as single select?
FilipExor
@FilipExor
image.png
We read that there is a fix for this and it looks like it is implemented but still dosn't work.
alejandrogagocr
@alejandrogagocr
image.png
Hi, i have this problem in my database, with the date picker, the date data is corrupted
jshster
@jshster
@alejandrogagocr how is the data getting in your database? If you are using the default DatePicker the formatting is almost certainly M d, Y but your database will require international format Y-m-d. Ont think this one can be blamed on the datepicker.
Bryn3ds
@Bryn3ds
yo
fcoterroba
@fcoterroba

Hello guys! I'm developing a landing page for a personal project and I can't do a carousel/slider

I copy/paste this example https://materializecss.com/carousel.html#special but don't work for me

2 replies