https://www.gooddata.com/ logo
Join Slack
Powered by
Hello! I’ve just tried to include `@gooddata/sdk-u...
# gooddata-ui
t
Hello! I’ve just tried to include 
@gooddata/sdk-ui-dashboard/styles/css/main.css
file into a page, however, it contains invalid css in form of statements like this: 
url("~@gooddata/....")
. This is either scss or webpacks’s css-loader module syntax. You seem to assume that your users will be bundling the css with webpack, however, that is not the case for us. Is this something you can look into please?
👀 1
j
Hello @Tomáš Gajdoš! I'm just checking on my side and yes, I see several occurrences of 
url("~@gooddata/…
. The rest of the CSS file seems to work just fine in a plain HTML environment. Before I report this to our engineering, are there any other concerns besides this font issue?
Also, does applying font manually "on the side" work for you as a workaround before we resolve this in one of the upcoming releases?
t
Hi Jiri, thanks for getting back to me! There’s also few other statements with tilde in some other css files loading some svg assets so those have to be looked into as well. Including fonts “on the side” would actually be my preferred solution. Loads faster and caches better that way 🙂
👍 1
Another concern of mine is that main.css edits global styles, which a library shouldn’t do.
j
We faced this issue before and I thought we implemented some prefixes to avoid these clashes with other CSS… I see that for example 
@gooddata/sdk-ui-charts/styles/css/main.css
does not do that. Maybe the 
sdk-ui-dashboard
is an exception because it embeds the full dashboard 🤔 Good point, I'll raise this as well.
Is there anything else regarding CSS?
t
Yeah it seems to be the code from normalize.css left over only, everything else seems to be prefixed correctly. But I would ask for that to be removed too, please.
That’s all, thanks!
Ok, there’s one more thing, sorry
I’ve just noticed that the following snippet is in 
main.css
35 times!
Copy code
@font-face {
  font-family: "Indigo";
  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
  font-weight: normal;
  font-style: normal;
}
and there’s probably tons of other css probably more than duplicated 🙂 the file has almost 100000 lines
j
Got it!
I reported 3 issues internally. Thank you for your feedback @Tomáš Gajdoš!
🙏 1
i
@Tomáš Gajdoš hi there, pls I would like to ask which version of gooddata-ui-sdk are you using ?
t
Hi Ivan. It’s 8.11.0
i
EDIT: Ok thanks ... we did some improvements in 8.11.0 to minimalize duplicities and now next 8.12.0 will have some improvements too ... we are able to minimalize somehow but I guess some duplicities will still exists.
m
@Tomáš Gajdoš Global css should be removed from the 
sdk-ui-dashboard
package in version 8.12, that will be released Thursday next week (including also removal of normalize.css)
❤️ 4
t
Thank you all for such a short turnaround time for the fixes! It’s much appreciated.
👍 1
Hi! Looks like the global styles are removed in 8.12, indeed. Thanks for that. How about webpack/scss syntax in the vanilla css though? Is that on the way too? I wanna know if it’s worthwhile setting up and dealing with postcss processing or if I can just wait it out (preferred option 🙂 ).
m
Hello, @Tomáš Gajdoš we have a ticket for it and would like to cover it in the upcoming version (v9), however it's on the bottom of the backlog, so we cannot promise we will be able to deliver it in time. Some raw estimation for the release is ~3 months. So if you are able to deal with it in some way, it will very likely worth it. Sorry for the inconvenience.
t
Understood. Thanks for the info!
Open in Slack
PreviousNext
Powered by