API tools faq
paste
mochiroll

Requiem.Code.Re

mochiroll
Mar 7th, 2021 (edited)
172
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.27 KB | None | 0 0
raw download clone embed print report
  1. [comment]
  2. Designed and coded by [USER=20950]@Nano[/USER].
  3. Please do not remove the credits or claim the code as your own work.
  4.  
  5. [font=Roboto].[/font]
  6. [font=Roboto Slab].[/font]
  7. [font=Roboto Mono].[/font]
  8. [font=Sawarabi Mincho].[/font]
  9. [/comment][comment]
  10.  
  11. // accents
  12.  
  13. [/comment][border=0; padding: 0;
  14. --bgpattern: url('<-- image url -->') repeat;
  15. --bgcolor: #fefefe;
  16. --accent: #a33737;
  17. --FAcolor: #e7e7e7;
  18. --textcolor: #999999;
  19.  
  20. --jpfont: 'Sawarabi Mincho', sans-serif;
  21. --titlefont: 'Roboto Slab', serif;
  22. --headerfont: 'Roboto', sans-serif;
  23. --bodyfont: 'Roboto Mono', monospace;
  24.  
  25. --img01: url('<-- image url -->') center/cover no-repeat;
  26.  
  27. background: var(--bgpattern);
  28. padding: 75px 0;
  29. width: 100%;
  30. font-size: initial;
  31. ][comment]
  32.  
  33. // content wrapper //
  34.  
  35. [/comment][border=0; margin: 0 auto; padding: 0; width: 100%; max-width: 475px;][comment]
  36.  
  37. // start of top //
  38.  
  39. [/comment][border=0; display: flex; flex-flow: row nowrap; padding: 0; width: 100%; position: relative; z-index: 2; pointer-events: none;][border=0; display: flex; justify-content: center; align-items: center; padding: 0; flex: 1; width: 100%; height: 150px; background: var(--img01), var(--textcolor);][comment]
  40.  
  41. // start of title //
  42.  
  43. [/comment][border=0; margin-top: -19px; padding: 0; position: relative; pointer-events: auto;][border=0; padding: 0; font-family: var(--jpfont); font-size: 3.8em; line-height: 100%; color: var(--bgcolor); text-align: center; position: relative;]願望[/border][border=0; left: 0; right: 0; padding: 3px 0; background: var(--accent); font-family: var(--titlefont); color: var(--bgcolor); font-size: 12px; line-height: 100%; text-align: center; text-transform: lowercase; position: absolute;]requiem[/border][/border][comment]
  44.  
  45. // end of title //
  46.  
  47. [/comment][/border][border=0; display: flex; align-items: center; padding: 0; max-width: 25px; min-width: 25px; height: 150px; background: var(--accent);][comment]
  48.  
  49. // start of tab covers //
  50.  
  51. [/comment][border=0; margin-left: -13px; padding: 0; max-width: 25px;][comment]
  52.  
  53. ---- tab cover 01 ----
  54.  
  55. [/comment][border=1px solid var(--FAcolor); box-sizing: border-box; display: flex; justify-content: center; align-items: center; padding: 0; width: 25px; height: 25px; background: var(--bgcolor);][border=0; padding: 0; font-size: 15px; line-height: 100%; color: var(--FAcolor);][fa]fas fa-address-book[/fa][/border][/border][comment]
  56.  
  57. ---- tab cover 02 ----
  58.  
  59. [/comment][border=1px solid var(--FAcolor); box-sizing: border-box; display: flex; justify-content: center; align-items: center; margin-top: 7px; padding: 0; width: 25px; height: 25px; background: var(--bgcolor);][border=0; padding: 0; font-size: 15px; line-height: 100%; color: var(--FAcolor);][fa]fas fa-star[/fa][/border][/border][comment]
  60.  
  61. ---- tab cover 03 ----
  62.  
  63. [/comment][border=1px solid var(--FAcolor); box-sizing: border-box; display: flex; justify-content: center; align-items: center; margin-top: 7px; padding: 0; width: 25px; height: 25px; background: var(--bgcolor);][border=0; padding: 0; font-size: 15px; line-height: 100%; color: var(--FAcolor);][fa]fas fa-comments[/fa][/border][/border][/border][comment]
  64.  
  65. // end of tab covers //
  66.  
  67. [/comment][/border][/border][comment]
  68.  
  69. // end of top -- start of bot/content //
  70.  
  71. [/comment][border=0; margin-top: -120px; padding: 0; width: 100%; height: calc(75vh + 120px); max-height: 620px; min-height: 420px; line-height: 27px; position: relative; overflow: hidden;][border=0; top: -30px; left: 0; right: 38px; padding: 0; height: 150px; position: absolute;][/border][tabs]
  72.  
  73.  
  74.  
  75. [tab=0101010101010101010101010101010101010101010101010101010101][border=1px solid var(--FAcolor); left: 0; right: 0; box-sizing: border-box; margin-top: 1px; padding: 0; height: 75vh; max-height: 500px; min-height: 300px; background: var(--bgcolor); position: absolute; overflow: hidden;][border=0; margin: 15px; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(75vh - 30px); max-height: 470px; min-height: 270px; overflow-y: scroll;][comment]
  76.  
  77. ---------- header 01 ----------
  78.  
  79. [/comment][border=0; top: 0; margin: 0 auto; padding: 0; padding-bottom: 15px; width: 100%; background: var(--bgcolor); position: -webkit-sticky; position: sticky;][border=0; margin-bottom: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][border=0; padding: 0; width: 100%; font-family: var(--headerfont); font-size: .8em; line-height: 100%; letter-spacing: 4px; color: var(--textcolor); text-align: center; text-transform: uppercase;]Requiem[/border][border=0; margin-top: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][/border][comment]
  80.  
  81. // start of content 01 //
  82.  
  83. [/comment][border=0; padding: 0; font-family: var(--bodyfont); font-size: .8em; line-height: 140%; color: var(--textcolor); text-align: justify;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. [color=#a33737]Nam convallis erat eu dui sagittis congue[/color]. Proin ornare, nunc rhoncus consequat feugiat, turpis arcu efficitur mauris, ut viverra ex velit ut massa. Nullam consectetur ligula vel neque rutrum malesuada. Ut vel tristique ante. Duis vel ligula ex. Curabitur rhoncus, justo ut tincidunt consequat, purus mi scelerisque libero, sit amet laoreet velit lectus vel nunc. Aliquam consectetur vel tellus vel ultrices.
  84.  
  85. Cras laoreet est ut sollicitudin dignissim. Aenean eu sapien sit amet urna malesuada imperdiet. Sed eget justo nulla. Proin diam enim, blandit id velit quis, facilisis placerat odio. Nunc tincidunt ultricies nulla, feugiat sodales nisi dapibus a. Vivamus imperdiet semper sem a semper. [color=#a33737]Aliquam non semper nulla. Nulla sit amet erat augue[/color]. Fusce sed dui facilisis augue laoreet condimentum non at libero. Curabitur id ex lacinia, accumsan elit a, fermentum est. Mauris vitae lacus velit. Mauris lacus turpis, ullamcorper quis auctor sit amet, ullamcorper quis orci. Vivamus dignissim velit tortor, vel porttitor lacus euismod ut. Curabitur vitae metus eros. Aliquam pharetra tristique lacinia. Quisque porttitor at mauris ac malesuada.
  86.  
  87. Pellentesque non pretium tellus. Praesent mattis mauris sed libero lobortis, eget fringilla tortor cursus. Integer nisi dui, condimentum id felis vitae, condimentum maximus ante. Aliquam vulputate [color=#a33737]purus vel egestas fringilla[/color].[/border][comment]
  88.  
  89. // end of content 01 //
  90.  
  91. [/comment][/border][/border][/tab]
  92.  
  93.  
  94. [tab=0202020202020202020202020202020202020202020202020202020202][border=1px solid var(--FAcolor); left: 0; right: 0; box-sizing: border-box; margin-top: 1px; padding: 0; height: 75vh; max-height: 500px; min-height: 300px; background: var(--bgcolor); position: absolute; overflow: hidden;][border=0; margin: 15px; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(75vh - 30px); max-height: 470px; min-height: 270px; overflow-y: scroll;][comment]
  95.  
  96. ---------- header 02 ----------
  97.  
  98. [/comment][border=0; top: 0; margin: 0 auto; padding: 0; padding-bottom: 15px; width: 100%; background: var(--bgcolor); position: -webkit-sticky; position: sticky;][border=0; margin-bottom: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][border=0; padding: 0; width: 100%; font-family: var(--headerfont); font-size: .8em; line-height: 100%; letter-spacing: 4px; color: var(--textcolor); text-align: center; text-transform: uppercase;]Plotline[/border][border=0; margin-top: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][/border][comment]
  99.  
  100. // start of content 02 //
  101.  
  102. [/comment][border=0; padding: 0; font-family: var(--bodyfont); font-size: .8em; line-height: 140%; color: var(--textcolor); text-align: justify;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. [color=#a33737]Nam vitae mauris urna. Aliquam sodales dolor a nisl viverra venenatis.[/color] Nulla in elit pharetra, lacinia dolor in, hendrerit tortor. Vestibulum eget vulputate tellus. Aliquam sollicitudin urna eu vestibulum maximus. Fusce nec sagittis quam. Donec fringilla metus lacus, in laoreet est laoreet id. Proin tincidunt sed tortor sit amet vehicula.
  103.  
  104. Fusce consectetur massa elementum, gravida lacus a, tempor metus. Fusce non pellentesque nisi, viverra rhoncus lectus. Donec sem nisi, tristique nec malesuada vel, tincidunt eu velit. Donec consequat fermentum purus ut vestibulum. Duis eget ullamcorper metus. Curabitur suscipit auctor mi vel lobortis. Morbi vitae nisi mauris.
  105.  
  106. [color=#a33737]Morbi quis molestie tortor[/color]. Quisque eget lectus ex. Praesent sit amet cursus risus. Aenean sed ipsum massa. Integer pretium nulla ac quam convallis pharetra. Nulla lacinia libero vel erat sodales, ut ultrices felis facilisis. Mauris ultrices mollis lorem id mollis. [color=#a33737]Vestibulum eget volutpat urna[/color]. Vestibulum quis aliquet nisl. Cras viverra tristique est sed posuere. Integer et rhoncus orci. Nulla facilisi. Nulla eget arcu ut sem porttitor eleifend quis nec leo. Morbi ullamcorper sapien quis dolor fringilla vulputate. Nunc vel risus ut mi faucibus fringilla.[/border][comment]
  107.  
  108. // end of content 02 //
  109.  
  110. [/comment][/border][/border][/tab]
  111.  
  112.  
  113. [tab=0303030303030303030303030303030303030303030303030303030303][border=1px solid var(--FAcolor); left: 0; right: 0; box-sizing: border-box; margin-top: 1px; padding: 0; height: 75vh; max-height: 500px; min-height: 300px; background: var(--bgcolor); position: absolute; overflow: hidden;][border=0; margin: 15px; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(75vh - 30px); max-height: 470px; min-height: 270px; overflow-y: scroll;][comment]
  114.  
  115. ---------- header 03 ----------
  116.  
  117. [/comment][border=0; top: 0; margin: 0 auto; padding: 0; padding-bottom: 15px; width: 100%; background: var(--bgcolor); position: -webkit-sticky; position: sticky;][border=0; margin-bottom: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][border=0; padding: 0; width: 100%; font-family: var(--headerfont); font-size: .8em; line-height: 100%; letter-spacing: 4px; color: var(--textcolor); text-align: center; text-transform: uppercase;]Setup[/border][border=0; margin-top: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][/border][comment]
  118.  
  119. // start of content 03 //
  120.  
  121. [/comment][border=0; padding: 0; font-family: var(--bodyfont); font-size: .8em; line-height: 140%; color: var(--textcolor); text-align: justify;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ornare finibus lectus, ut luctus neque convallis ut. [color=#a33737]Donec hendrerit, est a mollis tempus, urna erat ultricies neque, et tempor dolor lectus in quam[/color]. Suspendisse potenti. Fusce aliquam sapien vel condimentum ultrices. Quisque tempus facilisis neque, sed facilisis tellus bibendum vel. Phasellus dignissim vulputate ipsum, sed congue urna viverra in. Nullam bibendum iaculis nulla ac congue. Nullam rutrum tortor eu sem tristique imperdiet. Duis ut dolor nisl. Phasellus non rutrum lacus. Praesent quis ullamcorper est, a ultrices nisl. Nam diam diam, accumsan et fermentum at, dictum quis mauris. Curabitur sagittis sem euismod bibendum hendrerit. Nullam sagittis mauris eget nunc cursus, commodo facilisis elit efficitur.
  122.  
  123. Quisque sed purus diam. Etiam in turpis sed metus ultricies ullamcorper nec sit amet sapien. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent sit amet bibendum odio, id ultrices lacus. Fusce rutrum commodo imperdiet. Nam efficitur, ligula quis blandit commodo, sem nisi suscipit nulla, sit amet molestie ligula magna eu augue. Maecenas nec augue ultrices arcu fringilla tempus. Nunc eget metus porttitor, tristique justo dictum, semper enim.
  124.  
  125. [color=#a33737]Donec vel laoreet ipsum[/color]. Aenean in consequat elit, at vehicula eros. Donec egestas justo lacus, eu accumsan nisl interdum hendrerit. Pellentesque nec metus consequat, accumsan massa nec, rhoncus arcu. Duis sit amet eros vel metus dapibus congue id nec ligula. Suspendisse viverra eget diam non suscipit. Nullam ullamcorper feugiat sapien ut faucibus. Sed condimentum tellus accumsan urna placerat sodales. [color=#a33737]Ut a sodales velit, hendrerit faucibus magna[/color].
  126.  
  127. [/border][comment]
  128.  
  129. ---------- header 04 ----------
  130.  
  131. [/comment][border=0; top: 0; margin: 0 auto; padding: 0; padding-bottom: 15px; width: 100%; background: var(--bgcolor); position: -webkit-sticky; position: sticky;][border=0; margin-bottom: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][border=0; padding: 0; width: 100%; font-family: var(--headerfont); font-size: .8em; line-height: 100%; letter-spacing: 4px; color: var(--textcolor); text-align: center; text-transform: uppercase;]Notes[/border][border=0; margin-top: 3px; padding: 0; width: calc(100% - 20px); height: 1px; background: var(--FAcolor);][/border][/border][comment]
  132.  
  133. // start of content 04 //
  134.  
  135. [/comment][border=0; padding: 0; font-family: var(--bodyfont); font-size: .8em; line-height: 125%; color: var(--textcolor); text-align: justify; text-transform: lowercase;][color=#a33737]Etiam neque magna:[/color]
  136.  
  137. - Pellentesque non pretium tellus. Praesent mattis mauris sed libero lobortis.
  138.  
  139. - Lorem ipsum dolor sit amet.
  140.  
  141. - Fusce sed dui facilisis augue laoreet condimentum non at libero.
  142.  
  143. - Mauris lacus turpis, ullamcorper quis auctor sit amet, ullamcorper quis orci. Vivamus dignissim velit tortor, vel porttitor lacus euismod ut. Curabitur vitae metus eros. Aliquam pharetra tristique lacinia. Quisque porttitor at mauris ac malesuada.
  144.  
  145. - Praesent mattis mauris sed libero lobortis, eget fringilla tortor cursus.
  146.  
  147. - Praesent mattis mauris sed libero lobortis, eget fringilla tortor cursus.
  148.  
  149. - Phasellus dictum risus eros.
  150.  
  151. - Suspendisse vitae sapien fringilla, facilisis justo nec, tristique diam.[/border][comment]
  152.  
  153. // end of content 03 //
  154.  
  155. [/comment][/border][/border][/tab]
  156.  
  157.  
  158.  
  159. [/tabs][/border][comment]
  160.  
  161. // end of bot/content //
  162.  
  163. [/comment][comment]
  164.  
  165. // visible credit -- please don't remove!!! //
  166.  
  167. [/comment][border=0px; margin: 5px auto 0; padding: 0; width: 100%; max-width: 1000px; height: 0; font-size: .6em; text-align: center; color: var(--textcolor); text-transform: uppercase; opacity: .5;]code by Nano[comment][USER=20950]@Nano[/USER][/comment][/border][/border][/border]
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!