Calcite Theme css files different on CDN then when built from Bower build of 3.16 JS API

3187
5
03-24-2016 11:56 AM
Jay_Gregory
Occasional Contributor III


I'm working on a bower / grunt build of the ArcGIS API 3.16 using the new Calcite theme.  If I point my two requite css files (calcite.css and esri.css) at the CDN (https://js.arcgis.com/3.16/esri/themes/calcite/dijit/calcite.css , and https://js.arcgis.com/3.16/esri/themes/calcite/esri/esri.css) instead of my local build (esri/css/calcite/calcite.css and esri/css/esri.css), my app looks pretty normal.  However, if I use the built version of the css files after using grunt-dojo plugin for a custom build, my app doesn't look nearly as clean.  Some of the fonts are bigger, my pop-up windows are mangled, and I don't receive any of the fastfont errors associated with the CDN versions of the files.  Any ideas what is going on here (or who at Esri I can tweet at that might know).

Thanks!

Tags (2)
0 Kudos
5 Replies
ReneRubalcava
Frequent Contributor

I'll investigate this one. The bower build should only be omitting some demo files for the calcite-theme, but everything else should be identical to the CDN.

I'm out of town for work this week, but will get to it when I get back.

Thanks!

Jay_Gregory
Occasional Contributor III

Were you able to reproduce the issue?

0 Kudos
ReneRubalcava
Frequent Contributor

Yes, these were omitted in the 3.16 bower release, but they shouldn't be used. You should be using either calcite-web, calcite-bootstrap, or calcite-maps.

GitHub - Esri/calcite-web: Authoritative front-end development resources for Calcite design initiati...

GitHub - Esri/calcite-bootstrap: A Calcite theme and a custom build system for building Bootstrap ap...

GitHub - Esri/calcite-maps: A framework for building map apps with Calcite styles and Bootstrap.

Those calcite files on the CDN are not updated often and I'm still not quite sure what is using them. The API uses some icons in widgets for 3.x, but the 4.x release will have very minimal calcite in itself.

I'll revisit this for next 3.x release, but 4.x Bower release will only include what is used in the API, as the options listed above are much better if you want to use the calcite styling.

Thanks!

0 Kudos
Jay_Gregory
Occasional Contributor III

Sorry, I think I'm a little confused.  Trying to style a page using 3.16 of the API, I'd need a calcite.css and esri.css, which I don't think are included with any of calcite-web, calcite-bootstrap, of calcite-maps that I can find.  There are the CDN versions....https://js.arcgis.com/3.16/esri/themes/calcite/dijit/calcite.css  and https://js.arcgis.com/3.16/esri/themes/calcite/esri/esri.css , which work great and as expected.  And there are the versions from building the 3.16 v of the Dojo JS API using Bower, Grunt, etc. etc (./esri/css/calcite/calcite.css, and ./esri/css/esri.css).  These local versions don't really work that well, especially with the attribute inspector widget but also with some other minor differences.  So if I'm to understand you correctly, are there some different css files to use in place of these, ones that are in calcite-web, calcite-bootstrap, or calcite-maps?  I'm already using calcite-maps-arcgis-3.x.css, which is built from calcite-maps, and calcite-bootstrap. 

Thanks!

0 Kudos
ReneRubalcava
Frequent Contributor

Sorry for confusion,

For next release of 3.x, we'll include the calcite css used in the API.

For 4.0, we are not really using the calcite stuff as widgets have been completely redone, so will not include it.

I don't have a date for 3.17, but 4.0 should be out fairly soon.

Thanks!

0 Kudos