Search code examples
cssbase64aemdata-uri

How can I force CQ5.5 to ignore CSS data-uri-schemes?


I am trying to include a custom font into css using the data-uri-scheme. CQ5 (I'm using version 5.5) is adding the path from the clientlib directory to the location where the css file with the data-uri-scheme font data is located.

So instead of just ignoring the css property:

@font-face {
  font-family: 'CustomFont';
  src: url(data:application/x-font-woff;...
  ...
}

CQ5 does the following:

@font-face {
  font-family: 'CustomFont';
  src: url(desktop/css/data:application/x-font-woff;...
  ...
}

Is this a bug in CQ5.5 or can I add/do something to prevent the addition of "desktop/css"?

The result is, I'm getting 404 HTTP status because the font is "not found".

[UPDATE]:

The css file is included in the base.jsp in the html <head> section.

<link rel="stylesheet" 
    href="/etc/designs/myproject/clientlib/desktop.css" type="text/css"/ >

Location of base.jsp:

/apps/myproject/pages/base/base.jsp

Location of css.txt:

/etc/designs/myproject/clientlib/desktop/css.txt

Solution

  • It's a bug, will be fixed with 5.6. Including the individual css file directly (as mentioned) avoids the clientlib rewriting, otherwise I don't know of a workaround inside a clientlib.

    The reason is that clientlibs are rewriting the relative paths because the base changes from the individual css file to the concatenated clientlib css. "data:" uris were simply not considered properly here.