API tools faq
paste
Advertisement
scftlcves

#13 (v1) / petals (page)

scftlcves
Feb 12th, 2019
969
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.42 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <title>{Title}</title> <!--- AUTOMATICALLY SHOWS YOUR BLOG TITLE. IF YOU WISH TO HAVE SOMETHING DIFFERENT, TAKE OUT {Title} AND REPLACE IT WITH YOUR DESIRED PAGE TITLE. --->
  6. <link rel="shortcut icon" href="{Favicon}"/>
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  8.  
  9. <link href="https://fonts.googleapis.com/css?family=ABeeZee|Biryani|Comfortaa|Karla|M+PLUS+Rounded+1c|Quicksand|Ubuntu|Varela+Round" rel="stylesheet">
  10.  
  11. <link href="https://fonts.googleapis.com/css?family=Playfair+Display:900" rel="stylesheet">
  12.  
  13. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  14.  
  15. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  16.  
  17. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  18.  
  19. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  20.  
  21. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  22.  
  23. <script>
  24. (function($){
  25. $(document).ready(function(){
  26. $("[title]").style_my_tooltips({
  27. tip_follows_cursor:true,
  28. tip_delay_time:90,
  29. tip_fade_speed:600,
  30. attribute:"title"
  31. });
  32. });
  33. })(jQuery);
  34. </script>
  35.  
  36. <style type="text/css">
  37.  
  38. body {
  39. background-color:#f8f8f8;
  40. color:#5a5a5a;
  41. font-family:comfortaa;
  42. /* pre-loaded fonts that are used in my themes are below if you wish to change it! */
  43. font-size:10px;
  44. line-height:160%;
  45. letter-spacing:.25px; /* change to zero for no letter spacing */
  46. }
  47.  
  48. /* PRE-LOADED GOOGLE FONTS:
  49. - ABeeZee
  50. - Biryani
  51. - Comfortaa (when installed)
  52. - Karla
  53. - M PLUS Rounded 1c
  54. - Quicksand
  55. - Ubuntu
  56. - Varela Round
  57. */
  58.  
  59. a {
  60. text-decoration:none;
  61. color:#313131;
  62. }
  63.  
  64. a:hover {
  65. color:#5a5a5a;
  66. }
  67.  
  68. b,strong {
  69. color:#dbb1db;
  70. }
  71.  
  72. i,em {
  73. color:#baded1;
  74. }
  75.  
  76. ::-webkit-scrollbar {
  77. width: 5px;
  78. background: #f3f3f3;
  79. }
  80.  
  81. ::-webkit-scrollbar-track {
  82. background:#f8f8f8;
  83. }
  84.  
  85. ::-webkit-scrollbar-thumb {
  86. background-color:#e5c4c4;
  87. }
  88.  
  89.  
  90. #s-m-t-tooltip { /* TOOLTIPS AKA TITLES FOUND WHEN HOVERING */
  91. background-color:#f3f3f3;
  92. color:#e5c4c4;
  93. font-weight:bold;
  94. font-size:10px;
  95. text-transform:uppercase;
  96. padding:10px 15px 10px 15px;
  97. margin:20px 0px 0px 20px;
  98. z-index:9999999999999999999999;
  99. border:1px solid #e7e7e7;
  100. }
  101.  
  102. #contain {
  103. border-radius:6px;
  104. width:auto;
  105. margin:60px auto;
  106. text-align:center;
  107. padding:50px;
  108. }
  109.  
  110. .connect_entry {
  111. margin-right:15px;
  112. margin-bottom:15px;
  113. border-radius:6px;
  114. display:inline-block;
  115. width:200px;
  116. height:300px;
  117. background-color:#fbfbfb;
  118. border:1px solid #e7e7e7;
  119. }
  120.  
  121. .connect {
  122. display:block;
  123. text-align:center;
  124. font-size:18px;
  125. letter-spacing:1px;
  126. text-transform:lowercase;
  127. font-weight:bold;
  128. background-image: linear-gradient(to bottom right, #fbe0e0,#f4e5f4,#c6e5f5);
  129. color:#f7f7f7;
  130. font-family: 'Playfair Display', serif;
  131. padding:15px;
  132. }
  133.  
  134. .connect_name {
  135. text-transform:uppercase;
  136. font-family:comfortaa;
  137. font-weight:none;
  138. font-size:7px;
  139. letter-spacing:2px;
  140. color:#5a5a5a;
  141. }
  142.  
  143. .info {
  144. display:block;
  145. padding:10px;
  146. text-align:justify;
  147. height:210px;
  148. overflow:auto;
  149. }
  150.  
  151. .icon {
  152. display:inline-block;
  153. float:left;
  154. width:55px;
  155. height:55px;
  156. margin-right:10px;
  157. }
  158.  
  159. .icon img {
  160. width:55px;
  161. height:55px;
  162. border-radius:6px;
  163. }
  164.  
  165. #bottom {
  166. bottom:-1px;
  167. left:-1px;
  168. right:-1px;
  169. position:fixed;
  170. display:block;
  171. text-align:center;
  172. font-size:11px;
  173. letter-spacing:1px;
  174. text-transform:uppercase;
  175. font-weight:bold;
  176. border-top:;
  177. color:#f1bb87;
  178. padding:15px;
  179. height:45px;
  180. line-height:45px;
  181. background-color:#fbfbfb;
  182. border:1px solid #e7e7e7;
  183. }
  184.  
  185. #bottom_navigation {
  186. margin-top:5px;
  187. margin-left:10px;
  188. float:left;
  189. font-size:16px;
  190. color:#dbb1db;
  191. display:inline-block;
  192. }
  193.  
  194. #bottom_navigation a {
  195. color:#dbb1db;
  196. margin-right:15px;
  197. }
  198.  
  199. #bottom_credit {
  200. margin-top:5px;
  201. float:right;
  202. font-size:20px;
  203. color:#e5c4c4;
  204. display:inline-block;
  205. }
  206.  
  207. #bottom_credit a {
  208. color:#e5c4c4;
  209. margin-right:15px;
  210. }
  211.  
  212. </style></head>
  213.  
  214. <body>
  215.  
  216. <div id="contain">
  217.  
  218. <!---------- START OF CONNECTIONS ---------->
  219.  
  220. <!--- START OF CONNECTION ONE --->
  221.  
  222. <div class="connect_entry">
  223. <div class="connect">connection name
  224. <div class="connect_name">taken by <b>muse name</b></div>
  225. </div>
  226.  
  227. <div class="info">
  228. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  229. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  230. </div>
  231. </div>
  232.  
  233. <!--- START OF CONNECTION TWO --->
  234.  
  235. <div class="connect_entry">
  236. <div class="connect">connection name
  237. <div class="connect_name">taken by <b>muse name</b></div>
  238. </div>
  239.  
  240. <div class="info">
  241. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  242. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  243. </div>
  244. </div>
  245.  
  246. <!--- START OF CONNECTION THREE --->
  247.  
  248. <div class="connect_entry">
  249. <div class="connect">connection name
  250. <div class="connect_name">taken by <b>muse name</b></div>
  251. </div>
  252.  
  253. <div class="info">
  254. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  255. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis. <b>no worries, i made sure these will scroll if they get too long!</b>
  256. </div>
  257. </div>
  258.  
  259. <!--- START OF CONNECTION FOUR --->
  260.  
  261. <div class="connect_entry">
  262. <div class="connect">connection name
  263. <div class="connect_name">taken by <b>muse name</b></div>
  264. </div>
  265.  
  266. <div class="info">
  267. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  268. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  269. </div>
  270. </div>
  271.  
  272. <!--- START OF CONNECTION FIVE --->
  273.  
  274. <div class="connect_entry">
  275. <div class="connect">connection name
  276. <div class="connect_name">taken by <b>muse name</b></div>
  277. </div>
  278.  
  279. <div class="info">
  280. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  281. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  282. </div>
  283. </div>
  284.  
  285. <!--- START OF CONNECTION SIX --->
  286.  
  287. <div class="connect_entry">
  288. <div class="connect">connection name
  289. <div class="connect_name">taken by <b>muse name</b></div>
  290. </div>
  291.  
  292. <div class="info">
  293. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  294. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  295. </div>
  296. </div>
  297.  
  298. <!--- START OF CONNECTION SEVEN --->
  299.  
  300. <div class="connect_entry">
  301. <div class="connect">connection name
  302. <div class="connect_name">taken by <b>muse name</b></div>
  303. </div>
  304.  
  305. <div class="info">
  306. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  307. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis. <b>no worries, i made sure these will scroll if they get too long!</b>
  308. </div>
  309. </div>
  310.  
  311. <!--- START OF CONNECTION EIGHT --->
  312.  
  313. <div class="connect_entry">
  314. <div class="connect">connection name
  315. <div class="connect_name">taken by <b>muse name</b></div>
  316. </div>
  317.  
  318. <div class="info">
  319. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  320. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis.
  321. </div>
  322. </div>
  323.  
  324. <!--- START OF CONNECTION NINE --->
  325.  
  326. <div class="connect_entry">
  327. <div class="connect">connection name
  328. <div class="connect_name">taken by <b>muse name</b></div>
  329. </div>
  330.  
  331. <div class="info">
  332. <div class="icon"><img src="https://via.placeholder.com/55x55"></div>
  333. lorem ipsum dolor sit amet, consectetuer adipiscing elit. aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris. aliquam mattis porta urna. maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. aenean id massa ut lacus molestie porta. curabitur sit amet quam id libero suscipit venenatis. <b>no worries, i made sure these will scroll if they get too long!</b>
  334. </div>
  335. </div>
  336.  
  337. <!---------- END OF CONNECTIONS ---------->
  338. </div>
  339.  
  340. <div id="bottom">
  341. <div id="bottom_navigation">
  342. <a href="/" title="INDEX"><span class="th th-home-o"></span></a>
  343. <a href="/ask" title="MESSAGE"><span class="th th-chat-bubbles"></span></a>
  344. <a href="/archive" title="ARCHIVE"><span class="th th-calendar-1-o"></span></a>
  345. <a href="/" title="BIOGRAPHY"><span class="th th-star-o"></span></a>
  346. </div>
  347. <div id="bottom_credit">
  348. <a href="https://scftlcves.tumblr.com" title="THEME CREDIT"><span class="th th-heart-1-o"></span></a>
  349. </div>
  350. </div>
  351.  
  352. </body>
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!