Advertisement
blackpandaxo

Fiver13 Css

Aug 16th, 2022
771
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 2.17 KB | None | 0 0
  1. @import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
  2.  
  3. * {
  4.     box-sizing: border-box;
  5. }
  6.  
  7. html, body {
  8.     height: 100%;
  9.     overflow: hidden;
  10. }
  11.  
  12. body {
  13.     background: {background_color};
  14.     font-family: 'VT323', monospace;
  15.     font-weight: 400;
  16.     font-size: {font_size};
  17.     line-height: 1em;
  18.     color: {text_color};
  19. }
  20.  
  21. #log>div {
  22.     animation: fadeInRight .3s ease forwards, fadeOut 0.5s ease {message_hide_delay} forwards;
  23.     -webkit-animation: fadeInRight .3s ease forwards, fadeOut 0.5s ease {message_hide_delay} forwards;
  24. }
  25.  
  26. .colon {
  27.     display: none;
  28. }
  29.  
  30. #log {
  31.    
  32.     position: absolute;
  33.     bottom: 0;
  34.     left: 0;
  35.     padding: 0 10px 10px;
  36.     width: 100%;
  37. }
  38.  
  39. #log>div {
  40.     margin: 2em;
  41. }
  42.  
  43. #log>div.deleted {
  44.     visibility: hidden;
  45. }
  46.  
  47. #log .emote {
  48.     background-repeat: no-repeat;
  49.     background-position: center;
  50.     background-size: contain;
  51.     padding: 0.4em 0.2em;
  52.     position: relative;
  53. }
  54.  
  55. #log .emote img {
  56.     display: inline-block;
  57.     height: 1em;
  58.     opacity: 0;
  59. }
  60.  
  61. #log .message,#log .meta {
  62.     vertical-align: top;
  63.     display: table-cell;
  64.     padding-bottom: 0.1em;
  65. }
  66.  
  67.  
  68. #log .message {
  69.     position: relative;
  70.     background-color: red;
  71.     left: 20px;
  72.     top: 20px;
  73.     padding: 0.5em 1em 0.5em 1em;
  74.     border-radius: 10px 10px 25px 25px;
  75.     word-wrap: break-word;
  76.     width: 80%;
  77.     min-width: 250px;
  78.     max-width: 400px;
  79.     color: rgb(0, 255, 255);
  80. }
  81.  
  82. #log .meta {
  83.     position: inline;
  84.     left: 5px;
  85.     top: 5px;
  86.     display: inline;
  87.     background-color: black;
  88.     border-radius: 20px 20px 40px 40px;
  89.     padding:  0.2em 0.5em 0.4em 0.8em;
  90.     margin-left: 2px;
  91.     margin-top: 50px;
  92.     white-space: nowrap;
  93.     text-overflow: ellipsis;
  94.     overflow: hidden;
  95.     max-width: 200px;
  96. }
  97.  
  98. .message:before{
  99.     content: "| ";
  100.     white-space: pre;
  101.     left: 7px;
  102.     width: 20px;
  103.     border-bottom-right-radius: 16px 14px;
  104. }
  105.  
  106. .badge {
  107.     display: inline;
  108.     margin-right: 0.2em;
  109.     position: relative;
  110.     height: 1em;
  111.     vertical-align: middle;
  112.     top: -0.1em;
  113. }
  114.  
  115. .name {
  116.     margin-left: 0.1em;
  117.     text-transform: uppercase;
  118. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement