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