A good nav bar !!

This commit is contained in:
rmc 2023-11-27 14:09:03 -05:00
parent d4b1acfcf3
commit 4047db42bb
No known key found for this signature in database
GPG Key ID: 5633EC10309D77D1
4 changed files with 223 additions and 284 deletions

View File

@ -1,110 +1,80 @@
<div class="nav">
<nav>
<ul>
<li class="navedge"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_leftbracket.png" style="width:1.5vw;height:auto;margin:auto;position: static;"/></li>
<div class="navpadding">
<!--<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/back.png" class="navicon"></div>
<div class="imageThree image"><a href="/"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>-->
<!--<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/home.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsi.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>-->
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.discordapp.com/attachments/900463024966627329/1178221371277455380/home128.png?ex=65755b29&is=6562e629&hm=68baba8eeb37a75095d52234b03e692f687382e103f387ead8ba14870286c9ff&" class="navicon"></div>
<div class="imageThree image"><a href="/"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/devshop.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsidev/dsishop/startup.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/blog.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsi.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/guide-fw.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsidev/guide/ds-prototype-firmware.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/firmware.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsidev/guide/ds-ique-firmware.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/x4_i_guess.png" class="navicon"></div>
<div class="imageThree image"><a href="/dsidev/release/USG-CPU-X4.html"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" class="navimg"></div>
<div class="imageThree image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" class="navimg"></div>
<div class="imageThree image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" class="navimg"></div>
<div class="imageThree image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" class="navimg"></div>
<div class="imageThree image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" class="navimg"></div>
<div class="imageThree image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/discord.png" class="navicon"></div>
<div class="imageThree image"><a href="https://discord.gg/se9yQBeX3e"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
<li class="navimg">
<div class="container">
<div class="imageOne image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" class="navimg"></div>
<div class="imageTwo image"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/github.png" class="navicon"></div>
<div class="imageThree image"><a href="https://github.com/IanSkinner1982/ianskinner1982.github.io/"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" class="navimgoverlay"></a></div>
</div>
</li>
</div>
<li class="navedge"><img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_rightbracket.png" style="width:1.5vw;height:auto;margin:auto;"/></li>
</ul>
</nav>
</div>
<div class="nav-container">
<div class="nav-bracket">
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_leftbracket.png">
</div>
<div class="nav-content">
<div class="nav-content-container"> <!-- 14 boxes please -->
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/twldevapps.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/dsishop/startup.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/devshop.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsi.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png"/></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/blog.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/guide/ds-prototype-firmware.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/guide-fw.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/guide/ds-ique-firmware.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/firmware.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/release/USG-CPU-X4.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/x4_i_guess.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="https://discord.gg/se9yQBeX3e"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/discord.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="https://github.com/rvtr/rvtr.github.io"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/github.png" class="nav-content-box-icon">
</div>
</div>
</div>
<div class="nav-bracket">
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_rightbracket.png">
</div>
</div>

View File

@ -1,7 +1,6 @@
---
layout: dsiware
---
dfytughkjgfdyfgiufdyrtfguiohgfdtyrtfgilhvkj
{% for ENTRY in site.data.dsinfo %}
{% if ENTRY.PROGRAM == page.app %}
{% if ENTRY.PUBLISHED == "TRUE" %}

View File

