nine-shin

[TUMBLR] Taeyeon Four Seasons

Dec 6th, 2019
105
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.10 KB | None | 0 0
  1. <!----------------------------------------
  2. BASIC 01
  3. by airi-nyaan
  4.  
  5. PLEASE FOLLOW THE RULES
  6. Credits:<br>
  7. Designed by: http://9-daily.blogspot.com/search/label/Home
  8. Basecode by: https://airi-nyaan.tumblr.com/basic01
  9. ---------------------------------------->
  10.  
  11. <!DOCTYPE html>
  12.  
  13. <html>
  14.  
  15. <head>
  16.  
  17. <title>{Title}</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20.  
  21. <meta name="viewport" content="width=1366">
  22.  
  23. <meta name="image:Sidebar" content=""/>
  24. <meta name="text:Link 1" content=""/>
  25. <meta name="text:Link 1 URL" content=""/>
  26. <meta name="text:Link 2" content=""/>
  27. <meta name="text:Link 2 URL" content=""/>
  28.  
  29.  
  30. <link href="https://fonts.googleapis.com/css?family=Lato|Roboto" rel="stylesheet">
  31. <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
  32.  
  33.  
  34. <style>
  35.  
  36. /*---BASIC---*/
  37.  
  38. ::-webkit-scrollbar {
  39. width: 10px;
  40. height: 10px;
  41. }
  42.  
  43. ::-webkit-scrollbar-track {
  44. background: #6f6f6f;
  45. }
  46.  
  47. ::-webkit-scrollbar-thumb {
  48. background: #f4c4b3;
  49. }
  50.  
  51. ::-webkit-scrollbar-thumb:hover {
  52. background: #6f6f6f;
  53. }
  54.  
  55. ::-moz-selection {
  56. color: {color:Accent 1};
  57. background: {color:Accent 4};
  58. }
  59.  
  60. ::selection {
  61. color: {color:Accent 1};
  62. background: {color:Accent 4};
  63. }
  64.  
  65. html {
  66. font-size: 100%;
  67. }
  68.  
  69. body {
  70. word-wrap: break-word;
  71. background-color: #f6eaea;
  72. background-attachment: fixed;
  73. }
  74.  
  75. a {
  76. text-decoration: none;
  77. color: #ffffff;
  78. }
  79.  
  80. a:hover {
  81. color: #f4968a;
  82. }
  83.  
  84. .container {
  85. position: absolute;
  86. margin: 0px 0px 0px 60px;
  87. width: 1366px;
  88. padding: 0;
  89. }
  90.  
  91. /*---SIDEBAR---*/
  92.  
  93. .sidebar {
  94. position: absolute;
  95. margin: 80px 0px 0px 0px;
  96. width: 220px;
  97. padding: 0;
  98. }
  99.  
  100. .sidebarimg {
  101. margin: 0;
  102. width: 200px;
  103. max-height: 250px;
  104. padding: 10px;
  105. background: #f4c4b3;
  106. }
  107.  
  108. /*---MENU---*/
  109.  
  110. .menu {
  111. margin: 13px 0px 0px 0px;
  112. width: 220px;
  113. padding: 0;
  114. }
  115.  
  116. .menu a {
  117. display: inline-block;
  118. margin: 0px 6px 0px 0px;
  119. width: 38px;
  120. padding: 6px 4px;
  121. text-transform: uppercase;
  122. text-align: center;
  123. line-height: 100%;
  124. font-family: calibri;
  125. font-weight: 500;
  126. font-size: 0.625rem;
  127. color: #ffffff;
  128. background: #f4c4b3;
  129. transition: all 0.6s ease;
  130. }
  131.  
  132. .menu a:hover {
  133. color: #000000;
  134. transition: all 0.6s ease;
  135. }
  136.  
  137. /*---SIDEBAR---*/
  138.  
  139. .blogtitle {
  140. margin: 18px 0px 0px 0px;
  141. width: 200px;
  142. padding: 10px 10px 0px 10px;
  143. color: #000000;
  144. background: #f4c4b3;
  145. }
  146.  
  147. .blogtitle h1 {
  148. margin: 0;
  149. padding: 0;
  150. text-decoration: none;
  151. text-transform: uppercase;
  152. line-height: 100%;
  153. font-family: 'Lato', sans-serif;
  154. font-weight: 600;
  155. font-size: 0.8125rem;
  156. }
  157.  
  158. .description {
  159. margin: 0;
  160. width: 200px;
  161. padding: 6px 10px 10px 10px;
  162. color: #000000;
  163. background: #f4c4b3;
  164. }
  165.  
  166. .description p {
  167. margin: 0;
  168. padding: 0;
  169. text-align: justify;
  170. line-height: 150%;
  171. font-family: 'Roboto', sans-serif;
  172. font-weight: 500;
  173. font-size: 0.625rem;
  174. }
  175.  
  176. /*---PAGE---*/
  177.  
  178. .pagination {
  179. margin: 40px 0px 0px 0px;
  180. width: 220px;
  181. padding: 0;
  182. text-align: center;
  183. line-height: 130%;
  184. font-family: calibri;
  185. font-weight: 500;
  186. font-size: 0.8125rem;
  187. color: #f4968a;
  188. }
  189.  
  190. /*---POST---*/
  191.  
  192. .postbox {
  193. position: relative;
  194. margin: 50px 0px 0px 350px;
  195. top: 32px;
  196. width: 550px;
  197. padding: 0;
  198. }
  199.  
  200. .post {
  201. margin: 0;
  202. width: 500px;
  203. padding: 35px 25px 25px 25px;
  204. text-align: justify;
  205. line-height: 180%;
  206. font-family: 'Roboto', sans-serif;
  207. font-weight: 500;
  208. font-size: 0.75rem;
  209. color: #a40d0d;
  210. background: #f4c4b3;
  211. }
  212.  
  213. .post blockquote, .posts li, .post img {
  214. max-width: 100%;
  215. }
  216.  
  217. .post blockquote {
  218. margin-left: 10px;
  219. padding-left: 10px;
  220. border-left: 1px;
  221. border-left-style: solid;
  222. border-color: {color:Accent 2};
  223. }
  224.  
  225. .post li {
  226. margin-left: -15px;
  227. }
  228.  
  229. .post img {
  230. opacity: 0.8;
  231. transition: all 0.6s ease;
  232. }
  233.  
  234. article:hover .post img {
  235. opacity: 1;
  236. transition: all 0.6s ease;
  237. }
  238.  
  239. {block:PermalinkPage}
  240.  
  241. .post img {
  242. opacity: 1;
  243. }
  244.  
  245. {/block:PermalinkPage}
  246.  
  247. .title, .linkpost, .quotepost {
  248. display: block;
  249. margin: 0;
  250. max-width: 100%;
  251. padding: 0;
  252. line-height: 180%;
  253. font-family: 'Lato', sans-serif;
  254. }
  255.  
  256. .title, .linkpost {
  257. text-transform: uppercase;
  258. font-weight: 600;
  259. font-size: 0.9375rem;
  260. }
  261.  
  262. .title {
  263. color: {color:Accent 2};
  264. }
  265.  
  266. .quotepost {
  267. text-transform: none;
  268. font-weight: 500;
  269. font-size: 0.8125rem;
  270. color: {color:Accent 3};
  271. }
  272.  
  273. .askpost, .chatpost {
  274. line-height: 170%;
  275. }
  276.  
  277. .asker {
  278. margin-top: -30px;
  279. margin-left: 17px;
  280. }
  281.  
  282. .question, .label {
  283. color: {color:Accent 3};
  284. }
  285.  
  286. /*---MEDIA---*/
  287.  
  288. .photopost {
  289. opacity: 0.8;
  290. transition: all 0.6s ease;
  291. }
  292.  
  293. article:hover .photopost {
  294. opacity: 1;
  295. transition: all 0.6s ease;
  296. }
  297.  
  298. {block:PermalinkPage}
  299.  
  300. .photopost {
  301. opacity: 1;
  302. }
  303.  
  304. {/block:PermalinkPage}
  305.  
  306. /*---INFO---*/
  307.  
  308. .info {
  309. margin: 0px 0px 50px 0px;
  310. width: 530px;
  311. padding: 10px;
  312. line-height: 130%;
  313. font-family: calibri;
  314. font-weight: 500;
  315. font-size: 0.75rem;
  316. color: #000000;
  317. background: #f4c4b3;
  318. border-top: 1px;
  319. border-top-style: solid;
  320. border-color: #ffffff;
  321. }
  322.  
  323. .buttons {
  324. display: inline-flex;
  325. display: -webkit-inline-flex;
  326. float: right;
  327. }
  328.  
  329. .button {
  330. margin-left: 10px;
  331. }
  332.  
  333. .tagindex, .tagpermalink {
  334. margin: 0;
  335. padding: 5px 0px 0px 0px;
  336. text-align: justify;
  337. line-height: 150%;
  338. font-weight: 500;
  339. font-size: 0.75rem;
  340. }
  341.  
  342. .tagindex {
  343. opacity: 0;
  344. transition: all 0.6s ease;
  345. }
  346.  
  347. article:hover .tagindex {
  348. opacity: 1;
  349. transition: all 0.6s ease;
  350. }
  351.  
  352. .postnotes {
  353. width: 500px;
  354. line-height: 150%;
  355. }
  356.  
  357. ol.notes {
  358. margin-top: 15px;
  359. margin-left: 30px;
  360. padding: 0px;
  361. list-style-type: none;
  362. }
  363.  
  364. ol.notes li.note {
  365. padding: 3px;
  366. }
  367.  
  368. ol.notes li.note img.avatar {
  369. margin-right: 13px;
  370. width: 16px;
  371. height: 16px;
  372. vertical-align: -4px;
  373. }
  374.  
  375. ol.notes li.note blockquote {
  376. margin: 5px 0px;
  377. padding-left: 5px;
  378. border-left: 1px;
  379. border-left-style: solid;
  380. border-color: {color:Accent 2};
  381. }
  382.  
  383. a.taeten:link, a.taeten, a.taeten:active {
  384.  
  385. color:#000000;
  386. padding: 12px 10px;
  387. font-size:15px;
  388. font-family: 'Lato', sans-serif;
  389. font-weight: normal;
  390. font-style: normal;
  391. text-transform: uppercase; letter-spacing: 1px;
  392. margin: 1px;
  393. -webkit-transition: 1s ease-out;-moz-transition: 1s ease-out;transition: 1s ease-out;
  394. }
  395.  
  396. a.taeten:hover {
  397. color: #ffffff;
  398. background: none;
  399. border-radius:2px;
  400. -webkit-transition: 1s ease-out;-moz-transition: 1s ease-out;transition: 1s ease-out;
  401. }
  402.  
  403.  
  404. </style>
  405.  
  406. </head>
  407.  
  408.  
  409. <noembed><body></noembed>
  410.  
  411. <!---BASIC--->
  412.  
  413. <div class="container">
  414. <div style="position: absolute; top:0px; left:0px;">
  415. <img src="https://images2.imgbox.com/25/45/W3dMSBDB_o.png">
  416. </div><br>
  417.  
  418.  
  419. <!---SIDEBAR--->
  420. <div style="position: absolute; top:470px; left:126px;">
  421. <div class="sidebar">
  422.  
  423. <header>
  424.  
  425. <img class="sidebarimg" src="{image:Sidebar}">
  426.  
  427. <!---MENU--->
  428.  
  429. <div style="background:none;padding:4px;position:absolute; top:-80px;left:-80px; width:1366px; overflow: auto; color:#F9FCFF;"><br><center>
  430. <a class="taeten" href="http://www.{Name}.tumblr.com">Home</a>
  431. <a class="taeten" href="http://www.{name}.tumblr.com/ask">Ask</a>
  432. <a class="taeten" href="http://www.{Name}.tumblr.com/archive">Archive</a>
  433. <a class="taeten" href="{text:link 1 URL}">{text:link 1}</a>
  434. <a class="taeten" href="{text:link 2 URL}">{text:link 2}</a>
  435. <br><br>
  436. </center></div>
  437.  
  438. <!---SIDEBAR--->
  439.  
  440. <div class="blogtitle"><h1>{Title}</h1></div>
  441.  
  442. <div class="description"><p>{Description}</p></div>
  443.  
  444. </header><br>
  445.  
  446. <!---PAGE--->
  447.  
  448. {block:Pagination}
  449.  
  450. <nav class="pagination">
  451. {block:PreviousPage}
  452. <a href="{PreviousPage}"><i class="fa fa-long-arrow-left"></i></a>
  453. {/block:PreviousPage}
  454. {CurrentPage} / {TotalPages}
  455. {block:NextPage}
  456. <a href="{NextPage}"><i class="fa fa-long-arrow-right"></i></a>
  457. {/block:NextPage}
  458. </nav>
  459.  
  460. {/block:Pagination}
  461.  
  462. {block:PermalinkPagination}
  463.  
  464. <nav class="pagination">
  465. {block:NextPost}
  466. <a href="{NextPost}"><i class="fa fa-long-arrow-left"></i></a>
  467. {/block:NextPost}
  468. {block:PreviousPost}
  469. <a href="{PreviousPost}"><i class="fa fa-long-arrow-right"></i></a>
  470. {/block:PreviousPost}
  471. </nav>
  472.  
  473. {/block:PermalinkPagination}</div>
  474.  
  475. <!--sidebar-->
  476.  
  477. <!---POST--->
  478. <main>
  479.  
  480. <div class="postbox">
  481.  
  482. {block:TagPage}
  483.  
  484. <header>
  485. <div class="post">
  486. <h1 class="title">TAGGED POSTS</h1>
  487. <p>{lang:Showing TagResultCount posts tagged Tag}.</p>
  488. </div>
  489. <div class="info"></div>
  490. </header>
  491.  
  492. {/block:TagPage}
  493.  
  494. {block:Posts}
  495.  
  496. <article>
  497.  
  498. <div class="post">
  499.  
  500. {block:Text}
  501. {block:Title}<h1 class="title">{Title}</h1>{/block:Title}{Body}
  502. {/block:Text}
  503.  
  504. {block:Link}
  505. <a href="{URL}"><h1 class="linkpost">{Name}</h1></a>
  506. {block:Description}{Description}{/block:Description}
  507. {/block:Link}
  508.  
  509. {block:Quote}
  510. <div class="quotepost">“ {Quote} ”</div>
  511. {block:Source}— {Source}{/block:Source}
  512. {/block:Quote}
  513.  
  514. {block:Answer}
  515. <div class="askpost">
  516. <div><img src="{AskerPortraitURL-30}"><p class="asker">{Asker}: </p></div>
  517. <p class="question">{Question}</p>
  518. <p>{Answer}</p>
  519. </div>
  520. {/block:Answer}
  521.  
  522. {block:Chat}
  523. {block:Title}<h1 class="title">{Title}</h1>{/block:Title}
  524. {block:Lines}<div class="chatpost">
  525. {block:Label}<span class="label">{Label}</span>{/block:Label} {Line}
  526. </div>{/block:Lines}
  527. {/block:Chat}
  528.  
  529. <!---MEDIA--->
  530.  
  531. {block:Photo}
  532. {Linkopentag}<div class="photopost"><img src="{PhotoURL-500}">
  533. </div>{Linkclosetag}
  534. {block:Caption}{Caption}{/block:Caption}
  535. {/block:Photo}
  536.  
  537. {block:Photoset}
  538. <div class="photopost">{Photoset}</div>
  539. {block:Caption}{Caption}{/block:Caption}
  540. {/block:Photoset}
  541.  
  542. {block:Panorama}
  543. {LinkOpenTag}<div class="photopost"><img src="{PhotoURL-Panorama}">
  544. </div>{LinkCloseTag}
  545. {block:Caption}{Caption}{/block:Caption}
  546. {/block:Panorama}
  547.  
  548. {block:Video}
  549. {Video-500}
  550. {block:Caption}{Caption}{/block:Caption}
  551. {/block:Video}
  552.  
  553. {block:Audio}
  554. {block:AudioEmbed}{AudioEmbed}{/block:AudioEmbed}
  555. {block:Caption}{Caption}{/block:Caption}
  556. {/block:Audio}
  557.  
  558. </div> <!--post-->
  559.  
  560. <!---INFO--->
  561.  
  562. <div class="info">
  563.  
  564. {block:IndexPage}
  565.  
  566. <a href="{Permalink}">{block:Date}{TimeAgo}{/block:Date}</a>
  567.  
  568. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  569.  
  570. <div class="buttons">
  571. <span class="button">{ReblogButton color="grey" size="15"}</span>
  572. <span class="button">{LikeButton color="grey" size="15"}</span>
  573. </div>
  574.  
  575. {block:HasTags}<div class="tagindex">
  576. {block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}
  577. </div>{/block:HasTags}
  578.  
  579. {/block:IndexPage}
  580.  
  581. {block:PermalinkPage}
  582.  
  583. {block:Date}{TimeAgo}{/block:Date}
  584.  
  585. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  586.  
  587. <div class="buttons">
  588. <span class="button">{ReblogButton color="grey" size="15"}</span>
  589. <span class="button">{LikeButton color="grey" size="15"}</span>
  590. </div>
  591.  
  592. {block:HasTags}<div class="tagpermalink">
  593. {block:Tags}<a href="{TagURL}">#{Tag} </a>{/block:Tags}
  594. </div>{/block:HasTags}
  595.  
  596. {block:PostNotes}<div class="postnotes">{PostNotes}
  597. </div>{/block:PostNotes}
  598.  
  599. {/block:PermalinkPage}
  600. <!--CREDITS: DO NOT REMOVE-->
  601. <center><b> Layout by: <a href="http://9-daily.blogspot.com/search/label/Home">9Daily</a> |Tumblr Basecode by: <a href="https://airi-nyaan.tumblr.com/basic01">airi-nyaan</a> | Resources: <a href="https://www.deviantart.com/vul3m3/art/42-Photopack-TaeYeon-600493834">1</a> <a href="https://www.deviantart.com/snowmanjester/art/Cubism-Inspired-Texture-Pack-800375613">2</a> </b></center>
  602. </div> <!--info-->
  603.  
  604. </article>
  605.  
  606. {/block:Posts}
  607.  
  608. </div> <!--postbox-->
  609.  
  610. </main>
  611. </div>
  612. </div> <!--container-->
  613.  
  614.  
  615. </body>
  616.  
  617. </html>
Add Comment
Please, Sign In to add comment