Advertisement
althindor

Pro for Residual Blight

Mar 3rd, 2022
1,423
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 4.32 KB | None | 0 0
  1. /* Profile by AlthIndor */
  2.  
  3. html, body {
  4.   background: #000000;
  5.   height: unset;
  6.   min-height: 100vh;
  7. }
  8.  
  9. html {
  10.   --about-size: unset;
  11.   --top-offset: 100px;
  12. }
  13.  
  14. @media (min-height: 880px) {
  15.   html {
  16.     --about-size: 275px;
  17.     --top-offset: calc(50% - 435px);
  18.   }
  19.   #columns {height: 875px;}
  20.   #id_about {
  21.     padding-right: 10px;
  22.     overflow: hidden scroll;
  23.   }
  24. }
  25.  
  26. /* Fonts */
  27.  
  28. @font-face {
  29.   font-family: 'Lato';
  30.   font-style: normal;
  31.   font-weight: 700;
  32.   src: local('Lato Bold'), local('Lato-Bold'), url('https://fonts.gstatic.com/s/lato/v22/S6u9w4BMUTPHh6UVSwaPGR_p.woff2') format('woff2');
  33.   unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
  34. }
  35.  
  36. @font-face {
  37.   font-family: 'Lato';
  38.   font-style: normal;
  39.   font-weight: 700;
  40.   src: local('Lato Bold'), local('Lato-Bold'), url('https://fonts.gstatic.com/s/lato/v22/S6u9w4BMUTPHh6UVSwiPGQ.woff2') format('woff2');
  41.   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  42. }
  43.  
  44. @font-face {
  45.   font-family: 'Oldenburg';
  46.   font-style: normal;
  47.   font-weight: 400;
  48.   src: local('Oldenburg'), url('https://fonts.gstatic.com/s/oldenburg/v18/fC1jPY5JYWzbywv7c4VKVkSp.woff2') format('woff2');
  49.   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  50. }
  51.  
  52. /* Header */
  53.  
  54. #viewer #gaia_header, #gaia_header #header_left, #gaia_header #header_right {background: none;}
  55. #viewer #gaia_header {position: absolute !important;}
  56.  
  57. #gaia_header li a:not([href*='edit']) {margin: 0 5px;}
  58. #gaia_header li.spacer {display: none !important;}
  59.  
  60. #gaia_header #header_left, #gaia_header #header_right {
  61.   width: auto !important;
  62.   font: 700 0/31px 'Oldenburg', sans-serif !important;
  63.   padding: 0 5px !important;
  64.   box-sizing: border-box;
  65. }
  66.  
  67. #gaia_header #header_right {
  68.   float: right;
  69.   display: grid !important;
  70.   grid-auto-flow: column;
  71. }
  72. #gaia_header #header_right li:last-of-type {grid-column: 2;}
  73.  
  74. #gaia_header #header_left img {
  75.   background: url('https://i.imgur.com/5FTB40o.png') 0 2px no-repeat;
  76.   width: 0;
  77.   padding: 0 37px 0 0;
  78. }
  79.  
  80. #gaia_header a:not([href*='edit']) {
  81.   color: #FFFFFF !important;
  82.   font-size: 10px !important;
  83.   text-decoration: none !important;
  84.   text-transform: uppercase;
  85. }
  86.  
  87. /* Columns */
  88.  
  89. #columns {
  90.   float: none;
  91.   display: grid;
  92.   gap: 10px;
  93.   width: 500px;
  94.   top: var(--top-offset);
  95.   left: calc(50% - 250px);
  96.   font-size: 0;
  97. }
  98. #columns::before {content: url('https://i.ibb.co/wB8L4vJ/cover.png');}
  99. #columns .column {display: contents;}
  100.  
  101. #id_about {grid-row: 3;}
  102. .media_panel {grid-row: 2;}
  103.  
  104. /* Scrollbars */
  105.  
  106. #columns ::-webkit-scrollbar {
  107.   background: #404040;
  108.   width: 8px;
  109. }
  110. #columns ::-webkit-scrollbar-thumb {background: #FFFFFF;}
  111.  
  112. .panel {
  113.   scrollbar-color: #FFFFFF #404040;
  114.   scrollbar-width: thin;
  115. }
  116.  
  117. /* Panels */
  118.  
  119. .panel {
  120.   background: none;
  121.   color: #FFFFFF;
  122.   font: 700 10px/1.7 'Lato', sans-serif;
  123.   text-align: justify;
  124.   padding: 0;
  125.   margin: 0;
  126.   box-sizing: border-box;
  127. }
  128.  
  129. .panel a {
  130.   color: #FF0000;
  131.   text-decoration: dotted underline;
  132. }
  133. .panel a:hover {color: inherit;}
  134.  
  135. #id_about {
  136.   border: 30px solid transparent;
  137.   border-image: url('https://i.ibb.co/2NVGZbR/about-border.png') 35 / 35px repeat;
  138. }
  139. #id_about h2 {display: none;}
  140. #id_about img {max-width: 100%;}
  141.  
  142. /* Media */
  143.  
  144. .media_panel {
  145.   background: url('https://i.imgur.com/gqTTTvw.png') -24px -8px no-repeat,
  146.     url('https://i.imgur.com/gqTTTvw.png') right -17px bottom -3px no-repeat;
  147.   height: 39px !important;
  148.   border: 5px solid transparent;
  149.   border-image: url('https://i.ibb.co/QHBqyN6/media-border.png') 5 / 5px repeat;
  150.   overflow: hidden;
  151. }
  152.  
  153. .media_panel h2 {
  154.   background: none;
  155.   text-indent: 70px;
  156.   line-height: 26px;
  157.   text-transform: capitalize;
  158. }
  159.  
  160. .media_panel iframe {
  161.   width: calc(100% + 34px);
  162.   height: 100px;
  163.   position: absolute;
  164.   bottom: -3px;
  165.   left: -18px;
  166.   opacity: .001;
  167. }
  168.  
  169. /* Misc */
  170.  
  171. #pictures_container, #texts_container {
  172.   top: var(--top-offset);
  173.   left: calc(50% - 250px);
  174.   width: 0;
  175.   height: 0;
  176.   position: absolute;
  177. }
  178.  
  179. .bbcode-swapping-image {filter: invert(1);}
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement