API tools faq
paste
Advertisement
nemurou

omelas v2

nemurou
Aug 20th, 2017
6,281
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.80 KB | None | 0 0
raw download clone embed print report
  1. <!---
  2.  
  3. tumblr page by kenshinuesugi / nemurou
  4.  
  5. august 2017
  6.  
  7. --->
  8.  
  9. <!DOCTYPE html>
  10. <html>
  11. <head>
  12. <title>{Title}</title>
  13. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  14. <link rel="shortcut icon" href="{Favicon}">
  15. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  16. <meta name="viewport" content="width=device-width, initial-scale=1">
  17. <link href="https://fonts.googleapis.com/css?family=Montserrat:400,400i,700|Open+Sans:400,400i,700" rel="stylesheet">
  18.  
  19.  
  20. <style type="text/css">
  21.  
  22.  
  23. /*custom scrollbar, you can delete this is you want*/
  24. ::-webkit-scrollbar {
  25. width:17px;
  26. height:17px;
  27. }
  28.  
  29. ::-webkit-scrollbar {
  30. /*set background-color to the color of your bg*/
  31. background-color:#fff;
  32. }
  33.  
  34. ::-webkit-scrollbar-thumb {
  35. /*set border to the color of your bg*/
  36. border:8px solid #fff;
  37. /*set background-color to the color of your scrollbar*/
  38. background-color:#aaa;
  39. min-width:26px;
  40. min-height:26px;
  41. }
  42. /*end of custom scrollbar*/
  43.  
  44. body {
  45. /*chnage background color below*/
  46. background:#fff;
  47. /*change text color below*/
  48. color:#444;
  49. /*change font here*/
  50. font-family: 'Open Sans', sans-serif;
  51. /*change font size below*/
  52. font-size:13px;
  53. /*change letter spacing below*/
  54. letter-spacing:.25px;
  55. line-height:160%;
  56. }
  57.  
  58. /*links*/
  59. a {
  60. /*change link color*/
  61. color:#000;
  62. text-decoration:none;
  63. }
  64.  
  65. img {
  66. display:block;
  67. }
  68.  
  69. /*container around your entire about*/
  70. #container {
  71. width:540px;
  72. border:1px solid #aaa;
  73. margin:100px auto;
  74. padding:10px;
  75. border-radius:5px;
  76. -moz-border-radius:5px;
  77. -webkit-border-radius:5px;
  78. }
  79.  
  80. /*header*/
  81. #name {
  82. /*font family*/
  83. font-family: 'Montserrat', sans-serif;
  84. /*font size*/
  85. font-size:15px;
  86. /*delete the line below if you do not want your header in all caps*/
  87. text-transform:uppercase;
  88. /*spacing between each word*/
  89. word-spacing:5px;
  90. /*delete the line below if you do not want your header text centered*/
  91. text-align:center;
  92. border:1px solid #aaa;
  93. /*delete the 3 lines below if you do not want rounded borders*/
  94. border-radius:3px;
  95. -moz-border-radius:3px;
  96. -webkit-border-radius:3px;
  97. padding:7px 10px;
  98. box-sizing:border-box;
  99. -webkit-box-sizing:border-box;
  100. -moz-box-sizing:border-box;
  101. }
  102.  
  103. /*container around your icon & basic info*/
  104. #profile {
  105. border:1px solid #aaa;
  106. padding:20px 30px;
  107. border-radius:3px;
  108. -moz-border-radius:3px;
  109. -webkit-border-radius:3px;
  110. margin-top:10px;
  111. box-sizing:border-box;
  112. -webkit-box-sizing:border-box;
  113. -moz-box-sizing:border-box;
  114. }
  115.  
  116. /*edit your icon appearance here*/
  117. #icon {
  118. width:130px;
  119.  
  120. }
  121.  
  122. /*container around your basic info (the section right next to the icon)*/
  123. #facts {
  124. margin-left:180px;
  125. margin-top:-130px;
  126. box-sizing:border-box;
  127. -webkit-box-sizing:border-box;
  128. -moz-box-sizing:border-box;
  129. }
  130.  
  131. /*container for each individual section*/
  132. .sections {
  133. border-bottom:1px dashed #aaa;
  134. padding:12px 0px;
  135. position:relative;
  136. }
  137.  
  138. /*container for each category within each section*/
  139. .category {
  140. position:absolute;
  141. font-family: 'Montserrat', sans-serif;
  142. left:0px;
  143. width:80px;
  144. }
  145.  
  146. /*container for the text next to the category*/
  147. .info {
  148. margin-left:100px;
  149. }
  150.  
  151. .sections:first-child {
  152. border-top:1px dashed #aaa;
  153. }
  154.  
  155. /*container for info below your profile*/
  156. #bio {
  157. margin-top:10px;
  158. border-radius:3px;
  159. -moz-border-radius:3px;
  160. -webkit-border-radius:3px;
  161. /*change color of profile background*/
  162. background:#fff;
  163. }
  164.  
  165. /*sections within your bio*/
  166. .block {
  167. margin-bottom:25px;
  168. background:transparent;
  169. }
  170.  
  171. /*heading for each section within your bio*/
  172. .title {
  173. border-bottom:1px dashed #aaa;
  174. font-family: 'Montserrat', sans-serif;
  175. font-size:16px;
  176. padding:10px 10px 10px 20px;
  177. letter-spacing:.75px;
  178. }
  179.  
  180. /*container for text below each heading*/
  181. .txt {
  182. margin:15px 30px 0px 30px;
  183. }
  184.  
  185. /*edit your table here*/
  186. table {
  187. width:100%;
  188. border-spacing:5px;
  189. }
  190.  
  191. /*table sections*/
  192. th, td {
  193. padding:5px 7px;
  194. border:1px solid #aaa;
  195. text-align:left;
  196. border-radius:4px;
  197. }
  198.  
  199. /*1st and 3rd columns in the table*/
  200. td {
  201. text-align:right;
  202. background:#eaeaea;
  203. font-family:'Montserrat', sans-serif;
  204. }
  205.  
  206. /*2nd and 4th columns in the table*/
  207. th {
  208. font-weight:400;
  209. }
  210.  
  211. .tab {
  212. overflow: hidden;
  213. background:transparent;
  214. }
  215.  
  216. /*buttons inside the tab */
  217. .tab button {
  218. font-family: 'Montserrat', sans-serif;
  219. font-size:17px;
  220. color:inherit;
  221. background:#fff;
  222. float:left;
  223. border:none;
  224. outline:none;
  225. cursor:pointer;
  226. padding:7px 15px;
  227. transition:0.3s;
  228. border:1px solid #aaa;
  229. margin-right:10px;
  230. border-radius:4px 4px 0px 0px;
  231. -moz-border-radius:4px 4px 0px 0px;
  232. -webkit-border-radius:4px 4px 0px 0px;
  233. }
  234.  
  235. /*buttons on hover */
  236. .tab button:hover {
  237. background:#ddd;
  238. }
  239.  
  240. /*active tab*/
  241. .tab button.active {
  242. background:#fff;
  243. border-bottom:1px solid #fff;
  244. }
  245.  
  246. /*tab content*/
  247. .tabcontent {
  248. display: none;
  249. padding: 6px 12px;
  250. border-top: none;
  251. border:1px solid #aaa;
  252. margin-top:-1px;
  253. }
  254.  
  255. /*DO NOT TOUCH THE THEME CREDIT*/
  256. .saeyoung a{
  257. background:#fff;
  258. position:fixed;
  259. left:20px;
  260. bottom:15px;
  261. opacity:.7;
  262. color:#545454;
  263. z-index:999;
  264. border-radius:4px;
  265. -moz-border-radius:4px;
  266. -webkit-border-radius:4px;
  267. padding:3px 8px 4px 8px;
  268. }
  269.  
  270. </style>
  271.  
  272. </head>
  273.  
  274. <body>
  275.  
  276. <div id="container">
  277.  
  278. <div id="name"><a href="/">gathering dreams</a></div>
  279.  
  280. <div id="profile">
  281. <!--- replace https://static... with the URL of your icon--->
  282. <a href="/"><img id="icon" src="https://static.tumblr.com/wegwsdb/ihsoulpvp/omela.jpg"></a>
  283. <div id="facts">
  284.  
  285. <!--copy and paste the text below to add another section-->
  286. <div class="sections">
  287. <div class="category">Name</div>
  288. <div class="info">Yuri Plisetsky</div>
  289. </div>
  290. <!--end copy and paste--->
  291.  
  292. <div class="sections">
  293. <div class="category">Birthday</div>
  294. <div class="info">March 1st</div>
  295. </div>
  296.  
  297. <div class="sections">
  298. <div class="category">Occupation</div>
  299. <div class="info">Figure skator</div>
  300. </div>
  301.  
  302.  
  303. </div>
  304. </div>
  305.  
  306. <div id="bio">
  307.  
  308. <div class="tab">
  309. <!---edit tab names here--->
  310.  
  311. <button class="tablinks" onclick="opentab(event, 'Biography')" id="defaultOpen">Biography</button>
  312.  
  313. <button class="tablinks" onclick="opentab(event, 'Information')">General Information</button>
  314. </div>
  315.  
  316. <div id="Biography" class="tabcontent">
  317.  
  318. <!--copy and paste the text below to add another section-->
  319. <div class="block">
  320. <div class="title">Appearance</div>
  321. <div class="txt">Yuri has blonde chin-length hair that covers the right side of his face and blue-green eyes. He is shorter than average for his age and has a thin frame; because of his appearance, he is nicknamed the Russian Fairy.</div>
  322. </div>
  323. <!--end copy and paste--->
  324.  
  325. <div class="block">
  326. <div class="title">Personality</div>
  327. <div class="txt">Yuri is very ambitious and is determined to become the best of the best in figure skating. Contrary to his beauty and grace on the ice, once Yuri steps out of the rink he becomes foul-mouthed, rude, and dismissive of othersーearning him his second nickname, the Russian Punk. To ensure he gets what he wants, Yuri is not above threatening or intimidating his competition. He is short-tempered and very accustomed to yelling.</div>
  328. </div>
  329.  
  330.  
  331. </div>
  332.  
  333. <div id="Information" class="tabcontent">
  334. <table>
  335.  
  336. <!--copy and paste the text below to add another section-->
  337. <tr>
  338. <td>Country</td>
  339. <th>Russia</th>
  340. <td>Gender</td>
  341. <th>Male</th>
  342. </tr>
  343. <!--end copy and paste--->
  344.  
  345. <tr>
  346. <td>Age</td>
  347. <th>16</th>
  348. <td>Height</td>
  349. <th>163 cm (5'4)</th>
  350. </tr>
  351.  
  352. <tr>
  353. <td>Coach</td>
  354. <th>Yakov Feltsman<br>Lilia Baranovskaya</th>
  355. <td>Family</td>
  356. <th>
  357. Nikolai Plisetsky<br>
  358. Potya (Pet)</th>
  359. </tr>
  360.  
  361. </table>
  362. </div>
  363.  
  364.  
  365. <script>
  366. function opentab(evt, infos) {
  367. var i, tabcontent, tablinks;
  368. tabcontent = document.getElementsByClassName("tabcontent");
  369. for (i = 0; i < tabcontent.length; i++) {
  370. tabcontent[i].style.display = "none";
  371. }
  372. tablinks = document.getElementsByClassName("tablinks");
  373. for (i = 0; i < tablinks.length; i++) {
  374. tablinks[i].className = tablinks[i].className.replace(" active", "");
  375. }
  376. document.getElementById(infos).style.display = "block";
  377. evt.currentTarget.className += " active";
  378. }
  379.  
  380. // Get the element with id="defaultOpen" and click on it
  381. document.getElementById("defaultOpen").click();
  382. </script>
  383.  
  384. </div>
  385. </div>
  386. </body>
  387.  
  388. </html>
  389.  
  390.  
  391. <!----PLEASE DO NOT REMOVE THE THEME CREDIT--->
  392. <span class="saeyoung"><a href="https://nemurou.tumblr.com/">THEME</a></span>
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!