HTML5 Viewer styling issues

Chris Dunlop

May 05, 2015 04:34

I've run across a few styling issues with the HTML5 viewer (v2.4) out of the box.  These are all on the desktop config:

1 - Results Details - the attribute values only utilize a small width of the results pane before wrapping.  They should expand to the full width of the pane.

/customer/servlet/servlet.FileDownload?file=00P6000000eltp6EAA

 

 

2 - The results header line is clipped slightly (the "y" and "g"s in the example below)

/customer/servlet/servlet.FileDownload?file=00P6000000em1gREAQ

 

 

3 - Workflow forms contain way too much white space.  Items now look like they're double spaced compared to the Silverlight Viewer.

/customer/servlet/servlet.FileDownload?file=00P6000000eltnoEAA

 

 

4 - The basemap widget text only allows for ~ 11 characters before it's truncated.  All our Aerial basemaps are called "Aerial Photos - 2012" etc, so you can't differentiate between them.  I'll change their names, but maybe 2 lines of text would help. (on a side note, is there any configurable way to turn off the basemap widget in the HTML5 Viewer?)

/customer/servlet/servlet.FileDownload?file=00P6000000eltn1EAA

 

That's all for now!

Chris

0

• 

  Longguang Fan

  May 05, 2015 04:58

  Please set up the BasemapView visible to false to turn off the basemap widget in configuration file.

  {         "moduleName": "Basemap",         "moduleType": "geocortex.essentialsHtmlViewer.mapping.modules.basemap.BasemapModule",         "configuration": {},         "views": [           {             "id": "BasemapView",             "type": "geocortex.essentialsHtmlViewer.mapping.modules.basemap.BasemapView",             "markup": "Mapping/modules/Basemap/BasemapView.html",             "region": "BottomLeftMapRegion",             "visible": false ,             "configuration": {             }           },

  0
• 

  Stefan Schweigert

  May 05, 2015 05:05

  Hello Chris,

  There's actually a field called 'Short Display Name' for the map services that are displayed in the Base Map picker which you can use instead of the Display Name for the service. In your case, this setting could be the Year. It would also make sense to enable the Base Map Slider view and configure all of the base maps to share a group, configured on the Functional tab for each service.

   

  I hope that helps,

   

  Stefan.

  0
• 

  Permanently deleted user

  May 05, 2015 06:26

  Hi Chris, 

   

  I looked into issue 1 and that is indeed not supposed to be so small, I have filed it as a bug in our tracking system, thank you for bringing it to our attention! The problem is that the compact feature details view is taking the css properties of our new expanded feature details view, which results in a lot of unnecessary white space.

   

  In the meantime, I have a workaround that will make it look a lot nicer for you. If you add the following line of CSS to your custom Desktop.css file (located here: C:\Program Files (x86)\Latitude Geographics\Geocortex Essentials\Default\REST Elements\Sites\ <site_name> \Viewers\ <viewer_name> \VirtualDirectory\Resources\Styles\Custom\Desktop.css  ) it will make the text expand to the maximum width of the container before wrapping.

   

   

  .FeatureDetailsCompactView .multi-column-container{

   

      width:100%;

   

  }

   

   

  I will also look into your other issues and keep you posted on any work-arounds I find for them.

   

  Thanks,

   

  Cory Purnell

   

  Latitude Geographics Quality Assurance Team

  0
• 

  Permanently deleted user

  May 05, 2015 06:54

  Hi again Chris,

   

  I looked into your 3rd issue as well, and came up with another CSS change. 

   

  In the same place as we added CSS last step (C:\Program Files (x86)\Latitude Geographics\Geocortex Essentials\Default\REST Elements\Sites\ <site_name> \Viewers\ <viewer_name> \VirtualDirectory\Resources\Styles\Custom\Desktop.css ) add the following to remove all the extra padding in your form.

   

  .form-item{

   

      padding: 0;

   

  }

   

  Note: this will get rid of all padding, so you may need to configure it specifically to fit your needs (if you need any help with that let me know).

   

  Thanks,

   

  Cory Purnell

   

  Latitude Geographics Quality Assurance Team

  0
• 

  Guido Sitta (GeoGraphics S.r.l.)

  May 05, 2015 14:24

  Thanks for opening this thread.

  Is it somehow possible to change the style of details frame? The new columning of data is some blurry and I think I need to change font colors and style...

   

   

  0
• 

  Chris Dunlop

  May 08, 2015 01:54

  Thanks everyone for your help.  Got my sites to look a lot better.

  Chris

  0
• 

  Kathy Andersen

  May 08, 2015 08:46

  To expand the results details text, can this be done globally in the general Desktop.css?

  .FeatureDetailsCompactView .multi-column-container{

   

       width:100%;

   

   }

  Thank you.

  0
• 

  Permanently deleted user

  May 08, 2015 23:50

  Hi Kathy,

   

  Yes, if you add that to your Desktop.css file at C:\inetpub\wwwroot\Html5Viewer\Resources\Styles\Desktop.css  it will make the feature details compact view text show at 100%. 

   

  Sorry I should have specified in my previous comment

   

  Cory Purnell

   

  Latitude Geographics Quality Assurance Team

  0
• 

  Kathy Andersen

  May 08, 2015 23:55

  THANK YOU!

  0
• 

  Permanently deleted user

  May 13, 2015 00:42

  Running into the same formatting problems on HTML5 Viewer v2.4 with Horizontal groups that contain Radio Button and Check Box Items...

  Padding does not seem to have an effect.

   

  Any suggestions????

  /customer/servlet/servlet.FileDownload?file=00P6000000eltzfEAA

   

  0

Please sign in to leave a comment.