Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
You must create an account or log in to edit.

Template:Character Relationship Box/styles.css: Difference between revisions

Template page
Content deleted Content added
No edit summary
No edit summary
Line 1: Line 1:
.character-relationship-box {
.character-relationship-box {
display: block;
display: block;
border: 2px solid #137dc4;
border: 2px solid #137dc4;
border-radius: 15px;
border-radius: 15px;
background: linear-gradient(180deg, #2e0e19 0%, #1c070f 100%);
background: linear-gradient(180deg, #2e0e19 0%, #1c070f 100%);
padding: 15px;
padding: 15px;
max-width: 750px;
max-width: 750px;
width: 100%;
width: 100%;
font-family: Varela Round, sans-serif;
font-family: Varela Round, sans-serif;
color: #e2d1e5;
color: #e2d1e5;
position: relative;
position: relative;
box-sizing: border-box;
box-sizing: border-box;
box-shadow: 0 0 12px #137dc4;
box-shadow: 0 0 12px #137dc4;
overflow: hidden;
overflow: hidden;
}
}


.character-relationship-box-image {
.character-relationship-box-image {
position: absolute;
position: absolute;
top: 15px;
top: 15px;
right: 15px;
right: 15px;
width: 90px;
height: auto;
}
}


.character-relationship-box-hearts {
.character-relationship-box-hearts {
display: block;
display: block;
font-size: 130%;
font-size: 130%;
font-weight: bold;
font-weight: bold;
color: #a38bd3;
color: #a38bd3;
margin-top: 0;
margin-top: 0;
margin-right: 100px;
margin-right: 100px;
}
}


.character-relationship-box-section {
.character-relationship-box-section {
display: block;
display: block;
font-weight: bold;
font-weight: bold;
color: #c7b5e5;
color: #c7b5e5;
margin-top: 5px;
margin-top: 10px;
}

/* ==========================
Optional Small Version (if needed in future)
========================== */

.character-relationship-box-small {
max-width: 500px;
font-size: 90%;
}

.character-relationship-box-small .character-relationship-box-hearts {
font-size: 110%;
}
}

Revision as of 21:27, May 1, 2025

.character-relationship-box {
    display: block;
    border: 2px solid #137dc4;
    border-radius: 15px;
    background: linear-gradient(180deg, #2e0e19 0%, #1c070f 100%);
    padding: 15px;
    max-width: 750px;
    width: 100%;
    font-family: Varela Round, sans-serif;
    color: #e2d1e5;
    position: relative;
    box-sizing: border-box;
    box-shadow: 0 0 12px #137dc4;
    overflow: hidden;
}

.character-relationship-box-image {
    position: absolute;
    top: 15px;
    right: 15px;
}

.character-relationship-box-hearts {
    display: block;
    font-size: 130%;
    font-weight: bold;
    color: #a38bd3;
    margin-top: 0;
    margin-right: 100px;
}

.character-relationship-box-section {
    display: block;
    font-weight: bold;
    color: #c7b5e5;
    margin-top: 10px;
}