@ -19,6 +19,61 @@ code {
special {
font-family: dsifont-special;
}
/* nav bar */
.nav-container {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
width:95%;
margin-left: auto;
margin-right: auto;
}
.nav-bracket img {
width: 1.5vw;
}
.nav-content {
width: 90%;
}
.nav-content-container {
display: flex;
width:100%;
padding-top: 1vw;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-around;
}
.nav-content-box {
position: relative;
top: 0;
left: 0;
}
.nav-content-box-main {
width:6vw;
position: relative;
top: 0;
left: 0;
z-index: 1;
}
.nav-content-box-sub {
width:6vw;
position: absolute;
top: 0px;
left: 0px;
opacity: 0;
z-index: 3;
}
.nav-content-box-sub:hover {
opacity: 1.0;
}
.nav-content-box-icon {
width: 3.2vw;
position: absolute;
top: 20%;
left: 23%;
z-index:2;
}
.info {
padding: 10px;
background-color: #e6ebf2;
@ -33,175 +88,7 @@ body {
background-image: url('https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_dsi_background.jpg');
font-family: dsifont;
}
.nav ul {
list-style-type: none;
margin: 0;
padding: 0;
padding-left: 3.5%;
width: auto;
height: auto;
text-align: center;
position: relative;
/* overflow: hidden; */
}
.navstd {
float: left;
}
.navalt {
float: right;
}
.container {
position: relative;
}
.imageOne {
z-index: 0;
}
.imageTwo {
z-index: 1;
}
.imageThree {
z-index: 2;
}
.imageFour {
z-index: 3;
}
.image {
position: absolute;
width: 100px;
height: 100px;
}
.navimgoverlay {
opacity: 0.0;
text-align: center;
float: left;
padding-top: .6vw;
width: 6vw;
height: auto;
}
.navimgoverlay:hover {
opacity: 1.0;
width: 6vw;
}
.navimg {
text-align: center;
float: left;
padding-top: .6vw;
width: 6vw;
height: auto;
position: static;
}
.navicon {
text-align: center;
float: left;
padding-top: 2.1vw;
padding-left: 1.38vw;
width: 3.2vw;
height: auto;
}
.navedge {
text-align: center;
float: left;
margin: 1%;
width: 1.5vw;
height: auto;
}
.navpadding li {
padding-top: 1.5%;
}
.image2 {
position: absolute;
border-color: #FFFFFF
width: auto;
height: auto;
margin-left:-0.3vw;
}
.image3 {
position: relative;
border-color: #FFFFFF
width: auto;
height: auto;
}
.text {
position: absolute;
text-align: left;
border-color: #FFFFFF;
font-size: 30px;
font-size: 1vw;
padding-top: 2.2vw;
padding-left: 6.2vw;
}
.icon {
padding-top:2.2vw;
margin-left: -9.3vw;
z-index: 2;
}
.titleimgoverlay {
margin: 0% 2% 0%;
opacity: 0.0;
text-align: center;
float: left;
width: 16vw;
height: auto;
}
.titleimgoverlay:hover {
opacity: 1.0;
}
.titleimg {
margin: 0% 2% 0%;
text-align: center;
float: left;
width: 16vw;
height: auto;
margin-bottom: 10vw;
}
.titleedge {
text-align: center;
float: left;
margin: 1%;
width: 18vw;
height: auto;
}
.titlepadding li {
padding-top: 1.5%;
margin: 0% 2% 0%
}
.homeimg {
text-align: center;
/*float: right;*/
width: 96%;
height: auto;
margin-bottom: 5vw;
}
.hometext {
position: absolute;
text-align: center;
border-color: #FFFFFF;
font-size: 0.9vw;
width: 100%;
}
.hometext_long {
position: absolute;
text-align: left;
border-color: #FFFFFF;
font-size: 40px;
font-size: .82vw;
}
.homeicon {
padding-top:37%;
padding-left:1.5%
z-index: 2;
margin-right:0.3vw;
}
.othertext {
position: absolute;
text-align: left;
width: 100%;
border-color: #FFFFFF;
font-size: 15px;
padding-top: 1vw;
padding-left: 1vw;
}
/* devinfo layout CSS. Shocking, I know! */
.devinfo-container {
display: flex;
justify-content: space-around;

View File

@ -1,4 +1,87 @@
---
title: Index
layout: dsiware
---
<h1>New nav bar test!</h1>
<div class="nav-container">
<div class="nav-bracket">
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_leftbracket.png">
</div>
<div class="nav-content">
<div class="nav-content-container"> <!-- 14 boxes please -->
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/twldevapps.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/dsishop/startup.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/devshop.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsi.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png"/></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/blog.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/guide/ds-prototype-firmware.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/guide-fw.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/guide/ds-ique-firmware.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/firmware.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="/dsidev/release/USG-CPU-X4.html"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/x4_i_guess.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_box.png" />
<a href=""><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="https://discord.gg/se9yQBeX3e"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/discord.png" class="nav-content-box-icon">
</div>
<div class="nav-content-box">
<img class="nav-content-box-main" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_boxfull.png" />
<a href="https://github.com/rvtr/rvtr.github.io"><img class="nav-content-box-sub" src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_red_boxoverlay.png" /></a>
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/icon/navbar/github.png" class="nav-content-box-icon">
</div>
</div>
</div>
<div class="nav-bracket">
<img src="https://cdn.randommeaninglesscharacters.com/assets-dsi/menu/dsi_rightbracket.png">
</div>
</div>