API tools faq
paste
alicescreed

001 — OMG

alicescreed
Dec 2nd, 2023 (edited)
2,451
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.58 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2.  
  3. <!-- 001 OMG muse page by anahilation
  4. thanks for using my page! i hope you enjoy.
  5. please don't remove credit or claim as your own. -->
  6.  
  7. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />
  8.  
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11.  
  12. <title>{title}</title>
  13.  
  14. <head>
  15.  
  16. <style type="text/css">
  17.  
  18. @import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;800&display=swap');
  19.  
  20. body {
  21. background-color: #f5eded;
  22. letter-spacing: 0px;
  23. font-family: 'Work Sans', sans-serif;
  24. color: #3d3434;
  25. }
  26.  
  27. a {
  28. text-decoration: none;
  29. color: #3d3434;
  30. transition-duration: 0.6s;
  31. -moz-transition-duration: 0.6s;
  32. -webkit-transition-duration: 0.6s;
  33. -o-transition-duration: 0.6s;
  34. }
  35.  
  36. a:hover {
  37. color: #ff8484;
  38. transition-duration: 0.6s;
  39. -moz-transition-duration: 0.6s;
  40. -webkit-transition-duration: 0.6s;
  41. -o-transition-duration: 0.6s;
  42. }
  43.  
  44. #muse {
  45. width: 250px;
  46. height: 420px;
  47. display: inline-block;
  48. padding: 10px;
  49. transition-duration: 0.6s;
  50. -moz-transition-duration: 0.6s;
  51. -webkit-transition-duration: 0.6s;
  52. -o-transition-duration: 0.6s;
  53. color: #3d3434;
  54. border: 1px solid #d9cdcd;
  55. border-radius: 10px;
  56. margin-right: 20px;
  57. margin-top: 40px;
  58. background-color: #ffffff;
  59. }
  60.  
  61. #muse #icon {
  62. display:block;
  63. width:250px;
  64. height:300px;
  65. margin:0 auto;
  66. }
  67.  
  68. #muse:hover {
  69. transition-duration: 0.6s;
  70. -moz-transition-duration: 0.6s;
  71. -webkit-transition-duration: 0.6s;
  72. -o-transition-duration: 0.6s;
  73. opacity: .6;
  74. }
  75.  
  76. #contain {
  77. margin: 0 auto;
  78. width: 900px;
  79. padding: 50px;
  80. position: float;
  81. }
  82.  
  83. #name {
  84. text-align: center;
  85. font-size: 14pt;
  86. border-bottom: 1px solid #d9cdcd;
  87. padding: 5px;
  88. max-height: 20px;
  89. margin-top: -3px;
  90. transition-duration: 0.6s;
  91. -moz-transition-duration: 0.6s;
  92. -webkit-transition-duration: 0.6s;
  93. -o-transition-duration: 0.6s;
  94. }
  95.  
  96.  
  97. ::-webkit-scrollbar-thumb:vertical {
  98. background-color: transparent;
  99. height:auto;
  100. }
  101.  
  102. ::-webkit-scrollbar-thumb:horizontal {
  103. background-color: transparent;
  104. height:2px;
  105. }
  106.  
  107. ::-webkit-scrollbar {
  108. height:3px;
  109. width:3px;
  110. background-color: transparent;
  111. }
  112.  
  113. #pagetitle {
  114. font-size: 14pt;
  115. }
  116.  
  117. #pagetitle::first-letter, #name::first-letter {
  118. font-weight: 800;
  119. color: #ff8484;
  120. font-size: 110%;
  121. }
  122.  
  123. #desc {
  124. font-size: 8pt;
  125. }
  126.  
  127. #bio {
  128. font-size: 9pt;
  129. text-align: justify;
  130. height: 30px;
  131. overflow: auto;
  132. margin-top: 10px;
  133. }
  134.  
  135. #topbar {
  136. margin-top: -10px;
  137. margin-left: -10px;
  138. width: 100%;
  139. height: 60px;
  140. background-color: #ffffff;
  141. padding: 10px;
  142. border-bottom: 1px solid #d9cdcd;
  143. text-align: left;
  144. position: fixed;
  145. }
  146.  
  147. #links {
  148. margin-top: -2px;
  149. }
  150.  
  151. #links a {
  152. background-color: #f5eded;
  153. padding: 3px;
  154. font-size: 7pt;
  155. text-transform: uppercase;
  156. margin-right: 3px;
  157. }
  158.  
  159. #links a:hover {
  160. background-color: transparent;
  161. }
  162.  
  163. #profile {
  164.  
  165. }
  166.  
  167. #profile img {
  168. width: 80px;
  169. height: 80px;
  170. margin-top: -10px;
  171. margin-left: -10px;
  172. margin-right: 10px;
  173. border-right: 1px solid #d9cdcd;
  174. }
  175.  
  176. #credit {
  177. right:10px;
  178. bottom:7px;
  179. padding:5px;
  180. font-size:10px;
  181. position:fixed;
  182. text-align: center;
  183. font-style: italic;
  184. letter-spacing: 1px;
  185. border: 1px solid #d9cdcd;
  186. padding: 5px;
  187. background-color: #fff;
  188. font-size: 120%;
  189. margin-bottom: 5px;
  190. transition-duration: 0.6s;
  191. -moz-transition-duration: 0.6s;
  192. -webkit-transition-duration: 0.6s;
  193. -o-transition-duration: 0.6s;
  194. }
  195.  
  196. #credit a {
  197. color: #ff8484;
  198. }
  199.  
  200.  
  201. </style>
  202.  
  203. </head>
  204.  
  205. <body>
  206.  
  207. <!---TOPBAR--->
  208.  
  209. <div id="topbar">
  210.  
  211. <div id="profile"><img src="https://placehold.co/80x80" align="left"></div> <!--EDIT ICON HERE-->
  212.  
  213. <div id="pagetitle">this is your title</div>
  214. <div id="desc">this is your description<p>
  215.  
  216. <div id="links">
  217. <a href="/">home</a>
  218. <a href="http://tumblr.com">back to dashboard</a>
  219. <a href="/">link one</a>
  220. <a href="/">link two</a>
  221. <a href="/">link three</a> <!--YOU CAN ADD OR REMOVE LINKS-->
  222. </div>
  223.  
  224. </div>
  225. </div>
  226.  
  227. <!---END TOPBAR--->
  228.  
  229. <!---START MUSEBOX--->
  230.  
  231. <!--here is an empty muse cell for you to copy and paste. must be within "contain" div.
  232.  
  233. <a href="BIO LINK HERE">
  234. <div id="muse">
  235. <div id="icon"><img src="https://placehold.co/250x350">
  236. <div id="name">first last</div>
  237. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  238. </div>
  239. </div>
  240. </a>
  241.  
  242. -->
  243.  
  244. <div id="contain">
  245.  
  246. <a href="BIO LINK HERE">
  247. <div id="muse">
  248. <div id="icon"><img src="https://placehold.co/250x350">
  249. <div id="name">first last</div>
  250. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  251. </div>
  252. </div>
  253. </a>
  254.  
  255. <a href="BIO LINK HERE">
  256. <div id="muse">
  257. <div id="icon"><img src="https://placehold.co/250x350">
  258. <div id="name">first last</div>
  259. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  260. </div>
  261. </div>
  262. </a>
  263.  
  264. <a href="BIO LINK HERE">
  265. <div id="muse">
  266. <div id="icon"><img src="https://placehold.co/250x350">
  267. <div id="name">first last</div>
  268. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  269. </div>
  270. </div>
  271. </a>
  272.  
  273. <a href="BIO LINK HERE">
  274. <div id="muse">
  275. <div id="icon"><img src="https://placehold.co/250x350">
  276. <div id="name">first last</div>
  277. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  278. </div>
  279. </div>
  280. </a>
  281.  
  282. <a href="BIO LINK HERE">
  283. <div id="muse">
  284. <div id="icon"><img src="https://placehold.co/250x350">
  285. <div id="name">first last</div>
  286. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  287. </div>
  288. </div>
  289. </a>
  290.  
  291. <a href="BIO LINK HERE">
  292. <div id="muse">
  293. <div id="icon"><img src="https://placehold.co/250x350">
  294. <div id="name">first last</div>
  295. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  296. </div>
  297. </div>
  298. </a>
  299.  
  300. <a href="BIO LINK HERE">
  301. <div id="muse">
  302. <div id="icon"><img src="https://placehold.co/250x350">
  303. <div id="name">first last</div>
  304. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  305. </div>
  306. </div>
  307. </a>
  308.  
  309. <a href="BIO LINK HERE">
  310. <div id="muse">
  311. <div id="icon"><img src="https://placehold.co/250x350">
  312. <div id="name">first last</div>
  313. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  314. </div>
  315. </div>
  316. </a>
  317.  
  318. <a href="BIO LINK HERE">
  319. <div id="muse">
  320. <div id="icon"><img src="https://placehold.co/250x350">
  321. <div id="name">first last</div>
  322. <div id="bio">will appear short, but can scroll if needed. two lines looks best. </div>
  323. </div>
  324. </div>
  325. </a>
  326.  
  327. </div>
  328.  
  329. <!---END MUSEBOX--->
  330.  
  331. <div id="credit">
  332. <a href="https://anahilation.tumblr.com/" title="theme by ana"><span class="material-symbols-outlined">gesture</span></a>
  333. </div>
  334.  
  335. </body>
  336.  
  337. </html>
  338.  
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!