[F2U] Folder Organizations

created by:BigGayFish
HTMLCustom ColorsBootstrapFolder

Line Count: 44
Difficulty:
Copy
<!--MAIN FOLDER CODE
QUICK CHANGE:
#E8E8E8 - font color
#1D1D1D - bg color
#B8000A - accent colors and links
If you want your icon to be  a circle, add -circle after rounded to it.
-->

<div class="container-fluid" style="color: #E8E8E8; font-size: 13pt; background-color: #1D1D1D; padding: 5px;">
    
    <div class="row d-flex align-items-center justify-content-center m-3">
        <div class="col-sm-3">
        <div class="card bg-transparent border-0">
            <div class="card-body text-center">
                <small><i class="fas fa-star"></i></small> <span style="font-size: 35px"><i class="fas fa-crown"></i></span> <small><i class="fas fa-star"></i></small>
            </div>
            
            <div class="card border-0 rounded-0" style="height:300px; background: url(https://f2.toyhou.se/file/f2-toyhou-se/images/29019729_4S8QP1JX9LYDKlN.png) center; background-size: contain; background-repeat: no-repeat;">
            </div>
        </div>
        </div>
        
        <div class="col-sm-9">
        <div class="card bg-transparent m-2" style="padding: 5px; border: #B8000A 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-uppercase font-weight-bold">working title:</span>  <span class="pull-right">Title_Here</span></div>
            </div>
            
            <div class="card bg-transparent m-2" style="padding: 5px; border: #B8000A 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-uppercase font-weight-bold">Project Type:</span>  <span class="pull-right">Type_Here</span></div>
            </div>
            
            <div class="card bg-transparent m-2" style="padding: 5px; border: #B8000A 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-uppercase font-weight-bold">Summary:</span>  
                <br>
                <p>This is your folder description. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam maximus neque enim, ut placerat mi rhoncus nec. Nam efficitur eget arcu vel ultrices. Pellentesque et est nec quam fringilla pulvinar. Nunc dignissim venenatis quam ac vulputate. Etiam nec nunc a dui porta laoreet nec eget nulla. Aliquam at tristique ipsum, nec sodales eros. Suspendisse potenti.Nullam sed diam lorem. Integer bibendum pharetra dolor, non ultrices turpis ornare et. In dictum facilisis lectus, in ultricies nisi.</p></div>
            </div>
            
            <div class="card bg-transparent m-2" style="padding: 5px; border: #B8000A 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-uppercase font-weight-bold">Notes:</span>  
                <br>
                <ul>
                    <li>Content</li>
                    <li>Content</li>
                    <li>Content</li>
                    <li>Content</li>
                </ul></div>
            </div>
        </div>
    </div>
<a href="https://toyhou.se/BigGayFish" style="color: #B8000A; font-weight: bold;" class="m-2"><small><i class="fas fa-copyright"></i> BigGayFish</small></a>
</div>
Copy
<!--MAIN FOLDER CODE
If you want your icon to be  a circle, add -circle after rounded to it.
-->
 
<div class="container-fluid bg-faded text-muted" style="font-size: 13pt; padding: 5px;">
 
    <div class="row d-flex align-items-center justify-content-center m-3">
        <div class="col-sm-3">
        <div class="card bg-transparent " style="border: transparent;">
            <div class="card-body text-center">
                <small><i class="fas fa-star"></i></small> <span style="font-size: 35px"><i class="fas fa-crown"></i></span> <small><i class="fas fa-star"></i></small>
            </div>
            
            <div class="card border-0 rounded-0" style="height:300px; background: url(https://dummyimage.com/300/ffffff/000000) center; background-size: contain; background-repeat: no-repeat;">
            </div>
        </div>
        </div>
 
        <div class="col-sm-9">
        <div class="card bg-transparent m-2" style="padding: 5px; border: 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-primary text-uppercase font-weight-bold">working title:</span>  <span class="pull-right">Title_Here</span></div>
            </div>
 
            <div class="card bg-transparent m-2" style="padding: 5px; border: 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-primary text-uppercase font-weight-bold">Project Type:</span>  <span class="pull-right">Type_Here</span></div>
            </div>
 
            <div class="card bg-transparent m-2" style="padding: 5px; border: 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-primary text-uppercase font-weight-bold">Summary:</span>  
                <br>
                <p>This is your folder description. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam maximus neque enim, ut placerat mi rhoncus nec. Nam efficitur eget arcu vel ultrices. Pellentesque et est nec quam fringilla pulvinar. Nunc dignissim venenatis quam ac vulputate. Etiam nec nunc a dui porta laoreet nec eget nulla. Aliquam at tristique ipsum, nec sodales eros. Suspendisse potenti.Nullam sed diam lorem. Integer bibendum pharetra dolor, non ultrices turpis ornare et. In dictum facilisis lectus, in ultricies nisi.</p></div>
            </div>
 
            <div class="card bg-transparent m-2" style="padding: 5px; border: 1px solid;">
                <div class="card-text m-1"> <span class="pull-left text-primary text-uppercase font-weight-bold">Notes:</span>  
                <br>
                <ul>
                    <li>Content</li>
                    <li>Content</li>
                    <li>Content</li>
                    <li>Content</li>
                </ul></div>
            </div>
        </div>
    </div>
