Primitiv0

Heimdall Theme

Sep 20th, 2021
817
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import url("https://fonts.googleapis.com/css2?family=Raleway:wght@700;800&display=swap");
  2.  
  3. #app {
  4.   background-position: right;
  5. }
  6. #app #sortable,
  7. #app main {
  8.   padding: 20px;
  9. }
  10. #config-buttons {
  11.   bottom: 50%;
  12.   transform: translateY(50%);
  13.   border-top-left-radius: 10px;
  14.   border-bottom-left-radius: 10px;
  15.   box-shadow: rgba(255, 255, 255, 0.1) -1px 1px 1px 0, rgba(255, 255, 255, 0.1) 0 -1px 1px 0,
  16.     rgba(0, 0, 0, 0.1) -1px 0 20px 5px;
  17.   background-color: rgba(40, 40, 40, 0.25);
  18.   backdrop-filter: blur(10px);
  19.   -webkit-backdrop-filter: blur(10px);
  20. }
  21. #config-buttons a {
  22.   background: none;
  23. }
  24. #config-buttons a svg {
  25.   transition: all 0.1s ease-in-out;
  26.   color: rgba(255, 255, 255, 0.5);
  27. }
  28. #config-buttons a:hover svg {
  29.   transform: scale(1.1);
  30.   color: rgba(255, 255, 255, 0.95);
  31. }
  32.  
  33. .black {
  34.   color: white !important;
  35. }
  36.  
  37. .item {
  38.   box-shadow: rgba(0, 0, 0, 0.05) -1px -1px 5px 0, rgba(0, 0, 0, 0.15) 0px 20px 25px -5px,
  39.     rgba(0, 0, 0, 0.04) 0px 10px 10px -5px !important;
  40.   border-radius: 12px;
  41.   background-image: none;
  42.   border: none;
  43.   outline: none;
  44.   height: 100px;
  45.   width: 300px;
  46.   margin: 1.25rem;
  47.   padding: 1rem 55px 1rem 1rem;
  48.   transition: all 0.25s ease-in-out;
  49.   transition-property: transform, box-shadow, background-color;
  50.   background-color: rgba(255, 255, 255, 0.4) !important;
  51.   backdrop-filter: blur(10px);
  52.   -webkit-backdrop-filter: blur(10px);
  53. }
  54. .item:after {
  55.   height: 100px;
  56.   opacity: 0.2;
  57. }
  58. .item:hover {
  59.   transform: scale(1.1);
  60.   background-color: rgba(255, 255, 255, 0.2) !important;
  61.   box-shadow: rgba(0, 0, 0, 0.1) 0px 60px 40px -7px !important;
  62. }
  63. .item .svg-inline--fa {
  64.   height: 100px;
  65.   vertical-align: middle;
  66.   opacity: 0.2;
  67. }
  68.  
  69. @media only screen and (max-width: 750px) {
  70.   .item {
  71.     padding-top: 2rem;
  72.     padding-bottom: 2rem;
  73.   }
  74.   #config-buttons {
  75.     display: none;
  76.   }
  77. }
  78.  
  79. .details * {
  80.   color: white !important;
  81. }
  82. .details {
  83.   padding: 0 0.5rem;
  84. }
  85.  
  86. .app-icon {
  87.   filter: drop-shadow(1px 1px 2px rgba(10, 0, 20, 0.1));
  88. }
  89.  
  90. .livestats-container {
  91.   margin-top: 0.5rem;
  92. }
  93. .livestats-container .livestats .title {
  94.   margin-bottom: 3px;
  95. }
  96. .livestats-container .livestats li {
  97.   padding-right: 1rem;
  98. }
  99.  
  100. .livestats-container strong {
  101.   font-weight: 500 !important;
  102.   padding: 0 2px;
  103. }
  104.  
  105. .details > .title {
  106.   font-weight: 800;
  107.   font-size: 1.3rem !important;
  108.   letter-spacing: 1px;
  109.   font-family: "Raleway", sans-serif;
  110.   text-shadow: rgba(10, 0, 60, 0.25) 1px 0 5px;
  111.   text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 2px rgba(10, 0, 60, 0.25);
  112.   transition: all 0.25s ease-in-out;
  113. }
  114. .item:hover .details > .title {
  115.   text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.1), 1px 1px 5px rgba(10, 0, 60, 0.2);
  116. }
  117.  
RAW Paste Data