Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

I do not have Icons #1265

Closed
lgt opened this issue Jul 25, 2015 · 6 comments
Closed

I do not have Icons #1265

lgt opened this issue Jul 25, 2015 · 6 comments
Labels
package: icons Specific to @mui/icons

Comments

@lgt
Copy link

lgt commented Jul 25, 2015

I followed the example adding icons to a component but none of the shows up.

render(){
   let styles = this.getStyles();

   let githubButton = (
      <IconButton
        iconClassName="muidocs-icon-custom-github" color={Colors.red500}
        href="https://github.com/callemall/material-ui"
        linkButton={true} />
    );

 let containerStyle = {
    paddingTop: '100px'
  };

  return (
    <AppCanvas>
      <AppBar title='UnyDent' onLeftIconButtonTouchTap={this._handleClick} zDepth={1}
      style={{}}
      iconElementRight={githubButton}></AppBar>
  <LeftNav
      ref="leftNav"
      docked={false}
      menuItems={menuItems}
      selectedIndex={this._getSelectedIndex()}
      onChange={this._onLeftNavChange} />

 <div style={containerStyle}>
  <section className="content">
      <div className="container">
      <RouteHandler />
      </div>
  </section>
  </div>
  </AppCanvas>);
}

I do not have any errors in my console
@Zadielerick
Copy link
Contributor

@lgt you misspelled iconClassName as icomClassName. Also, if this doesnt work, you can try using the Google material icons that we implemented, you would give the iconClassName "material-icons" and give the children a name. For example, to implement a home button, you would put:
<IconButton iconClassName="material-icons">home</IconButton> Let me know if this works

@lgt
Copy link
Author

lgt commented Jul 25, 2015

Obviously I'm doing something wrong I corrected the typo (thanks for that) but do not work.
Trying second suggestion which won't works either. Do I need to include in my markup from somewhere?

@Zadielerick
Copy link
Contributor

Ummm theres a script you have to include in your index.html for the second option:
https://www.google.com/design/icons/
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> That would have to be included in your code.
As for the first way you were doing it, did you include the class in your css page. You can look here

@lgt
Copy link
Author

lgt commented Jul 25, 2015

Already included here is my index.html
same end effect

 <!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>UnyDent</title>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">   
    <!-- build:css -->
    <link rel="stylesheet" href="dist/styles/main.css">
    <!-- endbuild -->
  </head>
  <body>
    <div class="container">
      <div id="content"></div>
    </div>
      <!-- This script adds the Roboto font to our project. For more detail go to this site:  http://www.google.com/fonts#UsePlace:use/Collection:Roboto:400,300,500 -->
  <script>
    var WebFontConfig = {
      google: { families: [ 'Roboto:400,300,500:latin' ] }
    };
    (function() {
      var wf = document.createElement('script');
      wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
      wf.type = 'text/javascript';
      wf.async = 'true';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(wf, s);
    })();
  </script>
    <!-- build:js -->
    <script src="dist/app.js"></script>
    <!-- endbuild -->
  </body>
</html>

@lgt
Copy link
Author

lgt commented Jul 25, 2015

Thanks I got it!

@lgt lgt closed this as completed Jul 25, 2015
@Zadielerick
Copy link
Contributor

@lgt Cool, glad you got it to work!

mnajdova pushed a commit to mnajdova/material-ui that referenced this issue Nov 10, 2020
@dmtrKovalenko
Do not allow input any chars when value is nul (mui#1265)
142cb5f
@oliviertassinari oliviertassinari added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Dec 25, 2022
@zannager zannager added package: icons Specific to @mui/icons and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Jan 13, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
package: icons Specific to @mui/icons
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@lgt @oliviertassinari @Zadielerick @zannager