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.

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

error compiling glyph fonts #1237

Closed
guptamo opened this issue May 26, 2015 · 9 comments
Closed

error compiling glyph fonts #1237

guptamo opened this issue May 26, 2015 · 9 comments

Comments

@guptamo
Copy link

guptamo commented May 26, 2015

I attempted to use libsass (specifically python libsass) as a way to integrate Materialize css (http://materializecss.com) into my django stack.

I was simply using sassc to compile the materialize.scss file and libsass strips the content value out of the out going css.

Something that should compile to this
.mdi-navigation-menu:before{content:"\e8a1"}

Compiles to this
.mdi-navigation-menu:before {content: ; }

I've already brought this issue up in the python libsass git here, and we determined that the issue is likely with libsass.

If you have any other questions about how I found this error feel free message me for more details.

@asottile
Copy link
Member

Possibly related: #1235

@xzyfer
Copy link
Contributor

xzyfer commented May 27, 2015

I have noticed this aswell, however in my experience this doesn't affect the browsers's behaviour. Please confirm this actually causes an issue?

@guptamo
Copy link
Author

guptamo commented May 27, 2015

It prevents the browser from rendering the glyphs completely.

From what I’ve seen it isn’t simply the text editor not respecting the encoding, the character is re-written to the css output as ◻.

Cheers,

Mohit Gupta

On May 27, 2015 at 11:30:09 AM, Michael Mifsud (notifications@github.com) wrote:

I have noticed this aswell, however in my experience this doesn't affect the browsers's behaviour. Please confirm this actually causes an issue?


Reply to this email directly or view it on GitHub.

@asottile
Copy link
Member

Can you produce a short example html + css. I'm failing to reproduce given the resources on their website

@xzyfer
Copy link
Contributor

xzyfer commented May 27, 2015

Duplicate of #1231.

@xzyfer xzyfer closed this as completed May 27, 2015
@guptamo
Copy link
Author

guptamo commented May 27, 2015

Ok let me walk you through how I get to the error.

  1. Download source SASS files right here
  2. Create a virtualenv and install libsass though pip
    pip install libsass
  3. Unzip SASS source files into the virtualenv
  4. Activate the virtualenv
  5. Use sassc command to compile the SASS source files
    sassc materialize.scss materialize.css

This is an excerpt compiled with Compass
.mdi-navigation-menu:before{content:"\e8a1"}

This is the same excerpt compiled using SASS
.mdi-navigation-menu:before { content: ; }

Not sure if this is relevant but I'm using Sublime Text 3 and just in case I checked the css using TextEdit.

@xzyfer
Copy link
Contributor

xzyfer commented May 27, 2015

This looks mildly suspicious. Haven't had time to look into it further.

@function unicode($str){
  @return unquote("\"") + $str + unquote("\"");
}

@kmsheng
Copy link

kmsheng commented Aug 10, 2015

same issue here

.glyphicon-plus:before {
content: "\2b"
}

The result will omit the slash in libsass 3.2.5

@asottile
Copy link
Member

fwiw I'm pretty sure you're missing your charset on your html document.

Compare renderings of these two:

<!doctype html>
<html>
<head>
    <style>
        div:after { content: '☃'; }
    </style>
</head>
<body>
    <div>test</div>
</body>
</html>

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <style>
        div:after { content: '☃'; }
    </style>
</head>
<body>
    <div>test</div>
</body>
</html>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants