Wyze-Firmware/SD_ROOT/wz_mini/www/cgi-bin/config.css

BODY {
 --feed_ratio: 2.5;
 --display_bar_height: 20px;
 --border-color: #ccc;
 padding-bottom: var(--display_bar_height);
}
H1 {
 background-color:blue;
 color:white;
 height:calc(108px * (var(--feed_ratio) - 1));
 margin-top:0;
 padding:5px;
 margin-bottom:108px;
 width:calc(100% - (192px * var(--feed_ratio)));
}

.ii_block {
  border:3px solid var(--border-color);
  margin-bottom:5px;
  padding:2px;
  border-radius:3px;  
}
.ii_block_name {
  background-color:var(--border-color);
  text-align:center;
  font-weight:bold;
  color:#fff;
  margin:-2px;
  margin-bottom:3px;
}
.ii_info {
  color:#333;
}
.ii {
 width:100%;
 position:relative;
 display:flex;
}
.ii_key_DIV {

 flex:0 0 40vw;
 font-weight:bold;
}
.ii_value_DIV {
 flex: 0 0 40vw;
 text-align:right;
}
.ii_value {
  width:75%;
}
.feed {
  position:absolute;
  top:10px;
  right:0px;
  width:calc(192px * var(--feed_ratio));
  height:calc(108px * var(--feed_ratio));
  z-index:10;
}
.ii_explain {
   height:20px;
   overflow:hidden;
   width:20px;
   position:relative;
   color:transparent;
}
.ii_explain:hover {
    height: auto;
    position: absolute;
    left: 10%;
    width: 80%;
    border-radius: 3px;
    padding: 5px;
    background-color: #ccc;
    z-index: 10;
    border: 3px solid blue;
    font-family: monospace;
    white-space:pre-wrap;
    color:black;
}
.ii_explain:hover PRE {
 white-space:pre-wrap;
}
.ii_explain:hover:after {
  content:"";
  border:none;
  margin:0;
  padding:0;
  width:0;
  height:0;
}
.ii_explain:after {
 color:white;
 content:"?";
 text-align:center;
 background-color:blue;
 border-radius:50%;
 position:absolute;
 left:0;
 top:0;
 width:100%;
 height:100%;
}

.revert_DIV {
 display:flex;
 width:100%;
}
.revert_DIV DIV:nth-child(1) {
  width:30px;
}
.current_revert {
 background-color:#edf054;
}

#display_BAR {
  position:fixed;
  bottom:0;
  background-color:blue;
  border-top:1px solid lightblue;
  color:#fff;
  display:flex;
  width:100%;
  height:var(--display_bar_height);
}
#display_BAR DIV {
  padding-right:15px;
}
.ver_DIV {
    padding-left: 2vw;
    min-width: 12vw;
    font-family: monospace;
    flex: 1 0 9vw;
    overflow: hidden;
    font-size: 1.1vw;
}
.ver_DIV:before {
  content:attr(vertype);
  font-weight:bold;
  padding-right:10px;
}
.ver_DIV[vertype="wz_mini"] {
  flex:1 0 400px;
}
.fail_val {
 background-color:#fcc;
}