ION_Archive/selmer-bot-website
1
0
Fork 0
mirror of https://github.com/ION606/selmer-bot-website.git synced 2026-06-05 23:46:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

Banner Responsiveness

Browse Source 
Added the description to the banner and made the banner work for smaller screen sizes.
This commit is contained in:
a-box31
2022-12-25 02:37:23 -05:00
parent 6de8db0780
commit 0a0a0d3cdb
2 changed files with 133 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files
HTML/test.html
+30 -18
View File
@@ -182,11 +182,11 @@
<body>
<div class="box-area">
<header>
<div class="main-header">
<nav class="navigation">
<div class="logo">
<a class="navbar-brand" href="/">
<img src="https://github.com/ION606/selmer-bot-website/blob/main/assets/Selmer-icon.png?raw=true" alt="Selmer Icon" style="width: 50px;">
@@ -222,38 +222,43 @@
</nav>
</div>
<div class="banner-area">
<h2>this is banner</h2>
<h2>WELCOME TO THE SELMER BOT DASHBOARD</h2>
<h2>Music, Games, an Economy System, and More!</h2>
</div>
</header>
<div class="row custom-alert" style="display: none;" id="alertrow">
<div class="alert alert-warning alert-dismissible" id="banner" style="text-align: center" role="alert">
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
<strong class="mx-auto">Logged In Successfully!</strong> <!-- This alert box could indicate a successful or positive action. -->
</div>
</div>
<!-- Page Content -->
<section class="content-area">
<div class="row custom-alert" style="display: none;" id="alertrow">
<div class="alert alert-warning alert-dismissible" id="banner" style="text-align: center" role="alert">
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
<strong class="mx-auto">Logged In Successfully!</strong> <!-- This alert box could indicate a successful or positive action. -->
</div>
</div>
<!-- <div style="text-align: center; align-content: center;">
<!- <h2 style="color:wheat">Based off a real Professor of Logic!</h2> ->
<img src="https://github.com/ION606/selmer-bot-website/blob/main/assets/Selmer-icon.png?raw=true" alt="Selmer Icon" style="outline-style: dashed; border-radius: 50%; outline-color: green;">
</div> -->
<!-- Adds margins to the page -->
<div class="container">
<div id="music" class="row pb-md-5 mt-md-5">
<div class="col-xxl-4 col-xl-4 col-lg-5 col-md-12">
<img class="img-responsive" style="border-style: dashed; border-color:rgb(11, 189, 189);" src="https://github.com/ION606/selmer-bot-website/blob/main/assets/Features/Audio1.png?raw=true">
<!-- <img class="img-responsive overlay-content" style="border-style: dashed; border-color:rgb(11, 189, 189); transform: rotate(25deg); margin-bottom: 20%; margin-left: 45%;" src="https://github.com/ION606/selmer-bot-website/blob/main/assets/Features/Audio2.png?raw=true"> -->
<img class="img-responsive" src="https://github.com/ION606/selmer-bot-website/blob/main/assets/Features/Audio1.png?raw=true">
</div>
<div class="col-xxl-4 col-xl-4 col-lg-5 col-md-6">
<div class="container desctext">
<p style="white-space: pre-line;">
@@ -274,6 +279,7 @@
</ul>
</div>
</div>
</div>
@@ -456,6 +462,8 @@
</div>
</section>
<!-- <script type="module" src="./main.js", type="application/json"></script> -->
<footer class="footer-area">
<!-- Footer -->
@@ -467,6 +475,10 @@
</li>
</ul>
</footer>
</div>
</body>
</html>