API tools faq
paste
Advertisement
herzegovina

old flcl spacehey layout.

herzegovina
Apr 1st, 2023
20
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.60 KB | None | 0 0
raw download clone embed print report
  1. <style>
  2. /* ADDONS */
  3. /* animated pfp - ttps://layouts.spacehey.com/layout?id=1796*/
  4. .profile-pic > img { display:none; }
  5. .profile-pic:after { background-image: url("https://external-media.spacehey.net/media/sOxRaAHfR7bOIS1FMU1J_qUac68cxyuV8YeU0GZCZa_Y=/https://i.ibb.co/NVJDVbZ/yeah-ok.gif"); display: inline-block; content:""}
  6. .blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; box-shadow: grey 1px 2px 9px; border: 1px solid black; border-radius: 3px;} /* blogs, bulletins */
  7. .general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; box-shadow: grey 1px 2px 9px; border: 1px solid black; border-radius: 3px;} /* profile */
  8.  
  9. /* profile intro */
  10. body::before {
  11. content: " ";
  12. height: 100vh;
  13. width: 100vw;
  14. display: block;
  15. position: fixed;
  16. top: 0;
  17. left: 0;
  18. z-index: 100;
  19. background-image: url('https://animesher.com/orig/0/74/746/7460/animesher.com_flcl-yeahangie-love-746088.gif');
  20. background-size: cover;
  21. background-repeat: no-repeat;
  22. background-position:center;
  23. animation: yourAnimation 2.9s ease 0s 1 normal forwards;
  24. pointer-events: none;
  25. }
  26.  
  27. @keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
  28.  
  29. /*
  30.  
  31. seco's spacehey theme
  32. don't steal this plz lawl.....
  33.  
  34. */
  35.  
  36. /* html */
  37. html {
  38. cursor: url(https://cur.cursors-4u.net/others/oth-6/oth589.cur), auto !important;
  39. }
  40.  
  41. body {
  42. font-family: "times new roman";
  43. background-image: url(https://konachan.com/image/c9487b1f6ce54137a676b635f9c478df/Konachan.com%20-%2020870%20flcl%20nandaba_naota%20samejima_mamimi.jpg);
  44. background-size: cover;
  45. background-color: black;
  46. }
  47.  
  48.  
  49. a {
  50. cursor: url(https://cur.cursors-4u.net/others/oth-6/oth589.cur), auto !important;
  51. transition: margin-left 0.3s ease;
  52. }
  53.  
  54. a:hover {
  55. margin-left: 5px;
  56. }
  57.  
  58. ::selection {
  59. color: white;
  60. text-shadow: 0px 0px 2px white;
  61. background: black;
  62. }
  63.  
  64. ::moz-selection {
  65. color: white;
  66. text-shadow: 0px 0px 2px white;
  67. background: black;
  68. }
  69.  
  70. mark {
  71. background: rgb(0, 0, 0, 0.9);
  72. color: white;
  73. font-weight: bold;
  74. padding: 2px;
  75. }
  76.  
  77. button {
  78. background: linear-gradient(180deg, black, #181818, #484848);
  79. color: white;
  80. font-family: helvetica;
  81. border: 1px black solid;
  82. border-radius: 5px;
  83. padding: 16px;
  84. padding-top: 2px;
  85. padding-bottom: 2px;
  86. box-shadow: 2px 2px 2px grey;
  87. transition: all 0.3s ease;
  88. }
  89.  
  90. button:hover {
  91. transform: scale(1.1);
  92. margin-left: 4px;
  93. }
  94.  
  95. /* logo + nav */
  96. nav .top {
  97. margin-bottom: 5px;
  98. background-image: url(https://i.pinimg.com/originals/d1/3e/9d/d13e9d5ea1fe204907febb9a8215b754.gif);
  99. background-color: none;
  100. background-size: cover;
  101. background-position: center center;
  102. border: 1px solid black;
  103. border-radius: 10px 0px 0px 0px;
  104. height: 135px;
  105. }
  106.  
  107. nav .links, footer .links {
  108. margin-bottom: 10px;
  109. }
  110.  
  111. nav .links {
  112. background-color: black;
  113. background-image: linear-gradient(180deg, black, #181818, #484848);
  114. border: 1px black solid;
  115. border-radius: 0px 0px 10px 0px;
  116. font-family: helvetica;
  117. font-size: 14px;
  118. text-transform: lowercase;
  119. }
  120.  
  121. nav .top .right {
  122. text-align: right;
  123. font-family: helvetica;
  124. letter-spacing: 1px;
  125. font-weight: bold;
  126. }
  127.  
  128. nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  129. color: white;
  130. padding: 2px;
  131. }
  132.  
  133. ul.links {
  134. text-align: center;
  135. }
  136.  
  137. /* main */
  138. .container {
  139. transform: skewY(-2deg) scale(0.93);
  140. margin-top: 20px;
  141. }
  142.  
  143. main {
  144. background: none;
  145. }
  146.  
  147. main .left {
  148. background: rgba(255,255,255,0.9);
  149. border: 1px black solid;
  150. box-shadow: black 1px 2px 5px;
  151. }
  152.  
  153. /* profile */
  154. .profile h1 {
  155. font-size: 1.5em;
  156. margin: 0 0 10px 0;
  157. text-align: center;
  158. font-size: 25px;
  159. background-image: linear-gradient(180deg, black, #181818, #484848);
  160. border: 1px solid black;
  161. color: white;
  162. text-shadow: -1px 0 grey, 0 1px grey, 1px 0 grey, 0 -1px grey;
  163. letter-spacing: 0.9px;
  164. font-family: monospace;
  165. font-weight: bold;
  166. transition: all 0.3s ease;
  167. }
  168.  
  169. .profile h1:hover {
  170. animation: shake 0.5s;
  171. animation-iteration-count: infinite;
  172. }
  173.  
  174. @keyframes shake {
  175. 0% { transform: translate(1px, 1px) rotate(0deg); }
  176. 10% { transform: translate(-1px, -2px) rotate(-1deg); }
  177. 20% { transform: translate(-3px, 0px) rotate(1deg); }
  178. 30% { transform: translate(3px, 2px) rotate(0deg); }
  179. 40% { transform: translate(1px, -1px) rotate(1deg); }
  180. 50% { transform: translate(-1px, 2px) rotate(-1deg); }
  181. 60% { transform: translate(-3px, 1px) rotate(0deg); }
  182. 70% { transform: translate(3px, 1px) rotate(-1deg); }
  183. 80% { transform: translate(-1px, -1px) rotate(1deg); }
  184. 90% { transform: translate(1px, 2px) rotate(0deg); }
  185. 100% { transform: translate(1px, -2px) rotate(-1deg); }
  186. }
  187.  
  188. .profile .contact, .profile .url-info, .profile .table-section, .home-actions {
  189. border: none;
  190. }
  191.  
  192. .profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  193. border-bottom: 1px dashed black;
  194. color: black;
  195. background: none;
  196. font-family: helvetica;
  197. text-transform: lowercase;
  198. }
  199.  
  200. .profile-pic:hover{
  201. animation: shake 0.5s;
  202. animation-iteration-count: infinite;
  203. }
  204.  
  205. .profile .blurbs, .profile .blog-preview, .profile .friends {
  206. background: rgba(255,255,255,0.83);
  207. border: 1px black solid;
  208. box-shadow: black 1px 2px 5px;
  209. padding: 5px;
  210. }
  211.  
  212. .blog-preview h4 {
  213. border-bottom: 1px black dashed;
  214. color: black;
  215. text-transform: lowercase;
  216. font-family: helvetica;
  217. padding: 3px;
  218. }
  219.  
  220. .profile .blurbs .section h4 {
  221. color: black;
  222. padding: 3px;
  223. font-family: helvetica;
  224. text-transform: lowercase;
  225. padding-left: 10px;
  226. }
  227.  
  228. .profile .blurbs .heading, .profile .friends .heading {
  229. background-image: linear-gradient(180deg, black, #181818, #484848);
  230. border: 1px solid black;
  231. color: white;
  232. text-transform: lowercase;
  233. padding: 7px;
  234. padding-bottom: 2px;
  235. }
  236.  
  237. .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner {
  238. padding: 7px;
  239. background: white;
  240. margin-top: 5px;
  241. border: 1px black dashed;
  242. }
  243.  
  244. .profile #comments.friends .inner {
  245. overflow: scroll;
  246. height: 30px;
  247. transition: height 0.5s ease;
  248. }
  249.  
  250. .profile #comments.friends .inner:hover {
  251. height: 288px;
  252. transition: height 0.5s ease;
  253. }
  254.  
  255. .profile .friends .person p {
  256. color: black;
  257. font-family: monospace;
  258. font-weight: bold;
  259. text-shadow: 0px 0px 1px black;
  260. letter-spacing: 1px;
  261. font-size: 13px;
  262. transition: letter-spacing 0.3s ease;
  263. }
  264.  
  265. .profile .friends .person p:hover {
  266. text-decoration: none;
  267. letter-spacing: -1px;
  268. }
  269.  
  270. .friends-grid {
  271. animation-name: floating;
  272. animation-duration: 3s;
  273. animation-iteration-count: infinite;
  274. animation-timing-function: ease-in-out;
  275. }
  276.  
  277. .profile .url-info {
  278. color: transparent;
  279. background-image: url("https://i.pinimg.com/originals/0e/1f/e6/0e1fe6081c339c1b1434e92ecde706d7.gif");
  280. background-size: cover;
  281. border: 1px black solid;
  282. box-shadow: 0px 0px 5px black;
  283. height: 130px;
  284. }
  285.  
  286. .profile .friends .person .img:not(.icon) {
  287. max-height: 75px;
  288. }
  289.  
  290. .person img {
  291. -webkit-mask-image: url(https://www.citypng.com/public/uploads/small/11659043911l0yqcritaxqq5q3fsr37jqbc8glsjhpupcd3ql7xqxzrh9oalum8bxag7hrczjli4eo6zz1v4pdjogujbjmjaajdbpsodjw1epmi.png);
  292. -webkit-mask-size: contain;
  293. -webkit-mask-repeat: no-repeat;
  294. opacity: 0.5;
  295. transition: all 0.3s ease;
  296. }
  297.  
  298. .person img:hover {
  299. opacity: 0.8;
  300. transform: scale(1.3);
  301. }
  302.  
  303.  
  304. /* contact thingy customization. lawl */
  305. img.icon {
  306. height: 0px;
  307. }
  308.  
  309. .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
  310. content: "⭑";
  311. }
  312.  
  313. .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
  314. content: "⭑";
  315. }
  316.  
  317. .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
  318. content: "⭑";
  319. }
  320.  
  321. .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
  322. content: "⭑";
  323. }
  324.  
  325. .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
  326. content: "⭑";
  327. }
  328.  
  329. .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
  330. content: "⭑";
  331. }
  332.  
  333. .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
  334. content: "⭑";
  335. }
  336.  
  337. .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
  338. content: "⭑";
  339. }
  340.  
  341. .profile .contact .f-row {
  342. margin: 4px;
  343. }
  344.  
  345. /* table */
  346. .details-table tr td:first-child p::after {
  347. color: black !important;
  348. letter-spacing: normal !important;
  349. }
  350.  
  351. .table-section:not(:last-child) .details-table tr td:first-child p {
  352. color: transparent !important;
  353. text-shadow: none !important;
  354. letter-spacing: -100px;
  355. }
  356.  
  357. .table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after {
  358. content: "drake camel";
  359. }
  360.  
  361. .table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after {
  362. content: "music";
  363. }
  364.  
  365. .table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after {
  366. content: "other shit";
  367. }
  368.  
  369. .table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after {
  370. content: "stuff i watch";
  371. }
  372.  
  373. .table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after {
  374. content: "books";
  375. }
  376.  
  377. .table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after {
  378. content: "fulcrum say hi fulcrum";
  379. }
  380.  
  381. .details-table td {
  382. background: transparent;
  383. }
  384.  
  385. .details-table td:first-child{
  386. font-weight: bold;
  387. font-size: 15px;
  388. text-align: right;
  389. font-family: monospace;
  390. background: transparent;
  391. }
  392.  
  393. .details-table img:hover {
  394. animation: shake 0.5s;
  395. animation-iteration-count: infinite;
  396. }
  397.  
  398. /* comments */
  399. .comments-table td:first-child, .comments-table td {
  400. background: transparent;
  401. }
  402.  
  403. #comments.friends {
  404. margin-top: 10px;
  405. }
  406.  
  407. .comments-table tr {
  408. animation-name: floating;
  409. animation-duration: 3s;
  410. animation-iteration-count: infinite;
  411. animation-timing-function: ease-in-out;
  412. }
  413.  
  414. @keyframes floating {
  415. 0% { transform: translate(0, 0px); }
  416. 50% { transform: translate(0, 15px); }
  417. 100% { transform: translate(0, -0px); }
  418. }
  419.  
  420. /* online */
  421. .online {
  422. color: black;
  423. text-transform: lowercase;
  424. }
  425.  
  426. .online img {
  427. content: url("https://xyz.crd.co/assets/images/gallery02/6d2c13e8.gif?v=364e4a1e");
  428. animation: none;
  429. }
  430. </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!