github.com/matm/etcd@v0.3.1-0.20140328024009-5b4a473f1453/mod/dashboard/app/styles/stats.css (about)

     1  .etcd-container.etcd-stats {
     2    width: 100%;
     3    height: 500px;
     4  }
     5  
     6  .home-container .etcd-container.etcd-stats {
     7    height: 400px;
     8  }
     9  
    10  .etcd-container.etcd-stats h2 {
    11    margin-top: -7px;
    12  }
    13  
    14  .etcd-container.etcd-stats table .etcd-latency {
    15    width: 50%;
    16  }
    17  
    18  .etcd-container.etcd-stats .etcd-list {
    19    position: absolute;
    20    left: 100%;
    21    min-height: 100%;
    22    overflow-y: auto;
    23    overflow-x: hidden;
    24    top: 0px;
    25    box-sizing: border-box;
    26    -moz-box-sizing: border-box;
    27    background-color: #fff;
    28    width: 100%;
    29    border-left: 1px solid #ddd;
    30  }
    31  
    32  .etcd-container.etcd-stats .etcd-list .etcd-square {
    33    height: 10px;
    34    width: 10px;
    35    display: inline-block;
    36    margin-right: 5px;
    37  }
    38  
    39  .etcd-container.etcd-stats .etcd-list .etcd-square-red {
    40    background-color: #c40022;
    41  }
    42  
    43  .etcd-container.etcd-stats .etcd-list .etcd-square-orange {
    44    background-color: #FFC000;
    45  }
    46  
    47  .etcd-container.etcd-stats .etcd-list .etcd-square-green {
    48    background-color: #00DB24;
    49  }
    50  
    51  .etcd-container.etcd-stats .etcd-list .etcd-peer-type {
    52    color: #999;
    53    padding-left: 3px;
    54    font-size: 13px;
    55    line-height: 100%;
    56  }
    57  
    58  .etcd-container.etcd-stats .etcd-list .etcd-latency-value {
    59    display: inline-block;
    60  }
    61  
    62  .etcd-container.etcd-stats .etcd-graph {
    63    box-sizing: border-box;
    64    -moz-box-sizing: border-box;
    65    position: absolute;
    66    top: 0px;
    67    bottom: 0px;
    68    left: 0px;
    69    right: 0px;
    70    padding: 20px;
    71  }
    72  
    73  .etcd-container.etcd-stats .etcd-graph .etcd-graph-container {
    74    position: absolute;
    75    top: 60px;
    76    bottom: 20px;
    77    left: 20px;
    78    right: 20px;
    79    box-sizing: border-box;
    80    -moz-box-sizing: border-box;
    81  }
    82  
    83  
    84  /* Single Column Positioning */
    85  @media (max-width: 700px) {
    86    .etcd-container.etcd-stats .etcd-list {
    87      width: 100%;
    88      left: 100%;
    89    }
    90  
    91    .etcd-container.etcd-stats .etcd-graph {
    92      left: 0%;
    93    }
    94  
    95    .etcd-container.etcd-stats.etcd-table-reveal .etcd-graph {
    96      left: -100%;
    97      transition-property: all;
    98        transition-duration: 250ms;
    99        transition-timing-function: ease-in-out;
   100    }
   101    .etcd-container.etcd-stats.etcd-table-hide .etcd-graph {
   102      left: 0%;
   103      transition-property: all;
   104        transition-duration: 250ms;
   105        transition-timing-function: ease-in-out;
   106  
   107    }
   108    .etcd-container.etcd-stats.etcd-table-hide .etcd-format-selector .etcd-selector-graph svg * {
   109      fill: #428bca;
   110    }
   111  
   112    .etcd-container.etcd-stats.etcd-table-hide .etcd-list {
   113      left: 100%;
   114      transition-property: all;
   115        transition-duration: 250ms;
   116        transition-timing-function: ease-in-out;
   117    }
   118    .etcd-container.etcd-stats.etcd-table-reveal .etcd-list {
   119      left: 0%;
   120      transition-property: all;
   121        transition-duration: 250ms;
   122        transition-timing-function: ease-in-out;
   123    }
   124    .etcd-container.etcd-stats.etcd-table-reveal .etcd-format-selector .etcd-selector-table svg * {
   125      fill: #428bca;
   126    }
   127  }
   128  
   129  /* Double Column Positioning */
   130  @media (min-width: 700px) {
   131    .etcd-container.etcd-stats .etcd-list {
   132      width: 50%;
   133      left: 50%;
   134    }
   135  
   136    .etcd-container.etcd-stats .etcd-graph {
   137      left: 0%;
   138      width: 50%;
   139    }
   140  
   141    .etcd-container.etcd-stats .etcd-format-selector {
   142      display: none;
   143    }
   144  }