Advertisement
AkaruiKuraku

style.css

Aug 28th, 2022
68
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.38 KB | Gaming | 0 0
  1. body {
  2.   margin: 0;
  3. }
  4.  
  5. .game-canvas {
  6.   width: 100%;
  7.   height: 100vw;
  8.   max-width: 500px;
  9.   max-height:500px;
  10.   margin-left: auto;
  11.   margin-right: auto;
  12. }
  13.  
  14. .keys {
  15.   font-family: 'Lato', sans-serif;
  16.   text-align: center;
  17.   width: 100%;
  18.   padding: 10px;
  19.   box-sizing: border-box;
  20.   height: 200px;
  21.   margin: auto;
  22. }
  23.  
  24. .up {
  25.   position: relative;
  26.   top: -4px;
  27. }
  28.  
  29. .chevron::before {
  30.   border-style: solid;
  31.   border-width: 8px 8px 0 0;
  32.   content: '';
  33.   display: inline-block;
  34.   height: 20px;
  35.   width: 20px;
  36.   top: -10px;
  37.   position: relative;
  38.   transform: rotate(-45deg);
  39. }
  40.  
  41. .chevron.down::before {
  42.   transform: rotate(135deg);
  43.   top: -22px;
  44. }
  45.  
  46. .chevron.right::before {
  47.   transform: rotate(45deg);
  48.   top: -18px;
  49.   left: -5px;
  50. }
  51.  
  52. .chevron.left::before {
  53.   transform: rotate(225deg);
  54.   top: -18px;
  55.   left: 5px;
  56. }
  57.  
  58. .arr {
  59.   cursor: pointer;
  60.   width: 70px;
  61.   height: 70px;
  62.   text-align: center;
  63.   line-height: 100px;
  64.   background: gray;
  65.   color: white;
  66.   font-size: 50px;
  67.   border-right: 10px solid #ccc;
  68.   border-bottom: 10px solid #ccc;
  69.   border-left: 10px solid #ddd;
  70.   border-top: 10px solid #eee;
  71.   display: inline-block;
  72.   margin: 5px;
  73.   transition: all .05s linear;
  74.   user-select: none;
  75. }
  76.  
  77. .arr:active {
  78.   background: #555;
  79. }
  80.  
  81. #game-container {
  82.   display: flex;
  83.   flex-direction: column;
  84.   background-color: rgba(220, 220, 220, 0.6);
  85. }
  86.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement