API tools faq
paste
clerihew

13. google

clerihew
Feb 1st, 2019
504
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.39 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3. <!--
  4. © Clerihew Themes 2018
  5.  
  6. Do not use without reading terms of use.
  7.  
  8. Contact me at clerihew.tumblr.com if you have problems with any
  9. un-heavily edited code or if you have questions on how to use this theme.
  10. -->
  11.  
  12. <title>{Title}</title>
  13.  
  14. <link rel="shortcut icon" href="{Favicon}"/>
  15.  
  16. <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
  17.  
  18. <!-- creds to @suiomi on tumblr for the honeybee font -->
  19. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  20.  
  21. <!-- basic variables -->
  22. <!-- colors -->
  23. <meta name="color:Background" content="#fff"/>
  24. <meta name="color:Blog Title" content="#34a853"/>
  25. <meta name="color:Blog Title Hover" content="#99d3a9"/>
  26. <meta name="color:Topbar Links" content="#737373"/>
  27. <meta name="color:Topbar Links Hover" content="#393939"/>
  28. <meta name="color:Links" content="#4285f4"/>
  29. <meta name="color:Links Hover" content="#a0c2f9"/>
  30. <meta name="color:Post Text" content="#545454"/>
  31. <meta name="color:Scrollbar Background" content="#929292"/>
  32. <meta name="color:Scrollbar Thumb" content="#212121"/>
  33. <meta name="color:Scrollbar Thumb Hover" content="#929292"/>
  34. <meta name="color:Nav and Tags Links Background" content="#dfe1e5"/>
  35. <meta name="color:Ask Background" content="#99d3a9"/>
  36. <!-- images -->
  37. <meta name="image:Sidebar" content=""/>
  38. <meta name="image:Link 1" content =""/>
  39. <meta name="image:Link 2" content =""/>
  40. <meta name="image:Link 3" content =""/>
  41. <meta name="image:Link 4" content =""/>
  42. <!-- text -->
  43. <meta name="text:Occupation" content=""/>
  44. <meta name="text:Facts 1" content=""/>
  45. <meta name="text:Facts 2" content=""/>
  46. <meta name="text:Facts 3" content=""/>
  47. <meta name="text:Link 1 Label" content=""/>
  48. <meta name="text:Link 1 URL" content=""/>
  49. <meta name="text:Link 2 Label" content=""/>
  50. <meta name="text:Link 2 URL" content=""/>
  51. <meta name="text:Link 3 Label" content=""/>
  52. <meta name="text:Link 3 URL" content=""/>
  53. <meta name="text:Link 4 Label" content=""/>
  54. <meta name="text:Link 4 URL" content=""/>
  55.  
  56.  
  57. <style>
  58.  
  59. body {
  60. background-color: {color:Background};
  61. font-family: "Montserrat", sans-serif;
  62. opacity: 1;
  63. transition: 1s opacity;
  64. }
  65.  
  66. body.fade {
  67. opacity: 0;
  68. transition: none;
  69. }
  70.  
  71. .topbar {
  72. height: 40px;
  73. width: 100%;
  74. position: fixed;
  75. left: 0;
  76. top: 0;
  77. border-bottom: 1px solid #ebebeb;
  78. box-shadow: 1px 1px 7px rgba(56, 56, 56, 0.4);
  79. background-color: {color:Background};
  80. }
  81.  
  82. .topbar h1 {
  83. font-size: 25px;
  84. margin-top: 5px;
  85. margin-left: 20px;
  86. color: {color:Blog Title};
  87. -webkit-transition: color 0.5s;
  88. -moz-transition: color 0.5s;
  89. -o-transition: color 0.5s;
  90. transition: color 0.5s;
  91. }
  92.  
  93. .topbar h1:hover {
  94. color: {color:Blog Title Hover};
  95. }
  96.  
  97. .topbar .searchbar {
  98. margin-left: 20px;
  99. position: fixed;
  100. top: 8px;
  101. }
  102.  
  103. .topbar input[type=text] {
  104. padding: 6px;
  105. border-radius: 15px;
  106. border: 0.5px solid #dfe1e5;
  107. }
  108.  
  109. .topbar input:focus {
  110. outline: none;
  111. box-shadow: 1px 1px 2px rgba(56, 56, 56, 0.2);
  112. }
  113.  
  114. .topbar .searchbar button {
  115. color: #4285f4;
  116. font-size: 15px;
  117. border: none;
  118. background-color: #fff;
  119. }
  120.  
  121. .topbar .searchbar button:hover {
  122. cursor: pointer;
  123. }
  124.  
  125. .topbar button:focus {
  126. outline: none;
  127. }
  128.  
  129. .topbar h1, .searchbar {
  130. display: inline-block;
  131. }
  132.  
  133. .sidebar {
  134. width: 400px;
  135. height: 575px;
  136. border: 1px solid #dfe1e5;
  137. border-radius: 10px;
  138. float: right;
  139. margin-right: 15px;
  140. margin-top: 3px;
  141. background-color: {color:Background};
  142. }
  143.  
  144. .sidebar img {
  145. width: 400px;
  146. height: 200px;
  147. margin: 0px;
  148. border-radius: 8px 8px 0px 0px;
  149. }
  150.  
  151. .sidebar h1 {
  152. color: #212121;
  153. margin-top: 5px;
  154. margin-left: 8px;
  155. margin-bottom: 0;
  156. }
  157.  
  158. .sidebar h4 {
  159. margin-top: 5px;
  160. margin-left: 8px;
  161. margin-bottom: 15px;
  162. font-size: 12px;
  163. color: #929292;
  164. }
  165.  
  166. .sidebar .th-paper-plane-o {
  167. margin-top: -55px;
  168. margin-right: 20px;
  169. float: right;
  170. font-size: 30px;
  171. color: #767676;
  172. -webkit-transition: color 0.5s;
  173. -moz-transition: color 0.5s;
  174. -o-transition: color 0.5s;
  175. transition: color 0.5s;
  176. }
  177.  
  178. .sidebar .th-paper-plane-o:hover {
  179. color: #232323;
  180. }
  181.  
  182. .sidebar .toptext {
  183. border-bottom: 1px solid #dfe1e5;
  184. }
  185.  
  186. .sidebar p {
  187. font-size: 12px;
  188. margin-top: 10px;
  189. margin-left: 10px;
  190. margin-right: 10px;
  191. color: #222;
  192. }
  193.  
  194. .sidebar p a {
  195. text-decoration: none;
  196. color: {color:Links};
  197. -webkit-transition: color 0.5s;
  198. -moz-transition: color 0.5s;
  199. -o-transition: color 0.5s;
  200. transition: color 0.5s;
  201. }
  202.  
  203. .sidebar p a:hover {
  204. color: {color:Links Hover};
  205. text-decoration: underline;
  206. }
  207.  
  208. .sidebar h6 {
  209. font-size: 12px;
  210. margin: 8px 10px 0px 10px;
  211. color: #222;
  212. font-weight: bold;
  213. }
  214.  
  215. .sidebar h3 {
  216. margin-top: 20px;
  217. margin-left: 10px;
  218. margin-bottom: 0;
  219. color: #222;
  220. font-size: 18px;
  221. }
  222.  
  223. .sidebar .bottomlinks {
  224. margin-left: 10px;
  225. margin-right: 10px;
  226. margin-top: 10px;
  227. }
  228.  
  229. .sidebar .bottomlinks img {
  230. height: 64px;
  231. width: 64px;
  232. padding: 0px 25px 0px 0px;
  233. border-radius: 0;
  234. }
  235.  
  236. .sidebar .bottomlinks a {
  237. font-size: 10px;
  238. width: 64px;
  239. padding: 0px 25px 0px 0px;
  240. margin: 0;
  241. display: inline-block;
  242. text-align: center;
  243. color: {color:Links};
  244. text-decoration: none;
  245. -webkit-transition: color 0.5s;
  246. -moz-transition: color 0.5s;
  247. -o-transition: color 0.5s;
  248. transition: color 0.5s;
  249. }
  250.  
  251. .sidebar .bottomlinks a:hover {
  252. color: {color:Links Hover};
  253. text-decoration: underline;
  254. }
  255.  
  256. .sidebar2 {
  257. width: 400px;
  258. height: 150px;
  259. border: 1px solid #dfe1e5;
  260. float: right;
  261. margin-top: 615px;
  262. margin-right: -402px;
  263. border-radius: 10px;
  264. background-color: {color:Background};
  265. }
  266.  
  267. .sidebar2 h3 {
  268. margin-left: 10px;
  269. margin-top: 10px;
  270. margin-bottom: 0;
  271. }
  272.  
  273. .sidebar2 a {
  274. display: inline-block;
  275. margin-top: 10px;
  276. margin-left: 10px;
  277. margin-right: 10px;
  278. margin-bottom: 5px;
  279. padding: 6px;
  280. color: {color:Links};
  281. text-decoration: none;
  282. border: 1px solid {color:Nav and Tags Links Background};
  283. border-radius: 15px;
  284. -webkit-transition: background-color 1s;
  285. -moz-transition: background-color 1s;
  286. -o-transition: background-color 1s;
  287. transition: background-color 1s;
  288. }
  289.  
  290. .sidebar2 a:hover {
  291. background-color: {color:Nav and Tags Links Background};
  292. }
  293.  
  294. #content {
  295. width: 500px;
  296. margin-top: 100px;
  297. margin-left: 150px;
  298. margin-right: 150px;
  299. }
  300.  
  301. /* posts links color */
  302. #content a {
  303. text-decoration: none;
  304. color: {color:Links};
  305. -webkit-transition: color 0.5s;
  306. -moz-transition: color 0.5s;
  307. -o-transition: color 0.5s;
  308. transition: color 0.5s;
  309. }
  310.  
  311. /* posts links color hover */
  312. #content a:hover {
  313. color: {color:Links Hover};
  314. }
  315.  
  316. #content blockquote {
  317. padding-left: 10px;
  318. }
  319.  
  320. img {
  321. border: 0;
  322. max-width: 100%;
  323. }
  324.  
  325. /* post background color */
  326. #content #posts {
  327. background-color: {color:Background};
  328. width: 500px;
  329. margin: 0 auto 75px;
  330. color: {color:Post Text};
  331. }
  332.  
  333. /* posts title font size */
  334. #content #posts .title {
  335. font-size: 22px;
  336. color: {color:Blog Title};
  337. padding-left: 10px;
  338. padding-right: 10px;
  339. }
  340.  
  341. /* posts text font size */
  342. #content #posts .text {
  343. font-size: 14px;
  344. padding-left: 10px;
  345. padding-right: 10px;
  346. }
  347.  
  348. /* background for questions in asks */
  349. .q {
  350. background-color: {color:Ask Background};
  351. color: black;
  352. padding: 4px;
  353. }
  354.  
  355. #content #posts #permalink {
  356. font-size: 12px;
  357. margin-top: 10px;
  358. padding: 5px;
  359. }
  360.  
  361. #content #posts #permalink ul {
  362. list-style-type: none;
  363. padding: 0px 0px 10px 0px;
  364. margin: 10px 0px 75px 0px;
  365. border-bottom: 3px solid #dfe1e5;
  366. }
  367.  
  368. #content #posts #permalink ul li {
  369. display: inline-block;
  370. margin-right: 10px;
  371. margin-top: 5px;
  372. padding: 5px;
  373. border: 1px solid {color:Nav and Tags Links Background};
  374. background-color: {color:Background};
  375. border-radius: 10px;
  376. -webkit-transition: background-color 1s;
  377. -moz-transition: background-color 1s;
  378. -o-transition: background-color 1s;
  379. transition: background-color 1s;
  380. }
  381.  
  382. #content #posts #permalink ul li:hover {
  383. background-color: {color:Nav and Tags Links Background};
  384. }
  385.  
  386. #content #posts #permalink ul li a:hover {
  387. color: {color:Links};
  388. }
  389.  
  390. #content #notecontainer {
  391. margin: -65px auto 10px auto;
  392. width: 500px;
  393. color: {color:Post Notes Page Text};
  394. }
  395.  
  396. /* post pages links color */
  397. #content #notecontainer a {
  398. color: {color:Post Links};
  399. padding: 3px;
  400. -webkit-transition: color 0.5s;
  401. -moz-transition: color 0.5s;
  402. -o-transition: color 0.5s;
  403. transition: color 0.5s;
  404. }
  405.  
  406. /* post pages links color hover */
  407. #content #notecontainer a:hover {
  408. color: {color:Post Links Hover};
  409. }
  410.  
  411. #content #notecontainer ol.notes {
  412. list-style-type: none;
  413. margin: 0;
  414. padding: 3px;
  415. }
  416.  
  417. #content #notecontainer img.avatar {
  418. width: 16px;
  419. height: 16px;
  420. }
  421.  
  422. .pagenav {
  423. width: 500px;
  424. text-align: center;
  425. margin-top: -120px!important;
  426. }
  427.  
  428. /* pagenav color */
  429. .pagenav a {
  430. color: {color:Post Links};
  431. text-decoration: none;
  432. display: inline-block;
  433. -webkit-transition: color 0.5s;
  434. -moz-transition: color 0.5s;
  435. -o-transition: color 0.5s;
  436. transition: color 0.5s;
  437. }
  438.  
  439. /* pagenav hover color */
  440. .pagenav a:hover {
  441. color: {color:Post Links Hover};
  442. }
  443.  
  444. .footer {
  445. width: 500px;
  446. text-align: center;
  447. margin-top: 5px;
  448. font-size: 12px;
  449. }
  450.  
  451. .footer a {
  452. color: #ffbdb7;
  453. text-decoration: none;
  454. -webkit-transition: color 1s;
  455. -moz-transition: color 1s;
  456. -o-transition: color 1s;
  457. transition: color 1s;
  458. }
  459.  
  460. .footer a:hover {
  461. color: #ccc!important;
  462. }
  463.  
  464. /* thanks @shythemes */
  465. ::-webkit-scrollbar {
  466. width: 17px;
  467. height: 17px;
  468. }
  469.  
  470. ::-webkit-scrollbar {
  471. background-color: {color:Background};
  472. }
  473.  
  474. ::-webkit-scrollbar-track {
  475. border: 8px solid {color:Background}; /* background color */
  476. background-color: #dfe1e5; /* light border color */
  477. }
  478.  
  479. ::-webkit-scrollbar-thumb {
  480. border: 8px solid {color:Background}; /* background color */
  481. background-color: {color:Post Text}; /* dark border color */
  482. min-height:24px;
  483. min-width:24px;
  484. }
  485.  
  486. /* tumblr controls credit to @cyantists on tumblr */
  487. iframe.tmblr-iframe {
  488. z-index:99999999999999!important;
  489. top:0!important;
  490. right:0!important;
  491. opacity:0.6;
  492. /* delete invert(1) from here */
  493. filter:invert(1) contrast(150%);
  494. -webkit-filter:invert(1) contrast(150%);
  495. -o-filter:invert(1) contrast(150%);
  496. -moz-filter:invert(1) contrast(150%);
  497. -ms-filter:invert(1) contrast(150%);
  498. /* to here if your blog has a dark background */
  499. transform:scale(0.65);
  500. transform-origin:100% 0;
  501. -webkit-transform:scale(0.65);
  502. -webkit-transform-origin:100% 0;
  503. -o-transform:scale(0.65);
  504. -o-transform-origin:100% 0;
  505. -moz-transform:scale(0.65);
  506. -moz-transform-origin:100% 0;
  507. -ms-transform:scale(0.65);
  508. -ms-transform-origin:100% 0;}
  509.  
  510. iframe.tmblr-iframe:hover {
  511. opacity:0.8!important;}
  512.  
  513. {block:PermalinkPage}
  514. .footer {
  515. display: none!important;
  516. }
  517. {/block:PermalinkPage}
  518.  
  519. {block:TagPage}
  520. .tagtitle {
  521. color: {color:Blog Title};
  522. width: 500px;
  523. margin-left: 150px;
  524. margin-top: 75px;
  525. margin-bottom: -70px;
  526. }
  527. {/block:TagPage}
  528.  
  529. </style>
  530.  
  531. </head>
  532. <body>
  533.  
  534. <script>
  535. document.body.className = 'fade';
  536. </script>
  537.  
  538. <div class="topbar">
  539. <a href="/"><h1>{Title}</h1></a>
  540. <div class="searchbar">
  541. <form action="/search" method="get">
  542. <input type="text" name="q" value="{SearchQuery}">
  543. <button type="submit" value="Search"><span class="th th-loupe-o"></span></button>
  544. </form>
  545. </div>
  546. </div>
  547.  
  548. <div class="sidebar">
  549. <image src="{image:Sidebar}"/>
  550. <div class="toptext">
  551. <h1>{Title}</h1>
  552. <h4>{text:Occupation}</h4>
  553. {block:AskEnabled}<a href="/ask"><span class="th th-paper-plane-o"></span></a>{/block:AskEnabled}
  554. </div>
  555. <p>{Description}</p>
  556. <!-- little abouts underneath description -->
  557. <h6>{text:Facts 1}</h6>
  558. <h6>{text:Facts 2}</h6>
  559. <h6>{text:Facts 3}</h6>
  560. <h3>People also search for</h3>
  561. <!-- tag page links/pictures -->
  562. <div class="bottomlinks">
  563. <img src="{image:Link 1}"/>
  564. <img src="{image:Link 2}"/>
  565. <img src="{image:Link 3}"/>
  566. <img src="{image:Link 4}"/>
  567. <a href="{text:Link 1 URL}">{text:Link 1 Label}</a>
  568. <a href="{text:Link 2 URL}">{text:Link 2 Label}</a>
  569. <a href="{text:Link 3 URL}">{text:Link 3 Label}</a>
  570. <a href="{text:Link 4 URL}">{text:Link 4 Label}</a>
  571. </div>
  572. </div>
  573.  
  574. <div class="sidebar2">
  575. <h3>Navigation</h3>
  576. <a href="/"><div class="links">home</div></a>
  577. {block:AskEnabled}<a href="/ask"><div class="links">{AskLabel}</div></a>{/block:AskEnabled}
  578. {block:SubmissionsEnabled}<a href="/submit"><div class="links">{SubmitLabel}</div></a>{/block:SubmissionsEnabled}
  579. {block:HasPages}{block:Pages}<a href="{url}"><div class="links">{Label}</div></a>{/block:Pages}{/block:HasPages}
  580. </table>
  581. </div>
  582.  
  583. {block:TagPage}
  584. <div class="tagtitle">
  585. <h2>Posts tagged "{Tag}"</h2>
  586. </div>
  587. {/block:TagPage}
  588.  
  589. <div id="content">
  590. {block:Posts}
  591. <div id="posts">
  592. {block:Photo}
  593. <img src="{PhotoURL-500}">
  594. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  595. {/block:Photo}
  596.  
  597. {block:Photoset}
  598. {Photoset-500}
  599. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:Caption}
  600. {/block:Photoset}
  601.  
  602. {block:Video}
  603. {Video-500}
  604. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  605. {/block:Video}
  606.  
  607. {block:Audio}
  608. {AudioPlayerBlack}
  609. <br /><div class="text">{PlayCountWithLabel}</div>
  610. {block:Caption}<br /><div class="text">{Caption}</div>{/block:Caption}
  611. {/block:Audio}
  612.  
  613. {block:Quote}
  614. <div class="title">"{Quote}"</div>
  615. {block:Source}<br>~ {Source}{/block:Source}
  616. {/block:Quote}
  617.  
  618. {block:Text}
  619. {block:Title}<div class="title">{Title}<br /></div>{/block:Title}
  620. <div class="text">{Body}</div>
  621. {/block:Text}
  622.  
  623. {block:Answer}
  624. <div class="q">{Question}<br />
  625. {Asker}</div><br />
  626. {Answer}
  627. {/block:Answer}
  628.  
  629. {block:Chat}
  630. <div class="title">{block:Title}{Title}<br />{/block:Title}</div>
  631. <div class="text">{block:Lines}
  632. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br />
  633. {/block:Lines}</div>
  634. {/block:Chat}
  635.  
  636. {block:Link}
  637. <a href="{URL}">{Name}</a>
  638. {block:Description}<br /><div class="text">{Description}</div>{/block:Description}
  639. {/block:Link}
  640.  
  641.  
  642. <div id="permalink">
  643. <a href="{PermaLink}">
  644. {block:Date}Posted {MonthNumberWithZero}/{DayOfMonthWithZero}/{ShortYear} {12HourWithZero}:{Minutes}{AmPm}{/block:Date}
  645. {block:NoteCount} with {NoteCountWithLabel}{/block:NoteCount}
  646. {block:HasTags}
  647. <ul class="tags">
  648. {block:Tags}
  649. <li>
  650. <a href="{TagURL}">#{Tag}</a>
  651. </li>
  652. {/block:Tags}
  653. </ul>
  654. {/block:HasTags}
  655. </a>
  656. </div>
  657.  
  658. {block:PostNotes}
  659. <div id="notecontainer">{PostNotes}</div>
  660. {/block:PostNotes}
  661.  
  662. {/block:Posts}
  663. </div>
  664. </div>
  665.  
  666. {block:Pagination}
  667. <div class="pagenav">
  668. <!-- change words for pagination here -->
  669. {block:PreviousPage}<a href="{PreviousPage}">previous</a>{/block:PreviousPage}
  670. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  671. </div>
  672. {/block:Pagination}
  673.  
  674. <!-- DO NOT TOUCH THIS -->
  675. <p class="footer">
  676. <a href="https://clerihew.tumblr.com/">theme by clerihew</a>
  677. </p>
  678.  
  679. <script>
  680. document.addEventListener("DOMContentLoaded", function(e) {
  681. document.body.className = '';
  682. });
  683. </script>
  684.  
  685. </body>
  686. </html>
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!