API tools faq
paste
Advertisement
accidentphilosophy

[CODE] Database

accidentphilosophy
Jan 30th, 2021
9
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 9.95 KB | None | 0 0
raw download clone embed print report
  1. <div style="margin:5% 20%;font-family:monospace;">
  2.  
  3.     <div class="row no-gutters">
  4.    
  5.         <div class="col-lg-4">
  6.             <div class="card" data-toggle="tooltip" data-placement="bottom" title="IMAGE SRC HERE"  style="border-radius:0px;height:100%;min-height:25em;
  7.            background-image: url('https://i.pinimg.com/564x/09/7c/61/097c61d02683c4ee060ce62f2d77f965.jpg');
  8.            background-repeat: no-repeat;
  9.            background-position: center;
  10.            background-size: cover;
  11.            ">
  12.             </div>
  13.         </div>
  14.    
  15.         <div class="col-lg-8">
  16.             <div class="card" style="border-radius:0px;height:100%;max-height:25em;overflow:auto;">
  17.                 <div class="card-block">
  18.          
  19.                     <h1 style="text-align:center;font-variant:small-caps;margin-bottom:1em;">Full Name</h1>
  20.                    
  21.                     <div class="row" style="text-align:center;">
  22.                      
  23.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  24.                             <span class="w-50" style="text-transform:uppercase;">Age:</span>
  25.                             <span class="w-50">text</span>
  26.                         </div>
  27.                      
  28.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  29.                             <span class="w-50" style="text-transform:uppercase;">Age:</span>
  30.                             <span class="w-50">text</span>
  31.                         </div>
  32.                        
  33.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  34.                             <span class="w-50" style="text-transform:uppercase;">AGE:</span>
  35.                             <span class="w-50">text</span>
  36.                         </div>
  37.                      
  38.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  39.                             <span class="w-50" style="text-transform:uppercase;">PRONOUNS:</span>
  40.                             <span class="w-50">text</span>
  41.                         </div>
  42.                        
  43.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  44.                             <span class="w-50" style="text-transform:uppercase;">LOCATION:</span>
  45.                             <span class="w-50">text</span>
  46.                         </div>
  47.                      
  48.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  49.                             <span class="w-50" style="text-transform:uppercase;">OCCUPATION:</span>
  50.                             <span class="w-50">text</span>
  51.                         </div>
  52.                        
  53.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  54.                             <span class="w-50" style="text-transform:uppercase;">HERITAGE:</span>
  55.                             <span class="w-50">text</span>
  56.                         </div>
  57.                      
  58.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  59.                             <span class="w-50" style="text-transform:uppercase;">WORLD:</span>
  60.                             <span class="w-50">text</span>
  61.                         </div>
  62.                        
  63.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  64.                             <span class="w-50" style="text-transform:uppercase;">EYE CLR:</span>
  65.                             <span class="w-50">text</span>
  66.                         </div>
  67.                      
  68.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  69.                             <span class="w-50" style="text-transform:uppercase;">HAIR CLR:</span>
  70.                             <span class="w-50">text</span>
  71.                         </div>
  72.                        
  73.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  74.                             <span class="w-50" style="text-transform:uppercase;">HEIGHT:</span>
  75.                             <span class="w-50">text</span>
  76.                         </div>
  77.                      
  78.                         <div class="col-md-6 p-1 justify-content-center" style="margin:0.5em 0em;">
  79.                             <span class="w-50" style="text-transform:uppercase;">WEIGHT:</span>
  80.                             <span class="w-50">text</span>
  81.                         </div>
  82.                      
  83.                     </div>
  84.          
  85.                 </div>
  86.             </div>
  87.         </div>
  88.    
  89.     </div>
  90.    
  91.    
  92.    
  93.     <div class="row no-gutters" style="overflow:auto;">
  94.      
  95.         <div class="col-lg-4">
  96.             <div class="card" style="border-radius:0px;height:100%;max-height:15em;">
  97.                 <div class="card-block">
  98.                    
  99.                     <h3>> POSITIVE TRAITS</h3>
  100.                    
  101.                     <ul>
  102.                         <li>text</li>
  103.                         <li>text</li>
  104.                         <li>text</li>
  105.                         <li>text</li>
  106.                         <li>text</li>
  107.                     </ul>
  108.                    
  109.                 </div>
  110.             </div>
  111.         </div>
  112.        
  113.         <div class="col-lg-4">
  114.             <div class="card" style="border-radius:0px;height:100%;max-height:15em;">
  115.                 <div class="card-block">
  116.                    
  117.                     <h3>> NEGATIVE TRAITS</h3>
  118.                    
  119.                     <ul>
  120.                         <li>text</li>
  121.                         <li>text</li>
  122.                         <li>text</li>
  123.                         <li>text</li>
  124.                         <li>text</li>
  125.                     </ul>
  126.                    
  127.                 </div>
  128.             </div>
  129.         </div>
  130.        
  131.         <div class="col-lg-4">
  132.             <div class="card" style="border-radius:0px;height:100%;max-height:15em;">
  133.                 <div class="card-block">
  134.                    
  135.                     <h3>> NEUTRAL TRAITS</h3>
  136.                    
  137.                     <ul>
  138.                         <li>text</li>
  139.                         <li>text</li>
  140.                         <li>text</li>
  141.                         <li>text</li>
  142.                         <li>text</li>
  143.                     </ul>
  144.                    
  145.                 </div>
  146.             </div>
  147.         </div>
  148.      
  149.     </div>
  150.  
  151.  
  152.  
  153.     <div class="row no-gutters" style="height:30em;overflow:auto;">
  154.      
  155.         <div class="col-12">
  156.             <div class="card" style="border-radius:0px;height:100%;">
  157.                 <div class="card-block">
  158.                    
  159.                     <h1 style="font-variant:small-caps;margin-bottom:1em;">> Info</h1>
  160.                    
  161.                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris nec est libero. Fusce at lacus vel tellus finibus consequat nec id odio. Curabitur nec arcu volutpat, fringilla justo et, imperdiet ante. Sed non odio eget orci interdum fringilla. Ut ac leo nec lectus semper accumsan. Ut accumsan porttitor bibendum. Proin ut placerat mi, sollicitudin fringilla neque. Aenean feugiat lobortis elit, id elementum quam feugiat a. Nulla facilisi. Donec ut orci ac nunc ornare viverra congue sit amet dui. Interdum et malesuada fames ac ante ipsum primis in faucibus. Mauris pulvinar varius sem sollicitudin varius.</p>
  162.                     <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Mauris vitae nulla pulvinar, congue risus non, feugiat nibh. Nulla posuere efficitur dui, a malesuada mi venenatis id. Proin sit amet tincidunt ex, sed tincidunt mauris. Donec turpis massa, volutpat ac eleifend sit amet, efficitur id dui. Sed sed neque non libero pulvinar eleifend. Morbi at rutrum purus. Integer magna dolor, accumsan a tortor ut, hendrerit mattis lorem.</p>
  163.                     <p>Pellentesque sed metus congue, dapibus sem et, vulputate purus. Cras faucibus lacus quis est bibendum, in laoreet nisi consectetur. Aliquam et felis pharetra, vehicula leo eget, fringilla nibh. Donec quis consequat erat. Aliquam blandit augue accumsan mi sagittis bibendum. Proin congue tellus nunc, a sodales ligula consequat elementum. Curabitur fermentum nisi et pretium fermentum.</p>
  164.                     <p>In hac habitasse platea dictumst. Nunc lorem ligula, efficitur vel ultricies vel, varius ac ipsum. Quisque at sem ac quam volutpat posuere ac at urna. In non fermentum magna, ut blandit sapien. Aliquam interdum tellus at finibus feugiat. Fusce sodales pulvinar dapibus. Aliquam molestie venenatis purus non aliquam. Curabitur aliquet finibus tortor sed euismod. Aliquam erat volutpat. Vestibulum mauris risus, euismod sit amet iaculis id, sodales et diam. Donec porta augue sed augue porttitor egestas. Duis vitae pretium nibh. Morbi eget massa nec libero tempor vehicula elementum sed eros. Sed dignissim, augue non scelerisque bibendum, purus felis varius urna, non pretium nunc diam quis metus. Ut non elementum justo.</p>
  165.                     <p>Aenean eu mauris eget mi volutpat malesuada. Suspendisse viverra efficitur malesuada. Sed quis purus feugiat ex ornare pharetra quis quis lectus. Fusce consectetur posuere tristique. Vivamus velit nulla, pharetra ac lacinia eget, maximus a velit. Suspendisse sit amet dapibus dolor. Donec sed fermentum nibh. Mauris at congue metus, at condimentum felis. Donec lacinia urna quis lectus ornare hendrerit. Vivamus facilisis congue tellus, at scelerisque libero faucibus non. Sed in libero quam.</p>
  166.                  
  167.                 </div>
  168.             </div>
  169.         </div>
  170.      
  171.     </div>
  172.  
  173.  
  174.  
  175.   <p style="text-align:right;font-size:0.9em;">code created by <a href="https://toyhou.se/accidentphilosophy">accidentphilosophy</a></p>
  176.  
  177. </div>
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!