mirror of
https://github.com/Retropex/custom-ocean.xyz-dashboard.git
synced 2025-05-12 19:20:45 +02:00
Improve console layout and update branding
Updated CSS for better height management and responsiveness. Adjusted `.console-container`, `.console-wrapper`, and `.console-output` for improved layout stability and overflow handling. Set minimum heights for `.console-stats` and added padding for better spacing. Changed title from "BITCOIN MINING TERMINAL v1.0" to "BTC OS LOG TERMINAL v1.0".
This commit is contained in:
parent
898652b754
commit
f718647966
@ -81,14 +81,17 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
/* Update container to use specific heights rather than 100vh */
|
||||
.console-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
height: 100vh; /* Keep this */
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
background: transparent;
|
||||
animation: flicker 4s infinite;
|
||||
/* Add this to ensure proper sizing */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.console-header {
|
||||
@ -110,6 +113,7 @@ body {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
/* Update the wrapper to have a controlled height */
|
||||
.console-wrapper {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
@ -117,8 +121,13 @@ body {
|
||||
scrollbar-color: var(--console-text) var(--console-bg);
|
||||
padding: 10px;
|
||||
max-width: 900px;
|
||||
/*margin: 0 auto;*/
|
||||
width: 100%; /* Add this */
|
||||
margin: 0 auto; /* Uncomment this */
|
||||
position: relative;
|
||||
/* Add these properties to control height */
|
||||
max-height: calc(100vh - 150px); /* Adjust based on header + stats height */
|
||||
min-height: 150px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.console-wrapper::-webkit-scrollbar {
|
||||
@ -135,13 +144,19 @@ body {
|
||||
box-shadow: 0 0 5px rgba(247, 147, 26, 0.8);
|
||||
}
|
||||
|
||||
/* Fix the console output positioning */
|
||||
.console-output {
|
||||
font-size: 20px;
|
||||
white-space: pre-wrap;
|
||||
word-break: break-word;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
/* Change from absolute to relative positioning */
|
||||
position: relative;
|
||||
bottom: auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* Add this for better spacing */
|
||||
padding-bottom: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.console-line {
|
||||
@ -158,11 +173,16 @@ body {
|
||||
text-shadow: 0 0 5px rgba(247, 147, 26, 0.8);
|
||||
}
|
||||
|
||||
/* Ensure the stats bar has a fixed height */
|
||||
.console-stats {
|
||||
border-top: 1px solid var(--console-text);
|
||||
padding: 15px;
|
||||
box-shadow: 0 0 15px rgba(247, 147, 26, 0.5);
|
||||
background-color: var(--console-header);
|
||||
/* Add this to ensure it has a consistent height */
|
||||
height: auto;
|
||||
min-height: 80px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.stats-container {
|
||||
|
@ -15,7 +15,7 @@
|
||||
{% block content %}
|
||||
<div class="console-container">
|
||||
<div class="console-header">
|
||||
<div class="console-title">BITCOIN MINING TERMINAL v1.0</div>
|
||||
<div class="console-title">BTC OS LOG TERMINAL v1.0</div>
|
||||
<div class="console-info">
|
||||
<span id="current-time">{{ current_time }}</span>
|
||||
<span class="blink">█</span>
|
||||
|
Loading…
Reference in New Issue
Block a user