ui/assets/css/main.css

   1 .navbar-toggler {
   2   border: 0px;
   3 }
   4
   5 .navbar-expand-lg .navbar-nav .nav-link {
   6   padding-right: .75rem !important;
   7   padding-left: .75rem !important;
   8 }
   9
  10 .pointer {
  11   cursor: pointer;
  12 }
  13
  14 .no-click {
  15   pointer-events:none;
  16   opacity: 0.65;
  17 }
  18
  19 .upvote:hover {
  20  color: var(--info);
  21 }
  22
  23 .upvote {
  24   margin-bottom: -5px;
  25 }
  26
  27 .downvote:hover {
  28   color: var(--danger);
  29 }
  30
  31 .downvote {
  32   margin-top: -10px;
  33 }
  34
  35 .custom-select {
  36   -moz-appearance: none;
  37 }
  38
  39 .md-div p {
  40   overflow: hidden;
  41   text-overflow: ellipsis;
  42 }
  43
  44 .md-div p:last-child {
  45   margin-bottom: 0px;
  46 }
  47
  48 .md-div img {
  49   max-height: 40vh;
  50   max-width: 100%;
  51   height: auto;
  52 }
  53
  54 .md-div h1,
  55 .md-div h2,
  56 .md-div h3,
  57 .md-div h4,
  58 .md-div h5 {
  59   font-size:1.171875rem;
  60 }
  61
  62 .md-div table {
  63   border-collapse: collapse;
  64   width: 100%;
  65   margin-bottom: 1rem;
  66   border: 1px solid var(--dark);
  67 }
  68
  69 .md-div table th,
  70 .md-div table td {
  71   padding: 0.3rem;
  72   vertical-align: top;
  73   border-top: 1px solid var(--dark);
  74   border: 1px solid var(--dark);
  75 }
  76
  77 .md-div table thead th {
  78   vertical-align: bottom;
  79   border-bottom: 2px solid var(--dark);
  80 }
  81
  82 .md-div table tbody + tbody {
  83   border-top: 2px solid var(--dark);
  84 }
  85
  86 .vote-bar {
  87   margin-top: -6.5px;
  88 }
  89
  90 .post-title {
  91   line-height: 1.0;
  92 }
  93
  94 .post-title a:visited {
  95   color: var(--gray) !important;
  96 }
  97
  98 .icon {
  99   display: inline-flex;
 100   width: 1em;
 101   height: 1em;
 102   stroke-width: 0;
 103   stroke: currentColor;
 104   fill: currentColor;
 105   vertical-align: middle;
 106   align-self: center;
 107   -webkit-touch-callout: none;
 108   -webkit-user-select: none;
 109   -khtml-user-select: none;
 110   -moz-user-select: none;
 111   -ms-user-select: none;
 112   user-select: none;
 113 }
 114
 115 .icon-inline {
 116   margin-bottom: 2px;
 117 }
 118
 119 .spin {
 120   animation: spins 2s linear infinite;
 121 }
 122
 123 @keyframes spins {
 124   0% { transform: rotate(0deg); }
 125   100% {  transform: rotate(359deg); }
 126 }
 127
 128 .dropdown-menu {
 129   z-index: 2000;
 130 }
 131
 132 blockquote {
 133   border-left: 2px solid var(--secondary);
 134   margin: 0.5em 5px;
 135   padding: 0.1em 5px;
 136 }
 137
 138 .mouse-icon {
 139   margin-top: -4px;
 140 }
 141
 142 .new-comments {
 143   max-height: 50vh;
 144   overflow-x: hidden;
 145   overflow-y: auto;
 146 }
 147
 148 .thumbnail {
 149   object-fit: cover;
 150   min-height: 60px;
 151   max-height: 80px;
 152   width: 100%;
 153 }
 154
 155 .thumbnail svg {
 156   height: 1.25rem;
 157   width: 1.25rem;
 158 }
 159
 160 .no-s-hows {
 161   position: absolute !important;
 162   top: -9999px !important;
 163   left: -9999px !important;
 164 }
 165
 166 hr {
 167   border-top: 1px solid var(--light);
 168 }
 169
 170 .emoji {
 171   max-height: 1.2em !important;
 172 }
 173
 174 .text-wrap-truncate {
 175   overflow: hidden;
 176   text-overflow: ellipsis
 177 }
 178
 179 #app {
 180   display: flex;
 181   flex-direction: column;
 182   min-height: 100vh;
 183 }
 184
 185 .fl-1 {
 186   flex: 1;
 187 }
 188
 189 .img-blur {
 190   filter: blur(10px);
 191   -webkit-filter: blur(10px);
 192   -moz-filter: blur(10px);
 193   -o-filter: blur(10px);
 194   -ms-filter: blur(10px);
 195 }
 196
 197 .img-expanded {
 198   max-height: 90vh;
 199 }
 200
 201 .btn-animate:active {
 202   transform: scale(1.2);
 203   -webkit-transform: scale(1.2);
 204   -ms-transform: scale(1.2);
 205 }
 206
 207 .selectr-selected, .selectr-options-container {
 208   background-color: var(--secondary);
 209   color: var(--white);
 210   border: unset;
 211 }
 212
 213 .mini-overlay {
 214   position: absolute;
 215   top: 0;
 216   right: 0;
 217   padding: 2px;
 218   height: 1.5em;
 219   width: 1.5em;
 220   background: rgba(0,0,0,.4);
 221   border-bottom-left-radius: 0.25rem !important;
 222   border-top-right-radius: 0.25rem !important;
 223 }
 224
 225 .link-overlay:hover {
 226   transition: .1s;
 227   opacity: 1;
 228 }
 229
 230 .link-overlay {
 231   transition: opacity .1s ease-in-out;
 232   position: absolute;
 233   opacity: 0;
 234   left: 0;
 235   height: 100%;
 236   width: 100%;
 237   padding: 10px;
 238   background: rgba(0,0,0,.6);
 239 }
 240
 241 .placeholder {
 242   height: 50px;
 243   width: 50px;
 244 }
 245
 246 .unselectable {
 247   -webkit-touch-callout: none;
 248   -webkit-user-select: none;
 249   -khtml-user-select: none;
 250   -moz-user-select: none;
 251   -ms-user-select: none;
 252   user-select: none;
 253 }
 254
 255 .list-inline-item-action {
 256   display: inline-block;
 257 }
 258
 259 .list-inline-item-action:not(:last-child) {
 260   margin-right: 1.2rem;
 261 }
 262
 263 pre {
 264   white-space: pre-wrap;
 265   word-break: keep-all;
 266 }
 267
 268 .form-control.search-input {
 269   float: right !important;
 270   transition: width 0.2s ease-out 0s !important;
 271 }
 272
 273 .show-input {
 274   width: 13em !important;
 275
 276 }
 277 .hide-input {
 278   background: transparent !important;
 279   width: 0px !important;
 280   padding: 0 !important;
 281  }
 282
 283 br.big {
 284   display: block;
 285   content: "";
 286   margin-top: 1rem;
 287 }
 288
 289 .banner {
 290   object-fit: cover;
 291   width: 100%;
 292   max-height: 240px;
 293 }
 294
 295 .avatar-overlay {
 296   width: 20%;
 297   height: 20%;
 298   max-width: 120px;
 299   max-height: 120px;
 300 }
 301
 302 .avatar-pushup {
 303   margin-top: -60px;
 304 }