API tools faq
paste
Advertisement
rae_stars

Community Gardens

rae_stars
May 29th, 2022 (edited)
298
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.43 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. Feel free to ask me if you need help with changing anything
  4. I will do my best to help
  5.  
  6. -->
  7.  
  8.  
  9.  
  10. <!-- FIRST IMAGE -->
  11.  
  12.  
  13. <div class="card" style="background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;;margin:auto;width:660px; height:80px; border-radius:100px;"></div>
  14.  
  15.  
  16. <!-- FIRST IMAGE END -->
  17.  
  18.  
  19.  
  20. <!-- FIRST BG CONTAINER -->
  21.  
  22. <div class="card mx-auto mt-3 mb-3" style="width:650px; height:300px;border-radius:10px;background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;">
  23.  
  24.  
  25. <!-- FIRST BG CONTAINER END -->
  26.  
  27.  
  28.  
  29. <!-- FIRST GRADIENT BG -->
  30.  
  31.  
  32. <div class="card mx-auto my-auto" style="width:625px; height:275px;background-image:linear-gradient( 100deg, #19eea1, #7EC4CF)">
  33.  
  34.  
  35. <!-- FIRST GRADIENT BG END -->
  36.  
  37. <div class="row no-gutters">
  38.  
  39. <div class="col-2 mr-5">
  40.  
  41.  
  42. <!-- PROFILE IMAGE -->
  43.  
  44. <div class="card ml-2 mt-2" style="background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;;margin:auto;width:200px; height:210px; "></div>
  45.  
  46.  
  47.  
  48. <!-- PROFILE IMAGE END -->
  49.  
  50.  
  51.  
  52. </div>
  53.  
  54. <div class="col-2 ml-5 pl-2">
  55.  
  56.  
  57.  
  58. <!-- ABOUT ME SECTION -->
  59.  
  60.  
  61. <div class="card ml-2 mt-2 text-white" style="width:400px; height:210px; background-color:#1b141c;">
  62.  
  63. <p class="text-center m-0" style="font-size:35px;font-family:impact;letter-spacing:2px;text-shadow: 1px -2px 1px teal"><i><u> Name </u></i></p>
  64.  
  65. <p class="text-center mb-2 " style="font-size:18px;font-family:impact;letter-spacing:1px;text-shadow: 1px -2px 1px teal"><i> some - words - about - you </i></p>
  66.  
  67. <div class="card mx-auto border-0 text-justify " style="width:380px; height:110px;overflow-x:hidden;overflow-y:auto; background-color:#1b141c;">
  68.  
  69. <p class="mx-auto px-3" style="font-family:Helvetica;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque. </p>
  70.  
  71.  
  72.  
  73.  
  74. </div>
  75.  
  76.  
  77. </div>
  78.  
  79.  
  80.  
  81. <!-- ABOUT ME SECTIO END -->
  82.  
  83.  
  84.  
  85. </div>
  86.  
  87.  
  88. </div>
  89.  
  90.  
  91.  
  92.  
  93. <!-- QUOTE -->
  94.  
  95. <div class="card mt-2 mx-auto text-white" style="width:610px;height:40px; background-color:#1b141c;">
  96.  
  97. <p class="text-center mt-1" style="font-family:brush script MT;font-size:21px;letter-spacing:1px;">❝ Mayhaps a cool quote ❞</p>
  98.  
  99.  
  100. <!-- QUOTE END -->
  101.  
  102.  
  103. </div>
  104.  
  105.  
  106. </div>
  107.  
  108.  
  109.  
  110. </div>
  111.  
  112.  
  113.  
  114. <!-- SECOND IMAGE -->
  115.  
  116.  
  117. <div class="card" style="background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;;margin:auto;width:660px; height:80px; border-radius:100px;"></div>
  118.  
  119.  
  120. <!-- SECOND IMAGE END -->
  121.  
  122.  
  123.  
  124.  
  125. <!-- SECOND BG CONTAINER -->
  126.  
  127.  
  128. <div class="card mx-auto mt-3 mb-3" style="width:650px; height:300px;border-radius:10px;background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;">
  129.  
  130.  
  131. <!-- SECOND BG CONTAINER END -->
  132.  
  133.  
  134.  
  135.  
  136.  
  137. <!-- SECOND GRADIENT BG -->
  138.  
  139.  
  140. <div class="card mx-auto my-auto" style="width:625px; height:275px;background-image:linear-gradient( 100deg, #19eea1, #7EC4CF)">
  141.  
  142.  
  143. <!-- SECOND GRADIENT BG END -->
  144.  
  145.  
  146.  
  147.  
  148. <!-- INTERESTS -->
  149.  
  150. <div class="row no-gutters text-white">
  151.  
  152. <div class="col-5 mr-5">
  153.  
  154. <div class="card ml-2 mt-2" style="width:370px; height:125px; background-color:#1b141c;">
  155.  
  156. <p class=" ml-3 mb-1 mt-1" style="font-size:26px;font-family:impact;letter-spacing:2px;text-shadow: 1px -2px 1px teal"><u><i> Interests </i></u></p>
  157.  
  158. <p class="px-3" style="font-family:Helvetica;"> words, words, words, words, words, words, words, words, words, you get the idea (these boxes dont scroll btw) </p>
  159.  
  160.  
  161.  
  162. </div>
  163.  
  164. <!-- INTERESTS END -->
  165.  
  166.  
  167.  
  168.  
  169. <!-- WARNINGS -->
  170.  
  171. <div class="card ml-2 mt-2" style="width:370px; height:125px; background-color:#1b141c;">
  172.  
  173.  
  174.  
  175. <p class=" ml-3 mb-1 mt-1" style="font-size:26px;font-family:impact;letter-spacing:2px;text-shadow: 1px -2px 1px teal"><u><i> Warnings </i></u></p>
  176.  
  177. <p class="px-3" style="font-family:Helvetica;"> words, words, words, words, words, words, words, words, words, </p>
  178.  
  179. </div>
  180.  
  181.  
  182. <!-- WARNINGS END -->
  183.  
  184.  
  185.  
  186.  
  187.  
  188.  
  189. </div>
  190.  
  191. <div class="col-5 mt-2">
  192.  
  193.  
  194.  
  195. <!-- SOCIAL LINKS -->
  196.  
  197. <div class="card text-white" style="width:228px;height:258px;margin-left:80px; background-color:#1b141c;">
  198.  
  199.  
  200. <a class="btn btn mt-1 mx-auto text-white" style="width:220px;height:55px; background-color:#25BEA6; font-family: brush script mt; font-size:27px; letter-spacing:2px;" href="#"> <i class="fab fa-twitter" style="font-size:20px;"></i> Twitter </a>
  201.  
  202.  
  203. <a class="btn btn mt-2 mx-auto text-white" style="width:220px;height:55px; background-color:#25BEA6; font-family: brush script mt; font-size:27px; letter-spacing:2px;" href="#"> <i class="fab fa-instagram" style="font-size:20px;"></i> Instagram </a>
  204.  
  205.  
  206. <a class="btn btn mt-2 mx-auto text-white" style="width:220px;height:55px; background-color:#25BEA6; font-family: brush script mt; font-size:27px; letter-spacing:2px;" href="#"> <i class="fab fa-tumblr" style="font-size:20px;"></i> Tumblr </a>
  207.  
  208.  
  209. <a class="btn btn mt-2 mx-auto text-white" style="width:220px;height:55px; background-color:#25BEA6; font-family: brush script mt; font-size:27px; letter-spacing:2px;" href="#"> <i class="fab fa-youtube" style="font-size:20px;"></i> Youtube </a>
  210.  
  211.  
  212.  
  213. <!-- SOCIAL LINKS END -->
  214.  
  215.  
  216.  
  217. </div>
  218.  
  219.  
  220.  
  221. </div>
  222.  
  223.  
  224. </div>
  225.  
  226.  
  227.  
  228.  
  229. </div>
  230.  
  231.  
  232.  
  233. </div>
  234.  
  235.  
  236. <!-- THIRD IMAGE -->
  237.  
  238. <div class="card" style="background-image: url(IMG URL);background-position: center;background-repeat: no-repeat;background-size:cover;;margin:auto;width:660px; height:80px; border-radius:100px;"></div>
  239.  
  240.  
  241. <!-- THIRD IMAGE END -->
  242.  
  243.  
  244.  
  245. <!-- CODE CREDIT DO NOT REMOVE -->
  246.  
  247. <a href="https://toyhou.se/humanshaped"><p class="text-center"><i class="fad fa-cat-space fa-spin"></i></p></a>
  248.  
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!