universe

Universe
git clone https://git.dasho.dev/universe.git
Log | Files | Refs | Submodules | README

chatreport.css (3322B)

      1 .chatReportList {
      2  display: block;
      3  width: 100%;
      4 }
      5 
      6 .chatReportList > .standardBtn {
      7  display: block;
      8  width: 100%;
      9  position: relative;
     10 }
     11 
     12 .chatReportList > .standardBtn > span {
     13  position: absolute;
     14  width: 18px;
     15  height: 18px;
     16  top: 50%;
     17  margin: -9px auto 0;
     18  left: 0;
     19  right: 0;
     20  display: block;
     21  opacity: 0;
     22  visibility: hidden;
     23 }
     24 
     25 .chatReportList > .standardBtn > span:before {
     26  width: 18px;
     27  height: 18px;
     28  border-left: 2px solid #fff;
     29  border-top: 2px solid #fff;
     30  border-bottom: 2px solid transparent;
     31  border-right: 2px solid transparent;
     32  content: "";
     33  border-radius: 100%;
     34  display: block;
     35  animation: rotating 0.75s linear infinite;
     36 }
     37 
     38 .chatReportList > .standardBtn:active,
     39 .chatReportList > .standardBtn:focus {
     40  animation: hidetext 0.5s linear forwards;
     41  animation-delay: 0s;
     42 }
     43 
     44 .chatReportList > .standardBtn:active > span,
     45 .chatReportList > .standardBtn:focus > span {
     46  animation: displayreload 0.5s linear forwards;
     47  animation-delay: 0s;
     48 }
     49 
     50 .chatReportList > .list {
     51  display: block;
     52  width: 100%;
     53 }
     54 
     55 .chatReportList > .list > .report {
     56  display: block;
     57  width: 100%;
     58  font-size: 0;
     59  background: #fff;
     60  padding: 5px 10px;
     61 }
     62 
     63 .chatReportList > .list > .report:nth-child(even) {
     64  background: #efefef;
     65 }
     66 
     67 .chatReportList > .list > .report .left {
     68  display: inline-block;
     69  vertical-align: top;
     70  width: calc(100% - 100px);
     71  padding-right: 5px;
     72 }
     73 
     74 .chatReportList > .list > .report .left > .username {
     75  font-weight: bold;
     76  font-size: 16px;
     77  color: #000;
     78  display: inline-block;
     79  vertical-align: middle;
     80  width: calc(100% - 100px);
     81  margin-bottom: 5px;
     82 }
     83 
     84 .chatReportList > .list > .report .left > .message {
     85  display: block;
     86  padding: 5px;
     87  border: 1px solid #e74c3c;
     88  color: #000;
     89  font-size: 14px;
     90  border-radius: 3px;
     91 }
     92 
     93 .chatReportList > .list > .report > .right {
     94  display: inline-block;
     95  vertical-align: top;
     96  width: 100px;
     97 }
     98 
     99 .chatReportList > .list > .report > .right > .standardBtn {
    100  display: inline-block;
    101  vertical-align: middle;
    102  width: 100px;
    103  position: relative;
    104  margin: 0 0 5px;
    105 }
    106 
    107 .chatReportList > .list > .report > .right > .standardBtn > span {
    108  position: absolute;
    109  width: 18px;
    110  height: 18px;
    111  top: 50%;
    112  margin: -9px auto 0;
    113  left: 0;
    114  right: 0;
    115  display: block;
    116  opacity: 0;
    117  visibility: hidden;
    118 }
    119 
    120 .chatReportList > .list > .report > .right > .standardBtn > span:before {
    121  width: 18px;
    122  height: 18px;
    123  border-left: 2px solid #fff;
    124  border-top: 2px solid #fff;
    125  border-bottom: 2px solid transparent;
    126  border-right: 2px solid transparent;
    127  content: "";
    128  border-radius: 100%;
    129  display: block;
    130  animation: rotating 0.75s linear infinite;
    131 }
    132 
    133 .chatReportList > .list > .report > .right > .standardBtn:active,
    134 .chatReportList > .list > .report > .right > .standardBtn:focus {
    135  animation: hidetext 0.5s linear forwards;
    136  animation-delay: 0s;
    137 }
    138 
    139 .chatReportList > .list > .report > .right > .standardBtn:active > span,
    140 .chatReportList > .list > .report > .right > .standardBtn:focus > span {
    141  animation: displayreload 0.5s linear forwards;
    142  animation-delay: 0s;
    143 }
    144 
    145 .chatReportList > .list > .report > .right > .standardBtn:last-child {
    146  margin-bottom: 0;
    147 }