API tools faq
paste
Advertisement
jercydee

Review Folder by striveattemptfail

jercydee
May 21st, 2015
308
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.36 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. CUSTOM PAGE 002: REVIEW FOLDER
  3. THEME BY: Jercy @ striveattemptfail.tumblr.com
  4.  
  5. CREDITS:
  6. -background from subtlepatterns.com
  7. -->
  8.  
  9. <!DOCTYPE html>
  10. <html>
  11. <head>
  12.  
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. <link href='http://fonts.googleapis.com/css?family=Walter+Turncoat' rel='stylesheet' type='text/css'>
  18.  
  19. <head>
  20. <style type="text/css">
  21.  
  22. body { font-family: Helvetica; font-size: 14px; margin: 0; padding: 0; word-wrap: break-word; white-space: normal;
  23. background-image: url('http://subtlepatterns.com/patterns/wood_pattern.png'); /* changes background image */
  24. color: #384252; /* changes font colour */
  25. }
  26.  
  27. a { text-decoration: none; transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out;
  28. color: #E25858; /* changes link colour */
  29. border-bottom: 2px dotted #384252; /* changes link underline colour */
  30. }
  31.  
  32. a:hover {
  33. text-decoration: none;
  34. background-color: #C0EFD2; /* changes link on hover background colour */
  35. color: #384252; /* changes link on hover colour */
  36. border-bottom: 2px dotted #E25858; /* changes link on hover underline colour */
  37. }
  38.  
  39. #main { width: 690px; margin-top: 50px; margin-left: auto; margin-right: auto; }
  40.  
  41. /* MAIN CODE *//* CODE BY STRIVEATTEMPTFAIL */
  42. #header { font-family: 'Walter Turncoat', cursive; font-size: 25px; width: 250px; padding: 10px 15px 0px 15px; float: left;
  43. background-color: #fff; /* changes header background colour */
  44. color: #216196; /* changes header font colour */
  45. }
  46.  
  47. #triangle-bottomleft { margin-left: 280px; width: 0; height: 0; border-right: 45px solid transparent;
  48. border-bottom: 45px solid #fff; /* changes header background colour */
  49. }
  50.  
  51. #container { padding: 20px 15px 0px 15px; width: 685px; height: 430px; margin-top: 0px; margin-bottom: 50px; overflow-y: auto; overflow-x: hidden; box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5); -moz-box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5); -webkit-box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5);
  52. background-color: #fff; /* changes 'folder' colour */
  53. }
  54.  
  55. #container .inner { width: 300px; height: 370; padding: 10px; margin-right: 10px; margin-bottom: 15px;
  56. background-color: #E9D6AF; /* changes individual container colour */
  57. }
  58.  
  59. #container .inner img { opacity: 1; width: 300px; height: 300px; margin-bottom: 10px; transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; }
  60.  
  61. #container .inner img:hover { opacity: 0.7; }
  62.  
  63. /* TOP BAR */
  64. #container_menu { text-align: justify; padding: 20px 15px; width: 685px; margin-top: 0px; margin-bottom: 50px; box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5); -moz-box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5); -webkit-box-shadow: 5px 5px 5px 0px rgba(119, 119, 119, 0.5);
  65. background-color: #fff; /* changes top 'folder' background colour */
  66. }
  67.  
  68. #container_menu .links { width: 518px; margin-left: auto; margin-right: auto; }
  69.  
  70. #container_menu .links p { font-family: 'Walter Turncoat', cursive; font-size: 20px; margin-bottom: 0.1em; }
  71.  
  72. #container_menu .links a { font-family: Helvetica; text-align: center; display: inline-block; width: 160px; padding-top: 5px; padding-bottom: 5px; margin-left: 5px; margin-right: 5px; border: 0px;
  73. background-color: #C0EFD2; /* top 'folder' link background colour */
  74. }
  75.  
  76. #container_menu .links a:hover { letter-spacing: 1px; }
  77.  
  78. /* SCROLLBARS - what property changes what:
  79. -track: track colour
  80. -thumb: main scrollbar colour
  81. -corner: corner colour
  82.  
  83. body: changes main scrollbar
  84. #container: changes scrollbar for each 'folder'
  85. */
  86.  
  87. body::-webkit-scrollbar { width: 10px; height: 10px; }
  88. body::-webkit-scrollbar-track { background-color: #E9D6AF; }
  89. body::-webkit-scrollbar-thumb { background-color: #E25858; }
  90. body::-webkit-scrollbar-corner { background-color: #E25858; }
  91.  
  92. #container::-webkit-scrollbar { width: 7.5px; height: 7.5px; }
  93. #container::-webkit-scrollbar-track { background-color: #C0EFD2; }
  94. #container::-webkit-scrollbar-thumb { background-color: #384252; }
  95. #container::-webkit-scrollbar-corner { background-color: #384252; }
  96.  
  97. /* CREDIT *//* CODE BY STRIVEATTEMPTFAIL */
  98. #cred { position: fixed; bottom: 10px; right: 5px; transition: all 0.75s ease-in-out; -webkit-transition: all 0.75s ease-in-out; -moz-transition: all 0.75s ease-in-out; }
  99.  
  100. #cred:hover { transform: translate(0,-10px); -webkit-transform: translate(0,-10px); -moz-transform: translate(0,-10px); }
  101.  
  102. #cred a { background-color: #fff; padding: 3px; }
  103.  
  104. {CustomCSS}
  105.  
  106. </style>
  107.  
  108. <script type="text/javascript" src="http://static.tumblr.com/efqf52c/V2bnoiu0e/smoothscrollkryogenix.js"></script>
  109. </script>
  110.  
  111. </head>
  112.  
  113. <body>
  114.  
  115. <!------------CODE BY STRIVEATTEMPTFAIL, please don't steal------------>
  116.  
  117. <div id="main">
  118.  
  119. <div id="header">Your Title Here</div><div id="triangle-bottomleft"></div>
  120. <div id="container_menu">
  121. Your description here
  122. <div class="links">
  123. <p align="center">Links</p>
  124. <a href="/">Back to Blog</a>
  125. <a href="/">Link 2</a>
  126. <a href="/">Link 3</a>
  127. </div>
  128. </div>
  129.  
  130. <!----- Folder starts here ----->
  131. <div id="header">Movies I've Watched</div><div id="triangle-bottomleft"></div>
  132. <div id="container">
  133. <div class="inner" style="float:left">
  134.  
  135. <!--- Container starts here --->
  136. <img src="URL IMAGE HERE">
  137. <br><b>Movie</b>: Title
  138. <br><b>Year</b>: Year
  139. <br><b>Rating</b>: &#10029; &#10029; &#10029; &#10029; &#10025;
  140. <br><b>My review</b>: blah blah text here
  141. </div>
  142. <!--- Container ends here --->
  143.  
  144. </div>
  145. <!----- Folder ends here ----->
  146.  
  147. <!----- Folder starts here ----->
  148. <div id="header">Books I've Read</div><div id="triangle-bottomleft"></div>
  149. <div id="container">
  150.  
  151. <!--- Container starts here --->
  152. <div class="inner" style="float:left">
  153. <img src="IMAGE URL HERE">
  154. <br><b>Book</b>: Title
  155. <br><b>Author:</b> Name
  156. <br><b>Rating</b>: &#10029; &#10029; &#10029; &#10029; &#10029;
  157. <br><b>My Review:</b> blah blah here
  158. </div>
  159. <!--- Container ends here --->
  160.  
  161. </div>
  162. <!----- Folder ends here ----->
  163.  
  164. </div>
  165.  
  166. <!----------------------------THEME CREDIT---------------------------->
  167. <div id="cred"><a href="http://striveattemptfail.tumblr.com" title="theme credit" />&#9903;</a></div>
  168.  
  169. </body>
  170. </html>
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!