<a href="https://toyhou.se/BigGayFish" style="font-weight: bold;" class="m-2"><small><i class="fas fa-copyright"></i> BigGayFish</small></a>
</div>
Copy
<!--SUBFOLDER / SIMPLIFIED FOLDER CODE
QUICK CHANGE:
#E8E8E8 - font color
#1D1D1D - bg color
#B8000A - accent colors and links
If you want your icon to be  square, delete -circle from it.
-->
<div class="container-fluid" style="color: #E8E8E8; font-size: 13pt; background-color: #1D1D1D; padding: 5px;">
    
    <div class="row d-flex align-items-center justify-content-center m-3">
        <div class="col-sm-3 mb-3">
        <div class="card bg-transparent border-0">
            <div class="card-body text-center">
                <small><i class="fas fa-star"></i></small> <span style="font-size: 35px"><i class="fas fa-crown"></i></span> <small><i class="fas fa-star"></i></small>
            </div>
            
            <div class="card rounded-circle border-0" style="height:300px; background: url(https://f2.toyhou.se/file/f2-toyhou-se/images/29019729_4S8QP1JX9LYDKlN.png) center; background-size: cover; background-repeat: no-repeat;">
            </div>
        </div>
        </div>
        
        <div class="col-sm-9">
        <div class="card bg-transparent" style="border: #B8000A 1px solid; padding: 5px;">
            <div class="card-body m-3">
                <h2 class="text-uppercase text-center font-weight-bold">Sub Folder Name</h2>
                
                <p>This is your folder description. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam maximus neque enim, ut placerat mi rhoncus nec. Nam efficitur eget arcu vel ultrices. Pellentesque et est nec quam fringilla pulvinar. Nunc dignissim venenatis quam ac vulputate. Etiam nec nunc a dui porta laoreet nec eget nulla. Aliquam at tristique ipsum, nec sodales eros. Suspendisse potenti.Nullam sed diam lorem. Integer bibendum pharetra dolor, non ultrices turpis ornare et. In dictum facilisis lectus, in ultricies nisi.</p>
                
                <center class="mt-2">
                    <a class="btn btn-sm m-1" href="#" role="button" style="background-color: #B8000A; color: #E8E8E8;">Link</a>
                    <a class="btn btn-sm m-1" href="#" role="button" style="background-color: #B8000A; color: #E8E8E8;">Link</a>
                    <a class="btn btn-sm m-1" href="#" role="button" style="background-color: #B8000A; color: #E8E8E8;">Link</a>
                    <a class="btn btn-sm m-1" href="#" role="button" style="background-color: #B8000A; color: #E8E8E8;">Link</a>
                </center>
            </div>
        </div>
        </div>
    </div>
    <a href="https://toyhou.se/BigGayFish" style="color: #B8000A; font-weight: bold;" class="m-2"><small><i class="fas fa-copyright"></i> BigGayFish</small></a>
</div>
Copy
<!--SUBFOLDER / SIMPLIFIED FOLDER CODE
If you want your icon to be  square, delete -circle from it.
-->
<div class="container-fluid bg-faded text-muted" style="font-size: 13pt; padding: 5px;">
 
    <div class="row d-flex align-items-center justify-content-center m-3">
        <div class="col-sm-3 mb-3">
        <div class="card bg-transparent " style="border: transparent;">
            <div class="card-body text-center">
                <small><i class="fas fa-star"></i></small> <span style="font-size: 35px"><i class="fas fa-crown"></i></span> <small><i class="fas fa-star"></i></small>
            </div>
 
            <div class="card border-0 rounded-circle" style="height:300px; background: url(https://dummyimage.com/300/ffffff/000000) center; background-size: cover; background-repeat: no-repeat;">
            </div>
        </div>
        </div>
 
        <div class="col-sm-9">
        <div class="card bg-transparent" style="border: 1px solid; padding: 5px;">
            <div class="card-body m-3">
                <h2 class="text-uppercase text-primary text-center font-weight-bold">Sub Folder Name</h2>
 
                <p>This is your folder description. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam maximus neque enim, ut placerat mi rhoncus nec. Nam efficitur eget arcu vel ultrices. Pellentesque et est nec quam fringilla pulvinar. Nunc dignissim venenatis quam ac vulputate. Etiam nec nunc a dui porta laoreet nec eget nulla. Aliquam at tristique ipsum, nec sodales eros. Suspendisse potenti.Nullam sed diam lorem. Integer bibendum pharetra dolor, non ultrices turpis ornare et. In dictum facilisis lectus, in ultricies nisi.</p>
 
                <center class="mt-2">
                    <a class="btn btn-primary btn-sm m-1" href="#" role="button">Link</a>
                    <a class="btn btn-primary btn-sm m-1" href="#" role="button">Link</a>
                    <a class="btn btn-primary btn-sm m-1" href="#" role="button">Link</a>
                    <a class="btn btn-primary btn-sm m-1" href="#" role="button">Link</a>
                </center>
            </div>
        </div>
        </div>
    </div>
    <a href="https://toyhou.se/BigGayFish" style="font-weight: bold;" class="m-2"><small><i class="fas fa-copyright"></i> BigGayFish</small></a>
</div>

Password (optional)

Users must enter a password before unlocking this specific version. Please note that this password will only apply to this version.