Danganronpa 2 - e-Handbook

Tags: danganronpa, komaeda, gif, digital, anime, animation

Description:

Theme based off of the e-Handbook and main menu from Danganronpa 2. The gradient in the background is actually based off of the loading screen, and it's the only gradient in the code so you should be able to change those colors if you ctl+f for "linear-gradient". Delete the 'cursor' line from the CSS if you don't like the reticle. Unfortunately, my code was really messy, so I might clean it up SOMETIME but I'm not in the mood to yet. Also, if you have any suggestions on elements to add to the theme, tell me! I'd add more if I could think of things to add, but I'm at a loss. Also, if you'd like a music player for the theme, here's a youtube player themed after the game ui!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Groonklie (https://layouts.spacehey.com/layout?id=30566) -->

<style>
       @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800;900&family=Darumadrop+One&display=swap');
</style>
<style>
        .grid-container {
            display: grid;
            width: 100%;
            grid-template-columns: 100px 100px 100px;
            image-rendering: crisp;
        }
</style>
<style>
    body {
        background-color: #277fd0;
        background-image: url("https://groonklie.com/spacehey-junk/dangan/dangan2-menubg-tall.PNG"), url("https://groonklie.com/spacehey-junk/dangan/midgrid.PNG"), linear-gradient(#f8c802, #8fc978, #0261f5);
        background-position-y: bottom, 0%, center;
        background-size: auto;
        background-repeat: repeat-x, repeat, no-repeat;
        background-attachment: fixed;
        animation: menupan 20s linear infinite;
        font-family: 'Noto Sans', Verdana, arial, sans-serif, helvetica;
        cursor: url(https://groonklie.com/spacehey-junk/dangan/dangan2-cursor.PNG) 16 18, auto;
    }
    @keyframes menupan {
        from{ background-position-x: 0px, 0, 0; }
        to{ background-position-x: 960px, 0, 0; }
    }
    main {
        background: #1230 url("https://groonklie.com/spacehey-junk/dangan/lilgrid.PNG") !important;
    }
    nav { color: black !important; }
    nav .links a, nav .links .special a, .logout-btn { color: black; text-shadow: none; }
    nav .links a:hover, .logout-btn a:hover { color: red; }
    nav .top { background: #ddd9b7; }
    .logo { filter: brightness(0%); }
    nav .links { background-color: #ffe400; }
    container { background-color: #DDD9B7 !important; }
    footer { background-image: url("https://groonklie.com/spacehey-junk/dangan/dangan2-chatbanner.PNG"); background-color: #0000;}
    p { color: white; }
    a {
        color: #62d8ef;
        transition: color .1s steps(2,end);
    }
    a:hover, .count { color: #f0f; }
    .table-section, .url-info, .contact, main, footer { border: solid #fff6 2px !important; }
    .profile { background: #333c !important; }
    .details-table {
        background-image: url("https://groonklie.com/spacehey-junk/dangan/lilgrid.PNG");
        background-color: #000; image-rendering: pixelated;
    }
    .details-table td {
        background: #fff3 !important;
        color: white;
        font-weight: 700;
        border: solid black 2px;
    }
    .online:before { content:url("https://64.media.tumblr.com/436e881a6b8377a50f562928ea7e8f6d/94c38bbf0380f0e0-f3/s75x75_c1/29c9fa2ec099ab0a629d9830edd5fcfbc4973460.png"); }
    @keyframes flicker { from { opacity:1; } to { opacity:0.6; } }
    .online { color: #33ff98; }
    .details-table p {
        text-shadow: -1px 1px 1px #0009;
    }
    .details-table em {
        font-style: normal;
        color: #fbe300;
    }
    .details-table td:first-child {
        writing-mode: vertical-lr;
        text-align: right;
        width: fit-content;
        padding: 16px;
    }
    .profile-pic img, .friends img {
        border: solid black 2px;
        background: #0006 url("https://groonklie.com/spacehey-junk/dangan/lilgrid.PNG");
    }
    .profile-info { border: 2px solid #fff3; background-color: #6663; }
    .heading, .details-table td:first-child {
        color: white !important;
        background: #93c !important;
        font-weight: 900;
    }
    .details-table td:first-child { text-align: right; }
    main, .section h4, .person p { color: yellow !important; }

.icon, .online img {
display: none;
}
.contact .inner a:before, .online:before{
image-rendering: pixelated;
animation: flicker 0.08s steps(2,end) infinite alternate;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/add-friend.GIF")
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/add-favorite.GIF")
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/message.GIF")
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* forward to friend*/
content: url("https://groonklie.com/spacehey-junk/dangan/icons/forward-friend.GIF")
}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/imessage.GIF")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/block.GIF")
}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/add-group.GIF")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://groonklie.com/spacehey-junk/dangan/icons/report.GIF")
}
.logo {
content: url("https://groonklie.com/spacehey-junk/dangan/logo.PNG");
width: auto !important;
margin: 0 0 0 0px !important;
height: 45px !important;
}
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

Displaying 20 of 65 comments ( View all | Add Comment )

pauliplier	1769707264 I'm using this cause it's peak. Report Comment
bvbbl3gVmb0z0	1767063568 eats THANK YOU IIM USIING THIIS!! >;D Report Comment
bvbbl3gVmb0z0	1767063568 eats THANK YOU IIM USIING THIIS!! >;D Report Comment
Fizzy Z	1766854886 USING THIS TYYY Report Comment
CAVIIDAE	1766286414 using!! Report Comment
HIVEHIVE.2763	1766142937 using!!, Report Comment
◟♯ . / 𝚓𝚗𝚢 . !	1763702650 using the spacehey logo!! Report Comment
𝕵𝖊𝖟𝖎𝖞𝖆 \| 👾	1762841361 using !! Report Comment
Jaz/Jelly ദ്ദി •⩊• )	1762253461 using!! vv cool Report Comment
Matty!! ( ˘ ³˘)♥︎	1761860107 using!!! ( •̀ ω •́ )✧ Report Comment
ೀ꩜Double 0꩜⁀➴	1761624487 Imma use ts Report Comment Kazuichi pfp u goated by Jaz/Jelly ദ്ദി •⩊• ); 1762253472; Report
C00LDUDE_Plushie143	1754954453 USING!! (Omgosh so many Danganronpa pfps awesome!) Report Comment
UselessHeapOfPlastic	1749429246 goated Report Comment
fainéant	1749266132 using ! Report Comment
🌏Ash!🐚	1746756194 using :)) Report Comment
Averyy	1746156706 using tyyyy Report Comment
ChikiNana	1744791000 Using Report Comment
୨ ᑲrᥱᥱ ୧	1741903705 using ! Report Comment
LeutnantLAJ	1741332972 Using this it's genuinely amazing tysm!! Report Comment
kazuichi	1740912593 using Report Comment