diff options
Diffstat (limited to 'app/index.html')
| -rw-r--r-- | app/index.html | 107 |
1 files changed, 73 insertions, 34 deletions
diff --git a/app/index.html b/app/index.html index decc6b7..22ee9a9 100644 --- a/app/index.html +++ b/app/index.html @@ -201,6 +201,29 @@ } } + .list-group-item { + color: #fff; + background-color: #222; + border: 1px solid rgba(255, 255, 255, .125); + } + + .list-group-item.disabled { + color: #fff; + background-color: #222; + border-color: rgba(255, 255, 255, .125); + opacity: .75; + } + + .list-group-item-action:hover { + background-color: #252525; + color: #ddd; + } + + .list-group-item-action:active, .list-group-item-action:focus { + background-color: #272727; + color: #bbb; + } + #member-banner a { color: white; } @@ -220,6 +243,23 @@ grid-template-columns: 1fr !important; text-align: left; } + + #member-icon-mobile { + display: inline-block !important; + } + + #system-info { + grid-template-columns: 1fr !important; + } + + #member-icon, #member-icon-outer { + display: none !important; + } + + #member-relations { + grid-template-columns: 1fr !important; + text-align: left; + } } .tooltip.show { @@ -230,6 +270,10 @@ background: #151515; box-shadow: 3px 4px 10px #ffffff26; } + + html, body, #app { + height: 100%; + } </style> </head> <body style="background:black;"> @@ -242,43 +286,38 @@ </div> </div> - <div id="app"> - <div class="header" style="background-color:#111;border-bottom:1px solid #252525;"> - <div class="container"> - <br><br> - <h2 style="text-align: center;"><img id="home-avatar" alt="" src="" style="width: 48px;height: 48px;border-radius: 999px;vertical-align: middle;"> <span style="vertical-align: middle;"><span id="home-greeting">Greetings</span> <span id="home-name">Name</span>!</span></h2> - - <br> - <div id="home-apps"> - <a class="home-item" id="home-app-fronters" onclick="openApps.fronters();"> - <img alt="" class="home-item-icon" src="icons/fronters.svg"> - <span class="home-item-name">Fronters</span> - </a> - <a class="home-item" id="home-app-bits" onclick="openApps.bits();"> - <img alt="" class="home-item-icon" src="icons/bits.svg"> - <span class="home-item-name">Bits</span> - </a> - <a class="home-item" id="home-app-planner" onclick="openApps.planner();"> - <img alt="" class="home-item-icon" src="icons/planner.svg"> - <span class="home-item-name">Planner</span> - </a> - <a class="home-item" id="home-app-emergency" onclick="openApps.emergency();"> - <img alt="" class="home-item-icon" src="icons/emergency.svg"> - <span class="home-item-name">Emergency</span> - </a> + <div id="app" style="display:grid;grid-template-rows: 1fr max-content;"> + <div class="header" style="height:100%;background-color:#111;border-bottom:1px solid #252525;display:flex;align-items: center;justify-content: center;"> + <div style="width:100%;"> + <div class="container"> + <br><br> + <h2 style="text-align: center;"><img id="home-avatar" alt="" src="" style="width: 48px;height: 48px;border-radius: 999px;vertical-align: middle;"> <span style="vertical-align: middle;"><span id="home-greeting">Greetings</span> <span id="home-name">Name</span>!</span></h2> + + <br> + <div id="home-apps"> + <a class="home-item" id="home-app-fronters" onclick="openApps.fronters();"> + <img alt="" class="home-item-icon" src="icons/fronters.svg"> + <span class="home-item-name">Fronters</span> + </a> + <a class="home-item" id="home-app-bits" onclick="openApps.bits();"> + <img alt="" class="home-item-icon" src="icons/bits.svg"> + <span class="home-item-name">Bits</span> + </a> + <a class="home-item" id="home-app-planner" onclick="openApps.planner();"> + <img alt="" class="home-item-icon" src="icons/planner.svg"> + <span class="home-item-name">Planner</span> + </a> + <a class="home-item" id="home-app-emergency" onclick="openApps.emergency();"> + <img alt="" class="home-item-icon" src="icons/emergency.svg"> + <span class="home-item-name">Emergency</span> + </a> + </div> </div> + <p style="text-align: center;margin-top:15px;"><b style="vertical-align: middle;">In the <span id="home-other-system">other system</span>:</b> <img id="home-other-img" alt="" src="" style="vertical-align:middle;width:24px;height:24px;border-radius:999px;background:#333;"> <span id="home-other-name" style="vertical-align: middle;">Some member</span></p> </div> - <br><br> </div> - - <p style="text-align: center;"> - <br> - <a href="#" onclick='document.body.innerHTML = `<iframe src="/app/demo/index.php" style="position: fixed;inset: 0;height: 100%;width: 100%;">`;'>Demo mode (for Raindrops' therapist)</a> - </p> - - <div class="container"> - <br> - + <div> + <p style="margin-top:15px;text-align: center;" class="text-muted">© <span id="copyright-year"></span> Equestria.dev Developers · Data updated <span id="update-date"></span></p> </div> </div> |