Dave Jarvis' Repositories

git clone https://repo.autonoma.ca/repo/miller-columns.git
@charset "utf-8"; 

div#container {
  border-left: 2px solid #DDD;
  border-right: 2px solid #DDD;
  border-top-left-radius: 0.4em 0.4em;
  border-top-right-radius: 0.4em 0.4em;
  border-bottom-left-radius: 0.4em 0.4em;
  border-bottom-right-radius: 0.4em 0.4em;
}

/**
 *
 * Cascading columns styling.
 *
 */
div.columns {
  float: left;
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;

  background-color: #949494;
}

/* Display the lists as columns in blocks. */
ul.column {
  display: inline-block;

  vertical-align: top;
  overflow: hidden;
  margin: 0;
  padding: 0;

  border-right: 1px solid #666;
  background-color: white;
  white-space: normal;

  font-size: 0.9em;
}

/* Setting a list container class to "collapsed" will hide the column. */
ul.column.collapse {
  display: none;
}

/* Put some space between the column's list entries. */
ul.column > li {
  list-style: none;
  padding-left: 0.5em;
  padding-right: 0.5em;
  padding-top: 0.25em;
  padding-bottom: 0.25em;

  min-width: 200px;
}

ul.column > li.parent::after {
  content: "›";
  float: right;
  font-weight: bold;
}

/* Zebra stripes, which can be overridden. */
ul.column > li:nth-child(odd) {
  background-color: #EEE;
}

/* Highlight while hovering, without allowing selected items to override. */
ul.column > li:hover {
  color: black;
  background-color: #DDE4E8;
}

/* Ensure all selected nodes in the hierarchy are easily seen. */
ul.column > li.selected {
  background-color: #08C;
  color: white;
}

/**
 *
 * Breadcrumb styling.
 *
 */
div.breadcrumb {
  margin-top: 1em;
  border-top-left-radius: 0.4em 0.4em;
  border-top-right-radius: 0.4em 0.4em;

  border-bottom: 1px solid #666;
}

div.breadcrumb > span {
  height: 1.25em;
  line-height: 1.25em;

  font-size: 0.7em;
  font-weight: bold;
  color: #666;
}

div.breadcrumb > span::after {
  content: " › ";
}

div.breadcrumb > span:first-child {
  padding-left: 1em;
}

div.breadcrumb > span:last-child:after {
  content: "";
}

/**
 *
 * Toolbar styling.
 *
 */
div.toolbar {
  margin-bottom: 1em;
  border-bottom-left-radius: 0.4em 0.4em;
  border-bottom-right-radius: 0.4em 0.4em;

  clear: both;
  border-top: 1px solid #666;
}

/**
 *
 * Breadcrumb and toolbar styling.
 *
 */
div.breadcrumb, div.toolbar {
  height: 1.25em;
  background: linear-gradient(#f0f0f0, #d8d8d8);
}