css/unrealircd-admin.css

   1 .unrealircd_overview {
   2         font-family: arial, sans-serif;
   3         border-collapse: collapse;
   4         border-radius: 7px;
   5         width: 25%;
   6         box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
   7 }
   8
   9 .badge-pill {
  10         box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  11 }
  12
  13 .curvy {
  14         border-radius: 7px;
  15         margin: 2px;
  16 }
  17
  18 .short-form-control {
  19         width: 70%;
  20 }
  21
  22
  23 .align_right {
  24         width: 10px;
  25         text-align: right;
  26 }
  27
  28 .input_text {
  29         border-radius: 7px;
  30 }
  31
  32 .filter-fields {
  33         height: 30px;
  34         width: 400px;
  35         padding: 5px 5px;
  36         margin: 8px 0;
  37         border-radius: 7px;
  38 }
  39
  40
  41 .align_label {
  42         width: 80px;
  43         display: inline-block;
  44         text-align: right;
  45 }
  46
  47 body {
  48     padding-bottom: 120px;
  49 }
  50 footer {
  51         font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  52         position: absolute;
  53         bottom: 0;
  54         width: 100%;
  55         height: 55px;
  56         display: none !important;
  57   }
  58
  59 .topnav {
  60         background-color: #333;
  61         overflow: hidden;
  62         font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  63
  64 }
  65
  66
  67
  68 body {
  69         padding-top: 45px;
  70         background-image: url("../img/background.jpg");
  71         background-attachment: fixed;
  72         display: flex;
  73         flex-direction: column;
  74 }
  75
  76
  77 .alert-short {
  78         width: 40%;
  79 }
  80
  81 /* The close button */
  82 .closebtn {
  83         color: black;
  84         font-weight: bold;
  85         float: right;
  86         font-size: 22px;
  87         line-height: 20px;
  88         cursor: pointer;
  89         transition: 0.3s;
  90 }
  91
  92
  93 .checkbox-dropdown {
  94         width: 200px;
  95         border: 1px solid #aaa;
  96         padding: 10px;
  97         position: relative;
  98         margin: 0 auto;
  99
 100         user-select: first;
 101 }
 102
 103 /* Display CSS arrow to the right of the dropdown text */
 104 .checkbox-dropdown:after {
 105         content:'';
 106         height: 0;
 107         position: absolute;
 108         width: 0;
 109         border: 6px solid transparent;
 110         border-top-color: #000;
 111         top: 50%;
 112         right: 10px;
 113         margin-top: -3px;
 114 }
 115
 116 /* Reverse the CSS arrow when the dropdown is active */
 117 .checkbox-dropdown.is-active:after {
 118         border-bottom-color: #000;
 119         border-top-color: #fff;
 120         margin-top: -9px;
 121 }
 122
 123 .checkbox-dropdown-list {
 124         list-style: none;
 125         margin: 0;
 126         padding: 0;
 127         position: absolute;
 128         top: 100%; /* align the dropdown right below the dropdown text */
 129         border: inherit;
 130         border-top: none;
 131         left: -1px; /* align the dropdown to the left */
 132         right: -1px; /* align the dropdown to the right */
 133         opacity: 0; /* hide the dropdown */
 134
 135         transition: opacity 0.4s ease-in-out;
 136         height: 100px;
 137         overflow: scroll;
 138         overflow-x: hidden;
 139         pointer-events: none; /* avoid mouse click events inside the dropdown */
 140 }
 141 .is-active .checkbox-dropdown-list {
 142         opacity: 1; /* display the dropdown */
 143         pointer-events: auto; /* make sure that the user still can select checkboxes */
 144 }
 145
 146 .checkbox-dropdown-list li label {
 147         display: block;
 148         border-bottom: 1px solid silver;
 149         padding: 10px;
 150
 151         transition: all 0.2s ease-out;
 152 }
 153
 154 .checkbox-dropdown-list li label:hover {
 155         background-color: #555;
 156         color: white;
 157 }
 158
 159 .table-striped>tbody>tr:nth-child(even)>td,
 160 .table-striped>tbody>tr:nth-child(even)>th {
 161    background-color: #a5a5a549;
 162  }
 163  .table-striped>tbody>tr:nth-child(odd)>td,
 164  .table-striped>tbody>tr:nth-child(odd)>th {
 165         background-color: #ffffff;
 166   }
 167
 168   /* Small screens (max-width: 576px) */
 169 @media (max-width: 576px) {
 170    /* Change the font size for all headings */
 171    h1, h2, h3, h4, h5, h6 {
 172     font-size: 18px;
 173   }
 174
 175   /* Hide the sidebar */
 176   .sidebar {
 177     display: none;
 178   }
 179
 180   /* Make the main content take up the full width of the screen */
 181   .main-content {
 182     width: 100%;
 183   }
 184 }
 185
 186 /* Medium screens (min-width: 577px) and (max-width: 768px) */
 187 @media (min-width: 577px) and (max-width: 768px) {
 188   /* Change the font size for all headings */
 189
 190 }
 191
 192 /* Large screens (min-width: 769px) */
 193 @media (min-width: 769px) {
 194   /* CSS rules for large screens go here */
 195 }
 196 /* Portrait screens (max-width: 576px) */
 197 @media (max-width: 576px) and (max-height: 812px) {
 198   /* CSS rules for portrait screens go here */
 199 }
 200
 201 /* Landscape screens (min-width: 577px) and (max-height: 812px) */
 202 @media (min-width: 577px) and (max-height: 812px) {
 203   /* CSS rules for landscape screens go here */
 204 }
 205
 206 .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
 207         width: inherit;
 208 }
 209
 210 .card-header .badge {
 211         top:-10px;
 212         left:20px;
 213 }
 214
 215 .card-header i.fa {
 216         line-height: 74px;
 217 }
 218
 219 #top-country ul {
 220         list-style: none;
 221 }
 222
 223 #top-country li {
 224   padding: 5px;
 225   display: inline-block;
 226   margin: 9px;
 227   border: solid 1px #ccc;
 228 }
 229
 230 #top-country li .drag {
 231   text-align: center;
 232 }
 233
 234 #top-country li .count {
 235   text-align: center;
 236   font-size: 2.2rem;
 237 }
 238
 239 #top-country li .count span {
 240   display:block;
 241   text-align: center;
 242   font-size: 1rem;
 243 }
 244
 245 /* Show version and 4-icons "footer" at bottom-left,
 246  * if screen height is sufficient.
 247  */
 248 @media only screen and (min-height: 650px) and (min-width: 768px) {
 249     footer {
 250         float: left;
 251         width: 160px;
 252         height: 60px;
 253         display: block !important;
 254     }
 255
 256     #sidebarlol {
 257         height: calc(100% - 60px - 50px);
 258     }
 259 }
 260
 261 /* Virtual link - hover effect (eg on Server Bans) */
 262 .virtuallink {
 263         text-decoration: none;
 264 }
 265 .virtuallink:hover {
 266         text-decoration: underline;
 267         cursor: pointer;
 268 }
 269
 270 /* TD that may wrap - eg for Reason / Topic */
 271 .tdwrap {
 272   white-space: normal !important;
 273 }