Advertisement
ClickerGuy

My CSS Layout

Jul 15th, 2020 (edited)
8,741
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.50 KB | None | 0 0
  1. /*Stylesheet created by morkysherk, owned by Eric*/
  2.  
  3. #game
  4. {
  5. background-image:http://www.colorhexa.com/afafaf.png;
  6. font-size:12px;
  7. color:rgba(0,0,0,0.9);
  8. text-shadow:none;
  9. }
  10. .box
  11. {
  12. text-align:center;
  13. padding:0px;
  14. box-shadow:none;
  15. }
  16.  
  17. .thing,.box-header,.box-footer,.box-bit
  18. {
  19. background:#7c7c7c;
  20. border:1px solid rgba(0,0,0,0.9);
  21. margin:1px;
  22. }
  23. .thing.cantAfford
  24. {
  25. background:#cf5055;
  26. }
  27. .thing:hover
  28. {
  29. background:#cccccc;
  30. }
  31. .thing.cantAfford:hover
  32. {
  33. background:#cc6a6d;
  34. }
  35.  
  36. .box-header
  37. {
  38. margin-top:2px;
  39. margin-bottom:4px;
  40. display:inline-block;
  41. font-family:Verdana;
  42. font-weight:bold;
  43. border-radius:10px;
  44. border:3px solid black;
  45. }
  46. .box-footer
  47. {
  48. margin-top:4px;
  49. }
  50.  
  51. .title
  52. {
  53. text-decoration:underline;
  54. }
  55.  
  56. #box-title
  57. {
  58. display:inline-block;
  59. margin-top:0.60;
  60. margin-left:0.75%;
  61. float:left;
  62. }
  63. #box-version
  64. {
  65. display:inline-block;
  66. margin-top:0.75%;
  67. margin-left:0.75%;
  68. margin-right:0.75%;
  69. float:left;
  70. }
  71.  
  72. #box-main
  73. {
  74. left:0px;
  75. top:0px;
  76. bottom:0px;
  77. overflow:hidden;
  78. width:60%;
  79. position:absolute;
  80. border:5px solid black;
  81. border-right:0px;
  82. }
  83. #box-buttons
  84. {
  85. top: 15px;
  86. bottom: 0px;
  87. width: 60%;
  88. position: absolute;
  89. z-index: 200;
  90. height: 48.4%;
  91. top: 27.4%;
  92. }
  93. #box-store
  94. {
  95. right:0px;
  96. top:0px;
  97. bottom:0px;
  98. width:40%;
  99. position:absolute;
  100. }
  101. #box-buildings,#box-upgrades, upgradesVV, #box-achievs, #box-prestige
  102. {
  103. top:0px;
  104. bottom:0px;
  105. width:50%;
  106. right:0%;
  107. overflow-x:hidden;
  108. overflow-y:scroll;
  109. padding-bottom:48px;/* this is to accommodate the info and settings buttons */
  110. position:absolute;
  111. border:solid 5px black;
  112. }
  113. #box-res
  114. {
  115. border-top:5px solid black;
  116. border-left:2.5px solid black;
  117. border-bottom:3px solid black;
  118. width:150%;
  119. right:100%;
  120. bottom:72%;
  121. height:20%;
  122. z-index:100;
  123. position:absolute;
  124. overflow-y:scroll;
  125. background:linear-gradient(to right,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.15) 100%);
  126. }
  127. #box-buildings
  128. {
  129. right:50%;
  130. border-right:solid 0px black;
  131. }
  132. #box-achievs
  133. {
  134. right:100%;
  135. width:150%;
  136. top:75%;
  137. height:25%;
  138. border-right:solid 0px black;
  139. }
  140. #box-stats
  141. {
  142. border-top:2.5px solid black;
  143. border-bottom:5px solid black;
  144. width:0%;
  145. bottom:0%;
  146. right:0%;
  147. z-index:100;
  148. position:absolute;
  149. overflow-y:scroll;
  150. height:8.5%;
  151. background:linear-gradient(to right,rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.6) 50%,rgba(0,0,0,0.15) 100%);
  152. }
  153.  
  154. #box-buildings>.box-header
  155. {
  156. padding-bottom:16px;
  157. }
  158.  
  159. #bulkDisplay
  160. {
  161. margin-top:-2.5px;
  162. border:solid 1px black;
  163. background:#7c7c7c;
  164. width:70px;
  165. margin-left:auto;
  166. margin-right:auto;
  167. position:relative;
  168. z-index:200;
  169. }
  170.  
  171.  
  172. .thing
  173. {
  174. display:inline-block;
  175. padding:0px;
  176. cursor:pointer;
  177. font-family:Verdana;
  178. }
  179. .thing:active
  180. {
  181. opacity:0.5;
  182. }
  183. .upgrade.owned,.achiev.owned
  184. {
  185. box-shadow:0px 0px 0px 2px rgba(0,0,0,0.5) inset;
  186. background:#55cf50;
  187. ]
  188. }
  189. .upgrade.owned:hover,.achiev.owned:hover
  190. {
  191. background:#7dcc7a;
  192. }
  193. .thing.cantAfford
  194. {
  195. opacity:0.65;
  196. }
  197. .upgrade.cantAfford
  198. {
  199. border:none;
  200. }
  201. .thing-costs{font-weight:bold;text-shadow:1px 1px 0px rgba(0,0,0,0.5);}
  202. .cost.hasEnough{color:#0f0;}
  203. .cost.notEnough{color:#f00;}
  204.  
  205.  
  206. .button>.thing-text
  207. {
  208. text-decoration:underline;
  209. }
  210.  
  211. .building
  212. {
  213. display:block;
  214. margin-right:0px;
  215. font-size:14px;
  216. }
  217.  
  218. .fullWidth
  219. {
  220. display:block;
  221. margin-left:0px;
  222. margin-right:0px;
  223. z-index:10;
  224. }
  225.  
  226. .fullWidth,.fullWidth:hover
  227. {
  228. background:rgba(0,0,0,0.75);
  229. box-shadow:none;
  230. color:#fff;
  231. }
  232. .fullWidth:before,.fullWidth:after
  233. {
  234. content:'';
  235. height:1px;
  236. background:rgba(255,255,255,0.75);
  237. position:absolute;
  238. left:0px;
  239. right:0px;
  240. z-index:-1;
  241. }
  242. .fullWidth .thing-icon
  243. {
  244. margin-top:-10px;
  245. margin-bottom:-10px;
  246. }
  247. .fullWidth .thing-text
  248. {
  249. margin-top:-4px;
  250. margin-bottom:-4px;
  251. }
  252.  
  253. .listing
  254. {
  255. font-weight:normal;
  256. }
  257.  
  258. .res
  259. {
  260. vertical-align:middle;
  261. }
  262.  
  263. #game.filtersOn .thing-icon{filter:drop-shadow(3px 3px 1px rgba(0,0,0,0.5));}
  264.  
  265. .tag-achievements
  266. {
  267. margin-bottom:4px;
  268. display:inline-block;
  269. font-family:Verdana;
  270. font-weight:bold;
  271. border-radius:10px;
  272. border:3px solid black;
  273. }
  274. .tag-upgradesII
  275. {
  276. margin-bottom:4px;
  277. display:inline-block;
  278. font-family:Verdana;
  279. font-weight:bold;
  280. border-radius:10px;
  281. border:3px solid black;
  282. }
  283. .tag-upgradesV
  284. {
  285. margin-bottom:4px;
  286. display:inline-block;
  287. font-family:Verdana;
  288. font-weight:bold;
  289. border-radius:10px;
  290. border:3px solid black;
  291. }
  292. .tag-prestigeII
  293. {
  294. margin-bottom:4px;
  295. display:inline-block;
  296. font-family:Verdana;
  297. font-weight:bold;
  298. border-radius:10px;
  299. border:3px solid black;
  300. }
  301. #box-things-achievements
  302. {
  303. display:inline-block;
  304. }
  305. #box-things-upgradesII
  306. {
  307. display:inline-block;
  308. }
  309. #box-things-upgradesV
  310. {
  311. display:inline-block;
  312. }
  313. #box-things-prestigeII
  314. {
  315. display:inline-block;
  316. }
  317.  
  318. #box-log {
  319. margin-bottom: 4px;
  320. display: inline-block;
  321. top: 27.4%;
  322. height: 48.4%;
  323. width: 40%;
  324. left: 60.5%;
  325. position: absolute;
  326. border-radius: 0px;
  327. border: 3px solid black;
  328. background-color:#000000;
  329. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement