Hiding Entity Key column - text not wrapping

[jrchudy]

In RBK, there is a custom style written to hide the enitity-key for one of the columns in the visible-columns section. We should be wrapping the text properly when hiding the entity-key column but the entity-value remains.

The following styles are currently being applied to this page:

/* Study:Cellbrowser_URI : suppress column header */
.r_s_RNASeq.r_t_Study #row-Cellbrowser_URI .entity-key {
    display: none;
}

/* Study:Cellbrowser_URI: indent iframe */
.r_s_RNASeq.r_t_Study #row-Cellbrowser_URI .entity-value {
  padding-left: 40px;

  /* temporary solution that will fix the wrapping of iframe caption
   * This is caused because we're setting width for the firt column,
   * and by hiding the header cell, the data cell will be treated as first column by HTML.
   */
  white-space: nowrap;
}

Another page with the following styles:

/* suppress column header */
.r_s_Gene_Expression.r_t_Image #row-uri .entity-key {
    display: none;
}
/* indent iframe */

.r_s_Gene_Expression.r_t_Image #row-uri .entity-value {
  padding-left: 40px;
}

And a 3rd page with the following styles:

/* ------ Gene Expression: Image_Annotation_File ----------- */
/* suppress column header */
.r_s_Gene_Expression.r_t_Image_Annotation_File #row-\$Preview .entity-key {
  display: none;
}

.r_s_Gene_Expression.r_t_Image_Annotation_File #row-\$Preview .entity-value {
  padding-left: 40px;
}

[jrchudy]

We can see based on the 3 examples above, that this applies to the caption for an iframe/image as well as the link. In the 1st example the text wrapping is working properly since white-space: nowrap; is defined. The other 2 cases could be fixed to use the same style as well, but further investigation can be done to see if this is something chaise can do instead of the data modeler.

[jrchudy]

white-space: nowrap; can be added to temporarily resolve this issue. One concern is with captions with long text, this would cause the text to flow off the screen instead of wrapping at edge of page.

The best solution for this is to implement hiding column headers per column as described in this issue. Afterwards CSS styles will need to be removed and the annotation implemented for iframes that have the entity key hidden.

[jrchudy]

The changes to support hiding individual column headers using the column-display annotation have been merged into master.

Reassigning this issue to @hongsudt so she can update the custom.css to no longer hide column header this way.

Another note: The white-space: nowrap; style should be removed from this rule since the merged code fixes the issue this style was fixing. Keeping this style will cause long captions to flow off the right side of the page instead of properly wrapping.

/* Study:Cellbrowser_URI: indent iframe */
.r_s_RNASeq.r_t_Study #row-Cellbrowser_URI .entity-value {
  padding-left: 40px;

  /* temporary solution that will fix the wrapping of iframe caption
   * This is caused because we're setting width for the firt column,
   * and by hiding the header cell, the data cell will be treated as first column by HTML.
   */
  white-space: nowrap;
}
``

[ljpearlman]

This is the CSS file: https://github.com/informatics-isi-edu/rbk-www/blob/master/assets/css/chaise.css. When we update chaise on rbk-staging and rbk-www, we'll need to coordinate with @crisaless, since that will require an update of the static site.

[RFSH]

Closing due to inactivity.