API tools faq
paste
Advertisement
CrispinAsheYA

Warning Mark 2 (Bootstrap)

CrispinAsheYA
Jan 5th, 2023 (edited)
150
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 11.20 KB | Source Code | 0 0
raw download clone embed print report
  1. <!----- PLEASE SEE HERE FOR MY CODE RULES: https://toyhou.se/12931952.bonus-content/17036656.-06-code-rules -----
  2.  
  3. Version: 1.0
  4.  
  5. Default Colours
  6. -Text White: #FFFFFF
  7. -Border Black: #000000
  8. -Font Awesome Icons: fas fa-triangle-exclamation
  9.  
  10. Thank you for reading!
  11. Crispin
  12.  
  13. -->
  14.  
  15.  
  16.   <!------------------------------- START ACTUAL CODE -------------------------------->
  17.   <div class="col-12 p-0" style="font-family:'comic sans ms';">
  18.    
  19.     <!------------------------------- START HEADING -------------------------------->
  20.     <div class="col-12 p-0 m-0 rounded-0" style="border:#000000 8px solid; border-bottom:none;">
  21.       <div class="py-2 bg-faded border-0 rounded-0 text-center" style="font-size:1.6rem;">
  22.         <a href="https://toyhou.se/19566907.warning-mark-2" data-toggle="tooltip" title="Code: TomcatCodes / CrispinAsheYA" data-original-title="Code: TomcatCodes / CrispinAsheYA"><span style="color:#FFFFFF;"><i class="fas fa-triangle-exclamation"></i></span></a>
  23.         Warning!
  24.         <a href="https://unsplash.com/photos/Oz2ZQ2j8We8" data-toggle="tooltip" title="Image: Johnny Goerend" data-original-title="Image: Source"><span style="color:#FFFFFF;"><i class="fas fa-triangle-exclamation"></i></span></a>
  25.       </div>
  26.     </div>
  27.     <!------------------------------- END HEADING -------------------------------->
  28.    
  29.    
  30.     <!------------------------------- START BUTTONS -------------------------------->
  31.     <div class="col-12 p-0" style="border:#000000 4px solid; border-bottom:none;">
  32.       <ul class="nav nav-tabs card-header-tabs row p-0 m-0" style="text-align:center;">
  33.         <li class="col-12 col-lg-6 nav-item p-0 m-0 bg-primary"><a class="nav-link px-0" data-toggle="tab" href="#warning" style="color:#FFFFFF; border:#000000 4px solid; border-radius:0px;">Warning</a></li>
  34.         <li class="col-12 col-lg-6 nav-item p-0 m-0 bg-primary"><a class="nav-link px-0" data-toggle="tab" href="#warning2" style="color:#FFFFFF; border:#000000 4px solid; border-radius:0px;">Content</a></li>
  35.       </ul>
  36.     </div>
  37.     <!------------------------------- END BUTTONS -------------------------------->
  38.    
  39.     <!------------------------------- START BODY -------------------------------->
  40.     <div class="col-lg-12 mx-auto p-0 row" style="border:#000000 8px solid; border-top:none;">
  41.       <div class="col-12 p-0" style="border:none;">
  42.         <div class="tab-content" style="height:400px; overflow:auto;">
  43.          
  44.           <!------------------------------- START WARNING / TAB 1 -------------------------------->
  45.           <div class="tab-pane active show" id="warning">
  46.             <div class="card-body p-3" style="max-height:675px;">
  47.               <div class="row">
  48.                
  49.                 <!----- START IMAGE ----->
  50.                 <div class="col-md-4">
  51.                   <div class="card bg-transparent mx-auto border-0 rounded-0" style="background:url('https://images.unsplash.com/photo-1507908708918-778587c9e563?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxzZWFyY2h8NXx8dHVycXVvaXNlfGVufDB8fDB8fA%3D%3D&auto=format&fit=crop&w=600&q=60') center; background-size:cover; background-repeat:no-repeat; height:300px; width:300px;"></div>
  52.                 </div>
  53.                 <!----- START IMAGE ----->
  54.                
  55.                 <div class="d-block d-md-none p-2"></div>
  56.                
  57.                 <!----- START TEXT ----->
  58.                 <div class="col-md-8">
  59.                   <div class="p-1" style="background:transparent; font-size:1.2rem;">
  60.                     <p>This character contains information, art, themes, motifs, etc, that some people may find disturbing.</p>
  61.                     <p>Click the "Content" button above for a list of specific warnings.</p>
  62.                     <p>Viewer Discretion is advised. Proceed at your own risk.</p>
  63.                   </div>
  64.                 </div>
  65.                 <!----- END TEXT ----->
  66.                
  67.               </div>
  68.             </div>
  69.           </div>
  70.           <!------------------------------- END WARNING / TAB 1 -------------------------------->
  71.          
  72.           <!------------------------------- START WARNING / TAB 2 -------------------------------->
  73.           <div class="tab-pane fade" id="warning2">
  74.             <div class="card-body p-3" style="max-height:675px;">
  75.                
  76.               <!-- Feel free to remove the ones that don't fit your scenario at your own leisure! You may add some not already here too! -->
  77.              
  78.               <!----- START MENTIONS ----->
  79.               <p class="text-primary" style="font-size:1.4rem;">This Character's Profile Contains Mentions Of...</p><hr class="mt-1 mb-2">
  80.               <ul>
  81.                 <li>Ableism</li>
  82.                 <li>Addiction</li>
  83.                 <li>Alcoholism</li>
  84.                 <li>Animal Cruelty</li>
  85.                 <li>Anti-Semitism</li>
  86.                 <li>Blood (Minor)</li>
  87.                 <li>Blood / Gore</li>
  88.                 <li>Body-Horror</li>
  89.                 <li>Bright Colours</li>
  90.                 <li>Car-Crashes</li>
  91.                 <li>Child Abuse</li>
  92.                 <li>Child Death</li>
  93.                 <li>Cults</li>
  94.                 <li>Character Death</li>
  95.                 <li>Depression</li>
  96.                 <li>Dissosciation</li>
  97.                 <li>Disordered Eating</li>
  98.                 <li>Drug Use</li>
  99.                 <li>Emotional Abuse</li>
  100.                 <li>Eye Injury</li>
  101.                 <li>Fatal Illness</li>
  102.                 <li>Fire</li>
  103.                 <li>Gun-Usage</li>
  104.                 <li>Homophobia</li>
  105.                 <li>Insects</li>
  106.                 <li>Islamophobia</li>
  107.                 <li>Lobotomisation</li>
  108.                 <li>Misandry</li>
  109.                 <li>Miscarriages</li>
  110.                 <li>Misogyny</li>
  111.                 <li>Murder</li>
  112.                 <li>Natural Disasters</li>
  113.                 <li>Needles</li>
  114.                 <li>NSFW Content</li>
  115.                 <li>Nudity</li>
  116.                 <li>Physical Abuse</li>
  117.                 <li>Racism</li>
  118.                 <li>Religious Trauma</li>
  119.                 <li>Self Harm</li>
  120.                 <li>Sexual Abuse</li>
  121.                 <li>Sex Work</li>
  122.                 <li>Smoking</li>
  123.                 <li>Stalking</li>
  124.                 <li>Suicide</li>
  125.                 <li>Surgeries</li>
  126.                 <li>Transphobia</li>
  127.                 <li>Unreality</li>
  128.                 <li>Verbal Abuse</li>
  129.                 <li>War</li>
  130.               </ul>
  131.               <!----- END MENTIONS ----->
  132.              
  133.               <!----- START GRAPHIC MENTIONS ----->
  134.               <p class="text-primary" style="font-size:1.4rem;">This Character's Profile Contains Graphic Depictions Of...</p><hr class="mt-1 mb-2">
  135.               <ul>
  136.                 <li>Ableism</li>
  137.                 <li>Addiction</li>
  138.                 <li>Alcoholism</li>
  139.                 <li>Animal Cruelty</li>
  140.                 <li>Anti-Semitism</li>
  141.                 <li>Blood (Minor)</li>
  142.                 <li>Blood / Gore</li>
  143.                 <li>Body-Horror</li>
  144.                 <li>Bright Colours</li>
  145.                 <li>Car-Crashes</li>
  146.                 <li>Child Abuse</li>
  147.                 <li>Child Death</li>
  148.                 <li>Cults</li>
  149.                 <li>Character Death</li>
  150.                 <li>Depression</li>
  151.                 <li>Dissosciation</li>
  152.                 <li>Disordered Eating</li>
  153.                 <li>Drug Use</li>
  154.                 <li>Emotional Abuse</li>
  155.                 <li>Eye Injury</li>
  156.                 <li>Fatal Illness</li>
  157.                 <li>Fire</li>
  158.                 <li>Gun-Usage</li>
  159.                 <li>Homophobia</li>
  160.                 <li>Insects</li>
  161.                 <li>Islamophobia</li>
  162.                 <li>Lobotomisation</li>
  163.                 <li>Misandry</li>
  164.                 <li>Miscarriages</li>
  165.                 <li>Misogyny</li>
  166.                 <li>Murder</li>
  167.                 <li>Natural Disasters</li>
  168.                 <li>Needles</li>
  169.                 <li>NSFW Content</li>
  170.                 <li>Nudity</li>
  171.                 <li>Physical Abuse</li>
  172.                 <li>Racism</li>
  173.                 <li>Religious Trauma</li>
  174.                 <li>Self Harm</li>
  175.                 <li>Sexual Abuse</li>
  176.                 <li>Sex Work</li>
  177.                 <li>Smoking</li>
  178.                 <li>Stalking</li>
  179.                 <li>Suicide</li>
  180.                 <li>Surgeries</li>
  181.                 <li>Transphobia</li>
  182.                 <li>Unreality</li>
  183.                 <li>Verbal Abuse</li>
  184.                 <li>War</li>
  185.               </ul> <!-- End Warnings List -->
  186.              
  187.               <!----- END GRAPHIC DEPICTIONS ----->
  188.              
  189.               <!----- START VISUALS ----->
  190.               <p class="text-primary" style="font-size:1.4rem;">This Character's Gallery Contains Scenes Of...</p><hr class="mt-1 mb-2">
  191.               <ul>
  192.                 <li>Ableism</li>
  193.                 <li>Addiction</li>
  194.                 <li>Alcoholism</li>
  195.                 <li>Animal Cruelty</li>
  196.                 <li>Anti-Semitism</li>
  197.                 <li>Blood (Minor)</li>
  198.                 <li>Blood / Gore</li>
  199.                 <li>Body-Horror</li>
  200.                 <li>Bright Colours</li>
  201.                 <li>Candy-Gore</li>
  202.                 <li>Car-Crashes</li>
  203.                 <li>Child Abuse</li>
  204.                 <li>Child Death</li>
  205.                 <li>Cults</li>
  206.                 <li>Character Death</li>
  207.                 <li>Depression</li>
  208.                 <li>Dissosciation</li>
  209.                 <li>Disordered Eating</li>
  210.                 <li>Drug Use</li>
  211.                 <li>Emotional Abuse</li>
  212.                 <li>Eye Injury</li>
  213.                 <li>Fatal Illness</li>
  214.                 <li>Fire</li>
  215.                 <li>Flashing Lights</li>
  216.                 <li>Gun-Usage</li>
  217.                 <li>Homophobia</li>
  218.                 <li>Illness</li>
  219.                 <li>Islamophobia</li>
  220.                 <li>Lobotomisation</li>
  221.                 <li>Misandry</li>
  222.                 <li>Miscarriages</li>
  223.                 <li>Misogyny</li>
  224.                 <li>Murder</li>
  225.                 <li>Natural Disasters</li>
  226.                 <li>Needles</li>
  227.                 <li>NSFW Content</li>
  228.                 <li>Nudity</li>
  229.                 <li>Physical Abuse</li>
  230.                 <li>Racism</li>
  231.                 <li>Religious Trauma</li>
  232.                 <li>Self Harm</li>
  233.                 <li>Sexual Abuse</li>
  234.                 <li>Sex Work</li>
  235.                 <li>Smoking</li>
  236.                 <li>Stalking</li>
  237.                 <li>Suicide</li>
  238.                 <li>Surgeries</li>
  239.                 <li>Transphobia</li>
  240.                 <li>Unreality</li>
  241.                 <li>Verbal Abuse</li>
  242.                 <li>War</li>
  243.               </ul> <!-- End Warnings List -->
  244.              
  245.               <!----- END VISUALS ----->
  246.              
  247.             </div>
  248.           </div>
  249.           <!------------------------------- END WARNING / TAB 2 -------------------------------->
  250.          
  251.         </div>
  252.       </div>
  253.     </div>
  254.     <!------------------------------- END BODY -------------------------------->
  255.  
  256.    
  257.   </div>
  258.   <!------------------------------- END ACTUAL CODE -------------------------------->
  259.  
  260. </div> <!-- End Background -->
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!