API tools faq
paste
Jade-Everstone

ArtFighter (cc - bloom)

Jade-Everstone
Jun 23rd, 2022 (edited)
277
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 32.95 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML>
  2.  
  3. <!--Rules:
  4.  
  5. AF profile
  6. team bloom vers.
  7.  
  8. You may
  9. -frankenstein with other codes (as long as the creator of said code allows it)
  10. -edit/change as much as you need (example: making character codes into user codes, vice-versa)
  11.  
  12. You may not
  13. -Redistribute, resell, and/or claim its yours
  14. -Remove credit (you're allowed to move & edit it though, just keep it visible)
  15.  
  16. Misc Notes:
  17. -When editing, remember to turn WYSIWYG off! My codes may break otherwise
  18. -Some basic html knowledge is recommended for editing
  19.  
  20. Default Colors:
  21. -headers, button gradients: rgba(148,187,86,1), rgba(240,236,127,1)
  22.    -BG (w/o gradients): #94bb56
  23. -sub-headers, socials links: #94bb56
  24. -card backgrounds: #f6f8e9
  25. -Decorative Icons: #94bb56
  26.  
  27. Change the colors: Ctrl+f and search for the color you want to change.
  28.  
  29. -->
  30.  
  31. <!--background
  32.  
  33. you can delete the bg if you don't need it-->
  34.  
  35. <div style="
  36.    background-image:url(https://images.unsplash.com/photo-1503919483171-9ffc1debc390?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=2070&q=80);
  37.    background-attachment:fixed;
  38.    background-size:cover;
  39.    background-position:center;
  40.    z-index:-20;
  41.    height:100%;
  42.    width:100%;
  43.    position:absolute;
  44.    left:0px;
  45.    right:0px;
  46.    top:0;
  47.    bottom:0;
  48.    margin-top:-15px;
  49.    min-height:695px;
  50.    box-shadow: 3px 3px 5px rgba(0,0,0,0.5);background-color:rgba(10,2,20,0.95)">
  51. </div>
  52.  
  53. <!--end background-->
  54.  
  55.  
  56. <div class="container my-5" style="max-width:970px">
  57.    
  58.    
  59.         <!--main header-->
  60.        
  61.         <div class="card border-0 rounded-0 p-2 mb-3 text-white" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);
  62.            background-color:#94bb56;
  63.            background-image:linear-gradient(90deg, rgba(148,187,86,1) 26%, rgba(240,236,127,1) 100%)">
  64.             <div class="card-body">
  65.                
  66.                 <div class="row">
  67.                    
  68.                     <!--username-->
  69.                     <div class="col-12 col-md-7">
  70.                         <span style="font-size:3em;font-style:italic;font-weight:bold;letter-spacing:1px">
  71.                             <i class="fa-duotone fa-seedling"></i> Username
  72.                         </span>
  73.                     </div>
  74.                    
  75.                     <!--team name-->
  76.                     <div class="col-12 col-md-5" style="text-align:right;margin-top:auto;margin-bottom:auto">
  77.                         <span style="font-size:2em;font-style:italic;font-weight:bold;letter-spacing:1px;"> Team Bloom</span>
  78.                     </div>
  79.                    
  80.                 </div>
  81.                
  82.                 <hr style="border-width:3px;border-color:rgba(255,255,255,0.5);margin-top:1px;margin-bottom:2px">
  83.                
  84.             </div>
  85.         </div>
  86.        
  87.         <!--end main header-->
  88.        
  89.        
  90.         <!--main image/intro-->
  91.        
  92.         <div class="row mb-4">
  93.            
  94.             <!--image + quick info-->
  95.            
  96.             <div class="col-12 col-lg-4">
  97.                 <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:300px;margin-left:auto;margin-right:auto;
  98.                    background-color:#f6f8e9">
  99.                    
  100.                     <!--image-->
  101.                     <div class="card border-0 rounded-0" style=";min-height:300px;
  102.                    background-color:#f6f8e9;
  103.                    background-image:url(https://via.placeholder.com/300px);
  104.                    background-size:cover;
  105.                    background-position:center">
  106.                        
  107.                         <!--Decorative Icons-->
  108.                        
  109.                         <span style="color:#94bb56;font-size:100px;position:absolute;left:-17%;top:1%;transform:rotate(340deg);z-index:1;">
  110.                             <i class="fa-duotone fa-seedling"></i>
  111.                         </span>
  112.                        
  113.                         <span style="color:#94bb56;font-size:100px;position:absolute;right:-17%;bottom:1%;transform:rotate(20deg);z-index:1">
  114.                             <i class="fa-duotone fa-seedling"></i>
  115.                         </span>
  116.                        
  117.                        
  118.                         <!--image credit-->
  119.                         <span class="text-white" style="font-size:1.25em;position:absolute;right:5px;text-shadow:3px 3px 3px #000000;letter-spacing:2px">
  120.                            
  121.                             <!--character-->
  122.                             <a href="#"><i class="fa-solid fa-user text-white" data-toggle="tooltip" title="Character Name"></i></a>
  123.                            
  124.                             <!--image-->
  125.                             <a href="#"><i class="fa-solid fa-image text-white" data-toggle="tooltip" title="img - credit"></i></a>
  126.                            
  127.                         </span>
  128.                        
  129.                     </div>
  130.                    
  131.                     <!--Quick info-->
  132.                     <div class="card-body p-2">
  133.                        
  134.                         <span style="color:#94bb56;font-weight:bold;letter-spacing:1px">I attack</span>
  135.                         <span class="pull-right">Randomly/Revenge Focused</span>
  136.                         <hr class="my-1">
  137.                        
  138.                         <span style="color:#94bb56;font-weight:bold;letter-spacing:1px">Friendly Fire?</span>
  139.                         <span class="pull-right">yes/no</span>
  140.                         <hr class="my-1">
  141.                        
  142.                         <span style="color:#94bb56;font-weight:bold;letter-spacing:1px">Revenge Chains?</span>
  143.                         <span class="pull-right">yes/no</span>
  144.                         <hr class="my-1">
  145.                        
  146.                         <span style="color:#94bb56;font-weight:bold;letter-spacing:1px">Status</span>
  147.                         <span class="pull-right">Active/Break</span>
  148.                        
  149.                     </div>
  150.                    
  151.                 </div>
  152.             </div>
  153.            
  154.             <!--image + quick info-->
  155.            
  156.            
  157.             <!--Bio, socials, badges-->
  158.            
  159.             <div class="col-12 col-lg-8" style="margin-top:auto;margin-bottom:auto">
  160.                
  161.                 <div class="card text-dark border-0 rounded-0 mb-2" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);
  162.                    background-color:#f6f8e9">
  163.                    
  164.                     <!--bio-->
  165.                     <div class="card-body p-3">
  166.                        
  167.                         <p>Have a lot of info? this section will expand!</p>
  168.                         <p>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>
  169.                        
  170.                         <!--artfight page link-->
  171.                         <div class="mt-2" style="text-align:center">
  172.                             <a href="#" class="btn border-0 rounded-0 text-white"  style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);font-size:1.25em;background-color:#94bb56;
  173.                                background-image:linear-gradient(270deg, rgba(148,187,86,1) 26%, rgba(240,236,127,1) 100%)">
  174.                                
  175.                                 <i class="fa-duotone fa-seedling"></i> Artfight Page! <i class="fa-duotone fa-seedling"></i>
  176.                             </a>
  177.                         </div>
  178.                    
  179.                     </div>
  180.                    
  181.                     <!--socials-->
  182.                     <div class="card-footer mx-3 p-1 bg-transparent" style="font-size:1.75em;letter-spacing:7px;text-align:center">
  183.                        
  184.                         <a href="#" style="color:#94bb56">
  185.                             <i class="fa-brands fa-twitter" data-toggle="tooltip" title="Twitter"></i>
  186.                         </a>
  187.                        
  188.                         <a href="#" style="color:#94bb56">
  189.                             <i class="fa-brands fa-deviantart" data-toggle="tooltip" title="DeviantArt"></i>
  190.                         </a>
  191.                        
  192.                         <a href="#" style="color:#94bb56">
  193.                             <i class="fa-brands fa-instagram" data-toggle="tooltip" title="Instagram"></i>
  194.                         </a>
  195.                        
  196.                         <a href="#" style="color:#94bb56">
  197.                             <i class="fa-brands fa-tumblr" data-toggle="tooltip" title="Tumblr"></i>
  198.                         </a>
  199.                        
  200.                         <a href="#" style="color:#94bb56">
  201.                             <i class="fa-solid fa-address-card" data-toggle="tooltip" title="Carrd"></i>
  202.                         </a>
  203.                        
  204.                     </div>
  205.                    
  206.                 </div>
  207.                
  208.                 <!--AF badges
  209.                - sourced from the artfight DA page:
  210.                https://www.deviantart.com/artyfight/gallery/73999513/official-art-fight-stamps
  211.                
  212.                Note: went up to tech vs magic for preview tidy-ness, but I'll leave the links for Mono v. Color & Hunters v. Zombies for those who participated :)
  213.                
  214.                Mono: https://rainy.s-ul.eu/TN8eUKei.png
  215.                Color: https://rainy.s-ul.eu/G1GHg9N9.png
  216.                Hunters: https://rainy.s-ul.eu/00muxmEj.png
  217.                Zombies: https://rainy.s-ul.eu/JTk9ibe8.png
  218.                
  219.                -->
  220.                 <div class="p-2 mb-3" style="text-align:center">
  221.                    
  222.                         <!--bloom-->
  223.                         <img src="https://rainy.s-ul.eu/NpTXSLWs.png">
  224.                        
  225.                         <!--steampunk-->
  226.                         <img src="https://rainy.s-ul.eu/am5jWPgm.png">
  227.                        
  228.                         <!--cyberpunk-->
  229.                         <img src="https://rainy.s-ul.eu/eLnpLqp3.png">
  230.                        
  231.                         <!--sugar-->
  232.                         <img src="https://rainy.s-ul.eu/4V7KA2L0.png">
  233.                        
  234.                         <!--spice-->
  235.                         <img src="https://i.imgur.com/pfiN94H.png">
  236.                        
  237.                         <!--dream-->
  238.                         <img src="https://rainy.s-ul.eu/TaNcNdVI.png">
  239.                        
  240.                         <!--nightmare-->
  241.                         <img src="https://rainy.s-ul.eu/EYUc1eAc.png">
  242.                        
  243.                         <!--tea-->
  244.                         <img src="https://rainy.s-ul.eu/39qc1C3c.png">
  245.                        
  246.                         <!--coffee-->
  247.                         <img src="https://rainy.s-ul.eu/LhWhupCO.png">
  248.                        
  249.                         <!--sun-->
  250.                         <img src="https://rainy.s-ul.eu/Pz3RTtiE.png">
  251.                        
  252.                         <!--moon-->
  253.                         <img src="https://rainy.s-ul.eu/S4aDvVR7.png">
  254.                        
  255.                         <!--tech-->
  256.                         <img src="https://rainy.s-ul.eu/M4W1A9VP.png">
  257.                        
  258.                         <!--magic-->
  259.                         <img src="https://rainy.s-ul.eu/rXj40OCb.png">
  260.                        
  261.                        
  262.                     </div>
  263.                    
  264.             </div>
  265.            
  266.             <!--end Bio, socials, badges-->
  267.            
  268.         </div>
  269.        
  270.         <!--end main image/intro-->
  271.        
  272.        
  273.         <!--your drawing prefrences-->
  274.        
  275.         <div class="row mb-4">
  276.            
  277.             <!--Can draw-->
  278.            
  279.             <div class="col-12 col-lg-4">
  280.                 <div class="card text-dark border-0 rounded-0 p-2 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:400px;margin-left:auto;margin-right:auto;
  281.                    background-color:#f6f8e9">
  282.                     <div class="card-body">
  283.                        
  284.                         <span style="color:#94bb56;font-size:1.5em;font-weight:bold;letter-spacing:1px;font-style:italic"><i class="fa-duotone fa-seedling"></i> I Can Draw</span>
  285.                         <hr class="my-1">
  286.                        
  287.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  288.                         <br class="mb-1">
  289.                        
  290.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  291.                         <br class="mb-1">
  292.                        
  293.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  294.                         <br class="mb-1">
  295.                        
  296.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  297.                         <br class="mb-1">
  298.                        
  299.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  300.                         <br class="mb-1">
  301.                        
  302.                     </div>
  303.                 </div>
  304.             </div>
  305.            
  306.             <!--end can draw-->
  307.            
  308.            
  309.             <!--won't draw-->
  310.            
  311.             <div class="col-12 col-lg-4">
  312.                 <div class="card text-dark border-0 rounded-0 p-2 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:400px;margin-left:auto;margin-right:auto;
  313.                    background-color:#f6f8e9">
  314.                     <div class="card-body">
  315.                        
  316.                         <span style="color:#94bb56;font-size:1.5em;font-weight:bold;letter-spacing:1px;font-style:italic"><i class="fa-duotone fa-cactus"></i> I Won't Draw</span>
  317.                         <hr class="my-1">
  318.                        
  319.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  320.                         <br class="mb-1">
  321.                        
  322.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  323.                         <br class="mb-1">
  324.                        
  325.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  326.                         <br class="mb-1">
  327.                        
  328.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  329.                         <br class="mb-1">
  330.                        
  331.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  332.                         <br class="mb-1">
  333.                        
  334.                     </div>
  335.                 </div>
  336.             </div>
  337.            
  338.             <!--end won't draw-->
  339.            
  340.            
  341.             <!--looking for (ie. designs you're looking for)-->
  342.            
  343.             <div class="col-12 col-lg-4">
  344.                 <div class="card text-dark border-0 rounded-0 p-2 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:400px;margin-left:auto;margin-right:auto;
  345.                    background-color:#f6f8e9">
  346.                     <div class="card-body">
  347.                         <span style="color:#94bb56;font-size:1.5em;font-weight:bold;letter-spacing:1px;font-style:italic"><i class="fa-solid fa-magnifying-glass"></i> Looking for...</span>
  348.                         <hr class="my-1">
  349.                        
  350.                         <span> <i class="fa-regular fa-circle"></i> Thing</span>
  351.                         <br class="mb-1">
  352.                        
  353.                         <span> <i class="fa-regular fa-circle"></i> Thing</span>
  354.                         <br class="mb-1">
  355.                        
  356.                         <span> <i class="fa-regular fa-circle"></i> Thing</span>
  357.                         <br class="mb-1">
  358.                        
  359.                         <span> <i class="fa-regular fa-circle"></i> Thing</span>
  360.                         <br class="mb-1">
  361.                        
  362.                         <span> <i class="fa-regular fa-circle"></i> Thing</span>
  363.                         <br class="mb-1">
  364.                     </div>
  365.                 </div>
  366.             </div>
  367.            
  368.             <!--end looking for-->
  369.            
  370.         </div>
  371.        
  372.         <!--end drawing prefrences-->
  373.        
  374.        
  375.         <!--featured characters header-->
  376.        
  377.         <div class="card border-0 rounded-0 p-2 mb-3 text-white" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);
  378.            background-color:#94bb56;
  379.            background-image:linear-gradient(270deg, rgba(148,187,86,1) 26%, rgba(240,236,127,1) 100%)">
  380.             <div class="card-body">
  381.                
  382.                 <span style="font-size:2em;font-style:italic;font-weight:bold;letter-spacing:1px"> <i class="fa-duotone fa-user-pen"></i> Featured Characters</span>
  383.                
  384.                 <hr style="border-width:3px;border-color:rgba(255,255,255,0.5);margin-top:1px;margin-bottom:2px">
  385.                
  386.             </div>
  387.         </div>
  388.        
  389.         <!--end featured characters header-->
  390.        
  391.        
  392.         <!--permissions/characters-->
  393.        
  394.         <div class="row">
  395.            
  396.             <!--permissions
  397.            
  398.            NOTE: looks best with breif permissions
  399.            (eg: "drawing with your ocs" instead of "I'm ok with your ocs being drawn with mine")
  400.            this column will expand if you need more room though
  401.            -->
  402.            
  403.             <div class="col-12 col-lg-3">
  404.                 <div class="card text-dark border-0 rounded-0 p-2 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:400px;margin-left:auto;margin-right:auto;
  405.                    background-color:#f6f8e9">
  406.                     <div class="card-body">
  407.                        
  408.                         <span style="color:#94bb56;font-size:1.5em;font-weight:bold;letter-spacing:1px;font-style:italic"><i class="fa-solid fa-pen"></i> Permissions</span>
  409.                        
  410.                         <!--ok-->
  411.                         <hr class="my-1">
  412.                         <span style="font-size:1.25em;font-weight:bold;letter-spacing:1px;font-style:italic"> OK</span>
  413.                         <br class="mb-1">
  414.                        
  415.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  416.                         <br class="mb-1">
  417.                        
  418.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  419.                         <br class="mb-1">
  420.                        
  421.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  422.                         <br class="mb-1">
  423.                        
  424.                         <span> <i class="fa-solid fa-check"></i> Thing</span>
  425.                         <br class="mb-1">
  426.                        
  427.                         <!--Not ok-->
  428.                         <hr class="my-1">
  429.                         <span style="font-size:1.25em;font-weight:bold;letter-spacing:1px;font-style:italic"> Not OK</span>
  430.                         <br class="mb-1">
  431.                        
  432.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  433.                         <br class="mb-1">
  434.                        
  435.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  436.                         <br class="mb-1">
  437.                        
  438.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  439.                         <br class="mb-1">
  440.                        
  441.                         <span> <i class="fa-solid fa-xmark"></i> Thing</span>
  442.                         <br class="mb-1">
  443.                        
  444.                         <!--ask-->
  445.                         <hr class="my-1">
  446.                         <span style="font-size:1.25em;font-weight:bold;letter-spacing:1px;font-style:italic"> Ask</span>
  447.                         <br class="mb-1">
  448.                        
  449.                         <span> <i class="fa-solid fa-comment"></i> Thing</span>
  450.                         <br class="mb-1">
  451.                        
  452.                         <span> <i class="fa-solid fa-comment"></i> Thing</span>
  453.                         <br class="mb-1">
  454.                        
  455.                         <span> <i class="fa-solid fa-comment"></i> Thing</span>
  456.                         <br class="mb-1">
  457.                        
  458.                         <span> <i class="fa-solid fa-comment"></i> Thing</span>
  459.                         <br class="mb-1">
  460.                        
  461.                         <!--icon key
  462.                        
  463.                        for extra info (eg: content warnings, prefered characters)
  464.                        -->
  465.                         <hr class="my-1">
  466.                         <span style="font-size:1.25em;font-weight:bold;letter-spacing:1px;font-style:italic"> Key</span>
  467.                         <br class="mb-1">
  468.                        
  469.                         <span> <i class="fa-solid fa-star"></i> Preferred</span>
  470.                         <br class="mb-1">
  471.                        
  472.                         <span> <i class="fa-solid fa-triangle-exclamation"></i> Warning</span>
  473.                         <br class="mb-1">
  474.                        
  475.                     </div>
  476.                 </div>
  477.             </div>
  478.            
  479.             <!--end permissions-->
  480.            
  481.            
  482.             <!--characters-->
  483.            
  484.             <div class="col-12 col-lg-9">
  485.                 <div class="row">
  486.                    
  487.                     <!--character 1-->
  488.                     <div class="col-12 col-sm-6 col-lg-4">
  489.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  490.                            
  491.                             <!--image-->
  492.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  493.                                background-image:url(https://via.placeholder.com/250px);
  494.                                background-size:cover;
  495.                                background-position:center">
  496.                                
  497.                                 <!--Icons-->
  498.                                 <span class="text-white" style="font-size:1.5em;position:absolute;right:10px;text-shadow:3px 3px 3px #000000;letter-spacing:1px">
  499.                                     <i class="fa-solid fa-star" data-toggle="tooltip" title="Art Prefered"></i>
  500.                                     <i class="fa-solid fa-triangle-exclamation" data-toggle="tooltip" title="Content Warnings"></i>
  501.                                 </span>
  502.                        
  503.                             </div>
  504.                    
  505.                             <!--Name/links-->
  506.                             <div class="card-body p-1" style="text-align:center">
  507.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  508.                                 <hr class="my-1">
  509.                                
  510.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  511.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  512.                                
  513.                             </div>
  514.                            
  515.                         </div>
  516.                     </div>
  517.                     <!--end character 1-->
  518.                    
  519.                    
  520.                     <!--character 2-->
  521.                     <div class="col-12 col-sm-6 col-lg-4">
  522.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  523.                            
  524.                             <!--image-->
  525.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  526.                                background-image:url(https://via.placeholder.com/250px);
  527.                                background-size:cover;
  528.                                background-position:center">
  529.                                
  530.                                 <!--Icons go here-->
  531.                                
  532.                             </div>
  533.                    
  534.                             <!--Name/links-->
  535.                             <div class="card-body p-1" style="text-align:center">
  536.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  537.                                 <hr class="my-1">
  538.                                
  539.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  540.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  541.                                
  542.                             </div>
  543.                            
  544.                         </div>
  545.                     </div>
  546.                     <!--end character 2-->
  547.                    
  548.                    
  549.                     <!--character 3-->
  550.                     <div class="col-12 col-sm-6 col-lg-4">
  551.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  552.                            
  553.                             <!--image-->
  554.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  555.                                background-image:url(https://via.placeholder.com/250px);
  556.                                background-size:cover;
  557.                                background-position:center">
  558.                                
  559.                                 <!--Icons go here-->
  560.                        
  561.                             </div>
  562.                    
  563.                             <!--Name/links-->
  564.                             <div class="card-body p-1" style="text-align:center">
  565.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  566.                                 <hr class="my-1">
  567.                                
  568.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  569.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  570.                                
  571.                             </div>
  572.                            
  573.                         </div>
  574.                     </div>
  575.                     <!--end character 3-->
  576.                    
  577.                    
  578.                     <!--character 4-->
  579.                     <div class="col-12 col-sm-6 col-lg-4">
  580.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  581.                            
  582.                             <!--image-->
  583.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  584.                                background-image:url(https://via.placeholder.com/250px);
  585.                                background-size:cover;
  586.                                background-position:center">
  587.                                
  588.                                 <!--Icons go here-->
  589.                        
  590.                             </div>
  591.                    
  592.                             <!--Name/links-->
  593.                             <div class="card-body p-1" style="text-align:center">
  594.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  595.                                 <hr class="my-1">
  596.                                
  597.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  598.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  599.                                
  600.                             </div>
  601.                            
  602.                         </div>
  603.                     </div>
  604.                     <!--end character 4-->
  605.                    
  606.                    
  607.                     <!--character 5-->
  608.                     <div class="col-12 col-sm-6 col-lg-4">
  609.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  610.                            
  611.                             <!--image-->
  612.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  613.                                background-image:url(https://via.placeholder.com/250px);
  614.                                background-size:cover;
  615.                                background-position:center">
  616.                                
  617.                                 <!--Icons go here-->
  618.                        
  619.                             </div>
  620.                    
  621.                             <!--Name/links-->
  622.                             <div class="card-body p-1" style="text-align:center">
  623.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  624.                                 <hr class="my-1">
  625.                                
  626.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  627.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  628.                                
  629.                             </div>
  630.                            
  631.                         </div>
  632.                     </div>
  633.                     <!--end character 5-->
  634.                    
  635.                    
  636.                     <!--character 6-->
  637.                     <div class="col-12 col-sm-6 col-lg-4">
  638.                         <div class="card text-dark border-0 rounded-0 mb-3" style="box-shadow: 0px 0px 10px rgba(240,236,127,0.5);max-width:220px;margin-left:auto;margin-right:auto;background-color:#f6f8e9">
  639.                            
  640.                             <!--image-->
  641.                             <div class="card border-0 rounded-0" style=";min-height:200px;
  642.                                background-image:url(https://via.placeholder.com/250px);
  643.                                background-size:cover;
  644.                                background-position:center">
  645.                                
  646.                                 <!--Icons go here-->
  647.                        
  648.                             </div>
  649.                    
  650.                             <!--Name/links-->
  651.                             <div class="card-body p-1" style="text-align:center">
  652.                                 <span style="font-size:1.5em;font-weight:bold;letter-spacing:1px"> Character name </span>
  653.                                 <hr class="my-1">
  654.                                
  655.                                 <a href="AF LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Artfight </a> -
  656.                                 <a href="TH LINK" style="color:#94bb56;font-size:1.25em;font-weight:bold;letter-spacing:1px"> Toyhouse </a>
  657.                                
  658.                             </div>
  659.                            
  660.                         </div>
  661.                     </div>
  662.                     <!--end character 6-->
  663.                    
  664.                 </div>
  665.             </div>
  666.            
  667.             <!--characters-->
  668.            
  669.         </div>
  670.        
  671.         <!--end permissions/characters-->
  672.        
  673.        
  674.         <!--Credit. You may move it, but please do not delete/remove-->
  675.        
  676.         <p class="p-1 text-dark" style="box-shadow: 1px 1px 5px rgba(0,0,0,0.5);background-color:#f6f8e9;margin:auto;box-shadow: 0px 0px 10px rgba(240,236,127,0.5);">
  677.             HTML by <a href="https://toyhou.se/16393601" style="color:#94bb56"><i class="fa-duotone fa-seedling"></i> Jade-Everstone</a> // BG - <a href="https://unsplash.com/photos/YnNczu62rdk" style="color:#94bb56"> Unsplash</a>
  678.         </p>
  679.  
  680. </div>
Advertisement
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!