Advertisement
DriveCoreGames

Banana Clicker Stylesheet

Jul 27th, 2023
64
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.93 KB | None | 0 0
  1. /* Define the overall game container style */
  2. #game {
  3. width: 800px; /* Adjust the width as needed */
  4. margin: 0 auto;
  5. background-color: #f2f2f2;
  6. font-family: 'Helvetica Neue', sans-serif;
  7. color: #333;
  8. }
  9.  
  10. /* Define the style for buttons */
  11. .bigButton {
  12. background-color: #f5d76e;
  13. color: #333;
  14. border: 2px solid #e8c300;
  15. padding: 10px 20px;
  16. font-size: 18px;
  17. cursor: pointer;
  18. margin: 10px;
  19. border-radius: 5px;
  20. box-shadow: 0 5px #d1a200;
  21. }
  22.  
  23. .bigButton:hover {
  24. background-color: #f7e289;
  25. }
  26.  
  27. /* Define the style for the game header */
  28. #header {
  29. background-color: #333;
  30. color: #fff;
  31. text-align: center;
  32. padding: 10px;
  33. font-size: 24px;
  34. }
  35.  
  36. /* Define the style for resources (e.g., bananas) */
  37. .resource {
  38. display: inline-block;
  39. padding: 10px;
  40. background-color: #f5d76e;
  41. border: 2px solid #e8c300;
  42. color: #333;
  43. font-size: 18px;
  44. margin: 10px;
  45. border-radius: 5px;
  46. }
  47.  
  48. /* Define the style for tooltips */
  49. .tooltip {
  50. position: relative;
  51. }
  52.  
  53. .tooltip .tooltiptext {
  54. visibility: hidden;
  55. width: 200px;
  56. background-color: #333;
  57. color: #fff;
  58. text-align: center;
  59. border-radius: 6px;
  60. padding: 5px;
  61. position: absolute;
  62. z-index: 1;
  63. bottom: 125%;
  64. left: 50%;
  65. transform: translateX(-50%);
  66. opacity: 0;
  67. transition: opacity 0.3s;
  68. }
  69.  
  70. .tooltip:hover .tooltiptext {
  71. visibility: visible;
  72. opacity: 1;
  73. }
  74.  
  75. /* Define the style for upgrades */
  76. .upgrade {
  77. display: inline-block;
  78. background-color: #f5d76e;
  79. color: #333;
  80. border: 2px solid #e8c300;
  81. padding: 10px;
  82. font-size: 14px;
  83. margin: 10px;
  84. border-radius: 5px;
  85. cursor: pointer;
  86. }
  87.  
  88. .upgrade:hover {
  89. background-color: #f7e289;
  90. }
  91.  
  92. /* Define the style for the game footer */
  93. #footer {
  94. background-color: #333;
  95. color: #fff;
  96. text-align: center;
  97. padding: 10px;
  98. font-size: 12px;
  99. }
  100.  
  101. /* Hide the default IGM logo (optional) */
  102. .logo {
  103. display: none;
  104. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement