Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • Oct 24 21:14
    Dzetacq commented #2018
  • Oct 24 17:05
    Smankusors closed #6021
  • Oct 24 13:48
    Smankusors synchronize #6021
  • Oct 23 18:04
    BrendanBehr commented #1683
  • Oct 23 08:35
    dojca-nenad commented #3709
  • Oct 23 08:34
    dojca-nenad commented #3709
  • Oct 21 12:33
    Victor-Silva96 commented #6518
  • Oct 21 12:32
    Victor-Silva96 commented #6518
  • Oct 21 06:58
    saurabhnemade edited #6610
  • Oct 21 06:57
    saurabhnemade opened #6610
  • Oct 18 12:57
    matteoc99 commented #6609
  • Oct 16 12:57
    andrealmeid closed #6342
  • Oct 16 12:57
    andrealmeid commented #6342
  • Oct 16 11:57
    Smankusors commented #6342
  • Oct 16 11:21
    andrealmeid commented #6342
  • Oct 15 07:50
    pinkerltm edited #6609
  • Oct 15 07:50
    pinkerltm opened #6609
  • Oct 12 09:46
    dotjay commented #4745
  • Oct 12 09:01
    guyk-yahoo opened #6608
  • Oct 09 15:27
    mathewmeconry commented #6494
AlphaX2018
@AlphaX2018

Hi Sean, thanks a lot for your additional help! Really appreciate it! I dug further and found out that my theme uses a template script for the dropdown which is called Select2. I think it may just get too complicated to combine 'Materialize' and Select2

@AlphaX2018 so, just getting back to this - it's really simple:

<?php

// Load scripts (header.php)
function load_materialize_js()
{
    if ($GLOBALS['pagenow'] != 'wp-login.php' && !is_admin()) {

        wp_register_script('materializejs', get_template_directory_uri() . '/js/materialize.min.js', array('jquery'), '1.0.0'); // Materialize
        wp_enqueue_script('materializejs');

        wp_register_script('init', get_template_directory_uri() . '/js/init.js', array('jquery'), '1.0.0'); // Custom JS
        wp_enqueue_script('init');
    }
}


// Load styles
function load_materialize_css()
{
    wp_register_style('materialicons', 'https://fonts.googleapis.com/icon?family=Material+Icons');
    wp_enqueue_style('materialicons');

    wp_register_style('materializecss', get_template_directory_uri() . '/css/materialize.min.css', array(), '1.0.0', 'all');
    wp_enqueue_style('materializecss');

    wp_register_style('style', get_template_directory_uri() . '/style.css', array(), '1.0', 'all');
    wp_enqueue_style('style');
}



// Add Actions
add_action('init', 'load_materialize_js'); // Add Custom Scripts to wp_head
add_action('wp_enqueue_scripts', 'load_materialize_css'); // Add Theme Stylesheet
}

?>
I tried to find help on Stackoverflow how to make a Select2 dropdown expandable, but surprisingly it seems too challenging (I had zero replies).
Given that the theme uses Select2 by default, I dont want to navigate away from that and create even bigger problems.
Duke Yin
@yduke
Hi guys, is there a way to clear a "Chips" programmably? tried $('.chips-initial').material_chip('data'); = '' but not work
$('.chips-initial').material_chip('data') = ''
Bob James
@mobibob
in the materialize grid for columns, what does "push" and "pull" mean? I don't get it. maybe an mention of when it is useful to use.
i have a (line) space between rows. how can I get that removed? one suggestion was to put all "rows" in a single row, but I possibly want to style different rows differently (e.g., alternating colors for even/odd row).
are there pre-defined container/content "role"s? I know about "main", and I have seen others, but I don't know if they are custom or pre-defined.
Duke Yin
@yduke
Hi guys, is there a way to clear a "Chips" programmably?
Sean Doherty
@doughballs
@mobibob re space between rows - there is a margin bottom on every row, take it off.
1 reply
@mobibob re role - are you talking generally, or materialize? https://stackoverflow.com/questions/10403138/what-is-the-purpose-of-the-role-attribute-in-html
Sean Doherty
@doughballs

@mobibob re push pull - "You can easily change the order of your columns with push and pull."

If you look at the example in the docs, the cols are 7-5 initially, but display 5-7 because of the push-pull. It is to reverse the order of the columns at certain screen sizes. Useful depending on content.

GRawhideMart
@GRawhideMart
Hello everyone! Does anybody have an issue with fab buttons?
Anthony House
@tuffant21
image.png
image.png
@mobibob here is an example where I use push and pull. You always want to go mobile first.
Here you can see on mobile, I have col s12 for additional details. Then col s12 for the map.
On desktop however, I have m6 push-m6 l7 push-l5 on additional details and m6 pull-m6 l5 pull-l7 on the map. This causes the map to be to the left of the additional details
@GRawhideMart I have not had any issues with it
@yduke Can you post a codepen?
computerwiz12890
@computerwiz12890
Can I make a suggestion for an icon? Is it possible to add one to the already huge list?
Anthony House
@tuffant21
I think you would have to reach out to google to add an icon :p
Materialize references google's icon here https://material.io/resources/icons/?style=baseline
computerwiz12890
@computerwiz12890
Oh, I thought the developers behind Materialize were in this chat...
It's not a huge deal, I just think the "queue" icon could look more "queuey"
image.png
More like this.
"low_priority" will work as a replacement...I just think it could be better.
Anthony House
@tuffant21
They are, but I don't think I've ever seen them active in it. There are some devs on the side who are working on a new version. But I don't think they have access to change material icons. They're all google icons
Nice icon though!
computerwiz12890
@computerwiz12890

Ahh, gotchya.

Thanks! I made it myself in Paint.net. ^_^

Sean Doherty
@doughballs
@computerwiz12890 have you got the Startup theme btw? Well worth it, only £29. Anyway, in that theme they have designed some new icons and include them as a font (simple-line-icons), so they can be used using the i tag. I haven't played around with them, but that would be a really quick and easy way to design your own icons and then use them in your project 'the materialize way'.
computerwiz12890
@computerwiz12890
Nope, never heard of the Startup theme @doughballs. I'll have to check it out! Thanks
computerwiz12890
@computerwiz12890
Cool, thanks!
Willem Goudsbloem
@wgoudsbloem
Is there an easy way to adjust the material theme colours? For example material design talks in primaryColor, primaryColorLight, PrimaryColorDark, etc..
Sean Doherty
@doughballs
@wgoudsbloem yes, with Sass:
$primary-color: color("materialize-red", "lighten-2") !default;
$primary-color-light: lighten($primary-color, 15%) !default;
$primary-color-dark: darken($primary-color, 15%) !default;

$secondary-color: color("teal", "lighten-1") !default;
$success-color: color("green", "base") !default;
$error-color: color("red", "base") !default;
$link-color: color("light-blue", "darken-1") !default;
$primary-color is referencing the color set in _color-variables. The theme uses two main colors - teal and light red - so you could quickly change the whole theme by changing these two claues and then re-compiling the css file (as easy as opening the scss file and saving it if you use VSCode with live sass compiler installed)
Willem Goudsbloem
@wgoudsbloem
I was hoping to stay away from recompiling, but I guess that's the nature of the css beast :( Thanks for the pointer!
Anthony House
@tuffant21
You can use css to set colors, but you have to set it for each individual item. Kind of a pain tbh. That's the route I took, and now I wish I took sean's approach! :p
Willem Goudsbloem
@wgoudsbloem
yeah, I get that. my issue is that I ca't use the CDN now, so I have to set that all up which is more work than I hoped for.
albertrw83
@albertrw83
For the Materialize Chips autocomplete, once one chip is selected, how could I remove that as an autocomplete option when user is adding another chip?
weirdjon
@weirdjon
not sure if this has been asked before, but is there a way to make "hidden" work on css materialize select? only "disabled" and "selected" is working for options
Anthony House
@tuffant21
There is a hide class that hides the element
weirdjon
@weirdjon
still shows the option even after adding the class 'hide'
the main dilemma i have though is when i use 'multiple' on a select and disabled the first option, that disabled first option will automatically be part of the selected values. i was thinking of hiding it instead but i guess it will not solve the problem
Anthony House
@tuffant21
Can you post the code on something like codepen and maybe some images of current behavior vs expected behavior