API tools faq
paste
ooksie

bloodied steel (uxie x rabbitswarren)

ooksie
Nov 10th, 2020 (edited)
423
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.59 KB | None | 0 0
raw download clone embed print report
  1. [comment]
  2. note: the original request specified small-caps! as such, most of the text here has a small-caps applied to it. to remove it, please search up "font-variant:small-caps" and remove it from the code entirely if you want to use normal-sized text! you may need to adjust the "font-size" in the same border tag that you removed small-caps from if the text ends up too big. i recommend dropping it by 2-10px!
  3. [/comment][border=transparent;
  4. *background colour;
  5. --bg-color: #7F7F7F;
  6. *text boxes colour;
  7. --color-1: #C3C3C3;
  8. *(darker) header colour;
  9. --color-2: #880015;
  10. *(lighter) subtitle and text colour;
  11. --t-color: #98413D;
  12.  
  13. *the one image;
  14. --img-1: url('https://breakthrough.org/wp-content/uploads/2018/10/default-placeholder-image.png');
  15.  
  16. height:fit-content; width:100%; max-width:420px; padding:0; padding-bottom:20px; position:relative; line-height:0; margin:auto;][border=transparent; height:440px; width:100%; max-width:420px; padding:10px; box-sizing:border-box; background-color: var(--bg-color); display:flex; flex-flow: row nowrap;]
  17.  
  18. [comment]----right----[/comment]
  19. [border=transparent; height:100%; width:43%; padding:0; margin-right:10px; display:flex; flex-flow: column nowrap;]
  20. [comment]----image----[/comment]
  21. [border=transparent; height:42%; width:100%; padding:0; background: var(--img-1); background-size:cover; margin-bottom:10px;
  22. /*edit the following to adjust the cropping of the image*/ background-position: 50% 50%;][/border]
  23.  
  24. [comment]----details box----[/comment]
  25. [border=transparent; height:calc(58% - 10px); width:100%; padding:0; box-sizing:border-box; display:flex; flex-flow: column nowrap; background: var(--color-1);]
  26. [comment]----quote----[/comment]
  27. [border=transparent; height:34%; width:100%; padding:5px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; overflow:hidden;]
  28. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--color-2); font-variant:small-caps; font-weight:bold; font-size:22px; line-height:100%; text-align:center;][font=Times New Roman][comment]
  29. ----* * * quote here----
  30. [/comment]"quote here
  31. three lines
  32. max"[/font][/border]
  33. [/border]
  34.  
  35. [comment]----details----[/comment]
  36. [border=transparent; height:66%; width:100%; padding:5px 0x; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0; display:flex; flex-flow: row wrap; align-content:flex-start;]
  37.  
  38. [comment]----copy this whole thing to get another tag!----[/comment]
  39. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:5px 0;]
  40. [comment]----icon----[/comment]
  41. [border=transparent; height:fit-content; width:30px; padding:0; flex-shrink:0; line-height:100%; color: var(--color-2); font-size:22px; text-align:center;][comment]
  42. ----* * * info icon here (replace the icon name in "fa-(icon)" with the name of the icon you want!)----
  43. [/comment][fa]fas fa-brain[/fa][/border]
  44.  
  45. [comment]----info text----[/comment]
  46. [border=transparent; height:fit-content; flex-grow:1; padding:0; margin-left:10px; color: var(--t-color); font-size:14px; line-height:120%; margin-top:2px;][font=Georgia][comment]
  47. ----* * * info contents here!----
  48. [/comment]mental state
  49. this will expand![/font][/border]
  50. [/border]
  51. [comment]----copy me too!----[/comment]
  52.  
  53. [comment]----copy this whole thing to get another tag!----[/comment]
  54. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:5px 0;]
  55. [comment]----icon----[/comment]
  56. [border=transparent; height:fit-content; width:30px; padding:0; flex-shrink:0; line-height:100%; color: var(--color-2); font-size:22px; text-align:center;][comment]
  57. ----* * * info icon here (replace the icon name in "fa-(icon)" with the name of the icon you want!)----
  58. [/comment][fa]fas fa-grin[/fa][/border]
  59.  
  60. [comment]----info text----[/comment]
  61. [border=transparent; height:fit-content; flex-grow:1; padding:0; margin-left:10px; color: var(--t-color); font-size:14px; line-height:120%; margin-top:2px;][font=Georgia][comment]
  62. ----* * * info contents here!----
  63. [/comment]feelings here[/font][/border]
  64. [/border]
  65. [comment]----copy me too!----[/comment]
  66.  
  67. [comment]----copy this whole thing to get another tag!----[/comment]
  68. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:5px 0;]
  69. [comment]----icon----[/comment]
  70. [border=transparent; height:fit-content; width:30px; padding:0; flex-shrink:0; line-height:100%; color: var(--color-2); font-size:22px; text-align:center;][comment]
  71. ----* * * info icon here (replace the icon name in "fa-(icon)" with the name of the icon you want!)----
  72. [/comment][fa]fas fa-comment-exclamation[/fa][/border]
  73.  
  74. [comment]----info text----[/comment]
  75. [border=transparent; height:fit-content; flex-grow:1; padding:0; margin-left:10px; color: var(--t-color); font-size:14px; line-height:120%; margin-top:2px;][font=Georgia][comment]
  76. ----* * * info contents here!----
  77. [/comment]thoughts here[/font][/border]
  78. [/border]
  79. [comment]----copy me too!----[/comment]
  80.  
  81. [comment]----copy this whole thing to get another tag!----[/comment]
  82. [border=transparent; height:fit-content; width:100%; padding:0; display:flex; flex-flow: row nowrap; align-items:flex-start; margin:5px 0;]
  83. [comment]----icon----[/comment]
  84. [border=transparent; height:fit-content; width:30px; padding:0; flex-shrink:0; line-height:100%; color: var(--color-2); font-size:22px; text-align:center;][comment]
  85. ----* * * info icon here (replace the icon name in "fa-(icon)" with the name of the icon you want!)----
  86. [/comment][fa]fas fa-heart[/fa][/border]
  87.  
  88. [comment]----info text----[/comment]
  89. [border=transparent; height:fit-content; flex-grow:1; padding:0; margin-left:10px; color: var(--t-color); font-size:14px; line-height:120%; margin-top:2px;][font=Georgia][comment]
  90. ----* * * info contents here!----
  91. [/comment]health here[/font][/border]
  92. [/border]
  93. [comment]----copy me too!----[/comment]
  94.  
  95. [/border][/border][/border]
  96. [comment]----details end----[/comment]
  97. [/border]
  98.  
  99. [/border]
  100. [comment]----right end----[/comment]
  101.  
  102. [comment]----left----[/comment]
  103. [border=transparent; height:100%; max-height:440px; width:calc(57% - 10px); padding:0; display:flex; flex-flow: column nowrap;]
  104.  
  105. [comment]----name box----[/comment]
  106. [border=transparent; min-height:17%; max-height:24%; width:100%; padding:5px 0; box-sizing:border-box; background: var(--color-1); display:flex; flex-flow: row wrap; align-content:center; justify-content:center; flex-shrink:0;]
  107. [comment]----name----[/comment]
  108. [border=transparent; height:fit-content; width:100%; padding:0; color: var(--color-2); font-variant:small-caps; font-size:30px; text-align:center; font-weight:bold; line-height:80%;][font=Times New Roman][comment]
  109. ----* * * your character's name here!----
  110. [/comment]name name[/font][/border]
  111.  
  112. [comment]----pronouns----[/comment]
  113. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:16px; font-variant:small-caps; line-height:100%; margin-top:5px; font-weight:bold;][font=Georgia][comment]
  114. ----* * *pronouns here!----
  115. [/comment](pro/pro)[/font][/border]
  116. [/border]
  117. [comment]----name box end----[/comment]
  118.  
  119. [comment]----music box----
  120. instructions for use!
  121. 1. change youtube link at ----song title----
  122. 2. change soundcloud link at ----actual media player---- -> ----soundcloud----[/comment]
  123. [border=transparent; height:calc(16% - 10px); width:100%; padding:0; background: var(--color-1); margin-top:10px; display:flex; flex-flow: row wrap; align-content:center; justify-content:center;]
  124. [comment]----song title (replace the xx with your youtube link!)----[/comment]
  125. [border=transparent; height:fit-content; width:100%; padding:0; text-align:center;][comment]
  126. ----* * *youtube link here!----
  127. [/comment][url='xx'][border=transparent; padding:0; color: var(--color-2); font-size:19px; font-variant:small-caps; line-height:100%; font-weight:bold;][font=Times New Roman][comment]
  128. ----* * * song name here!----
  129. [/comment]now playing[/font][/border][/url]
  130. [/border]
  131.  
  132. [comment]----buttons----[/comment]
  133. [border=transparent; height:fit-content; width:fit-content; padding:0; background: var(--color-1); position:relative; margin:4px 0;]
  134. [comment]----fake play button (ignore!)----[/comment]
  135. [border=transparent; height:fit-content; width:fit-content; padding:0; background: var(--color-1); position:relative; z-index:3; display:flex; pointer-events:none;]
  136. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:12px; line-height:100%; margin:0 3px;][fa]fas fa-play[/fa][/border]
  137. [border=transparent; height:fit-content; width:fit-content; padding:0; color: var(--t-color); font-size:12px; line-height:100%; margin:0 3px;][fa]fas fa-pause[/fa][/border]
  138. [/border]
  139.  
  140. [comment]----actual media player----[/comment]
  141. [border=transparent; height:12px; width:30px; padding:0; background-color:red; position:absolute; top:0; left:0; z-index:2; overflow:hidden;][border=transparent; padding:0; margin-left:-25px; margin-top:-35px;][tabs][tab=.]h[/tab]
  142.  
  143. [tab=.][border=transparent; height:12px; width:30px; padding:0; overflow:hidden; font-size:0; position:absolute; top:0; left:0;]h
  144. [comment]----soundcloud (replace the soundcloud link within media tag with your own!)----[/comment]
  145. [border=transparent; height:80px; width:500px; padding:0; margin-top:-15px; margin-left:-15px;]
  146. [media=soundcloud]http://soundcloud.com/xbwvhoxxj2i8/reol-cover[/media]
  147. [/border]
  148.  
  149. [/border][/tab]
  150. [/tabs][/border][/border]
  151. [comment]----actual media player end----[/comment]
  152. [/border]
  153. [comment]----buttons end----[/comment]
  154.  
  155. [comment]----disclaimer (ignore!)----[/comment]
  156. [border=transparent; height:fit-content; width:100%; padding:0; text-align:center; color:var(--t-color); font-size:9px; line-height:100%; margin:2px 0;][font=Georgia][comment]
  157. [/comment](click play twice!)[/font][/border]
  158.  
  159. [/border]
  160. [comment]----music box end----[/comment]
  161.  
  162. [comment]----body text----[/comment]
  163. [border=transparent; max-height:calc(67% - 10px); min-height:calc(60% - 10px); flex-shrink:1; width:100%; margin-top:10px; background: var(--color-1); padding:8px 0; box-sizing:border-box; display:flex; flex-direction:column; overflow:hidden;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;][border=transparent; height:auto; width:50%; padding:0 8px; box-sizing:border-box; color: var(--t-color); font-size:12px; line-height:120%; text-align:justify;][font=Georgia][comment]
  164. ----* * *text starts here!----
  165. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum feugiat, orci id ornare euismod, purus leo lobortis sapien, tincidunt aliquam velit risus vitae nulla. Proin porta ante eu nulla iaculis tempus. Ut sit amet sapien non ante pharetra congue ut vel turpis. Suspendisse fermentum metus ligula, eget tristique ligula sollicitudin sed. Duis ac malesuada dolor. Quisque eleifend nulla massa, et elementum velit elementum in. Curabitur iaculis iaculis quam, eu lacinia quam cursus et. In hac habitasse platea dictumst. Sed sit amet sapien dolor. Etiam molestie tincidunt feugiat. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent dictum mauris sit amet ornare hendrerit. Ut blandit blandit viverra. Proin nec ultricies eros. Duis facilisis fringilla leo.
  166.  
  167. Mauris dapibus cursus nulla iaculis vehicula. Aenean id ante lacus. Vestibulum porta dignissim urna id porttitor. Proin pharetra risus massa, nec sollicitudin sem malesuada in. Phasellus nec nisl nisl. In molestie elementum nisl, vitae congue nunc cursus at. Donec mattis quam odio, eget faucibus tortor porta eget. Ut rhoncus lacus pharetra, tincidunt est in, accumsan sapien.
  168. [/font][/border][/border][/border]
  169. [comment]----body text end----[/comment]
  170. [/border]
  171. [comment]----left end----[/comment]
  172.  
  173. [/border][comment]----signature! (do not remove!)-----
  174. [/comment][bg=transparent; height:fit-content; padding:0; width:100%; position:absolute; left:0; bottom:10px; z-index:7;opacity:0.7;font-size:10px;text-align:center; line-height:130%;][font=Open Sans]♡design by rabbitswarren, coded by uxie♡[/font][/bg][/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!