dh/Symcon_Belevo_Energiemanagement_testing
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

no message

Browse Source
This commit is contained in:
mh
2025-12-18 06:46:24 +01:00
parent 13f458e10c
commit 4335c37d9f
1 changed files with 14 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Energy_Pie/module.html
+14 -39
View File
@@ -46,65 +46,40 @@
#grid { grid-template-columns: 1fr !important; } #grid { grid-template-columns: 1fr !important; }
} }
/* Quantum-Waves Hintergrund */ /* Statischer "Fluid" Hintergrund in Donut-Farben */
#wrap{ #wrap{
position:relative; position:relative;
overflow:hidden; overflow:hidden;
min-height:100vh; min-height:100vh;
/* Grundton, damit es nicht "lochig" wirkt */
background: rgba(18, 18, 22, 1);
} }
/* Nur EIN Layer, statisch */
#wrap::before{ #wrap::before{
content:""; content:"";
position:absolute; position:absolute;
inset:-50%; inset:-35%;
background: background:
radial-gradient(circle at 20% 25%, rgba(99,179,255,.20), transparent 45%), radial-gradient(520px 420px at 18% 18%, rgba(99,179,255,0.22), transparent 60%),
radial-gradient(circle at 80% 35%, rgba(168,85,247,.18), transparent 50%), radial-gradient(560px 460px at 82% 28%, rgba(168,85,247,0.20), transparent 62%),
radial-gradient(circle at 55% 80%, rgba(255,255,255,.07), transparent 55%); radial-gradient(620px 520px at 55% 85%, rgba(99,179,255,0.12), transparent 64%),
filter: blur(20px); radial-gradient(700px 560px at 35% 70%, rgba(168,85,247,0.10), transparent 66%),
opacity:.9; radial-gradient(900px 700px at 50% 50%, rgba(255,255,255,0.04), transparent 70%);
animation: qDrift 14s ease-in-out infinite alternate; filter: blur(24px);
pointer-events:none; opacity: 1;
z-index:0;
}
#wrap::after{
content:"";
position:absolute;
inset:-30%;
background:
repeating-radial-gradient(circle at 30% 40%,
rgba(255,255,255,.06) 0px,
rgba(255,255,255,0) 14px,
rgba(255,255,255,0) 28px),
repeating-linear-gradient(120deg,
rgba(168,85,247,.06) 0px,
rgba(168,85,247,0) 18px,
rgba(99,179,255,.05) 36px,
rgba(99,179,255,0) 54px);
mix-blend-mode: overlay;
opacity:.35;
animation: qWaves 10s linear infinite;
pointer-events:none; pointer-events:none;
z-index:0; z-index:0;
} }
/* Content über dem Background */
#wrap > *{ #wrap > *{
position:relative; position:relative;
z-index:1; z-index:1;
} }
@keyframes qDrift{
from{ transform: translate3d(-2%, -2%, 0) scale(1.02) rotate(-2deg); }
to { transform: translate3d( 2%, 2%, 0) scale(1.08) rotate( 2deg); }
}
@keyframes qWaves{
from{ transform: translate3d(0,0,0) rotate(0deg); }
to { transform: translate3d(6%, -4%, 0) rotate(360deg); }
}
</style> </style>
<!-- 1) Puffer-Handler: fängt Symcon-Messages ab, selbst wenn UI noch nicht ready ist --> <!-- 1) Puffer-Handler: fängt Symcon-Messages ab, selbst wenn UI noch nicht ready ist -->
<script> <script>
window.__EnergyPieQueue = window.__EnergyPieQueue || []; window.__EnergyPieQueue = window.__EnergyPieQueue || [];