karthik/horse-betting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: login page ui navbar

Browse Source
This commit is contained in:
karthik 2025-06-19 23:03:33 +05:30
parent f78d46852e
commit 5f84f63ee7
2 changed files with 52 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
btc-ui-app-2/src/app/login/login.css
View File

@ -1,9 +1,27 @@
.login-container { body {
display: flex; margin: 0;
height: 100vh;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
} }
/* Top bar */
.top-bar {
height: 40px;
background-color: orange;
color: #fff;
font-weight: bold;
display: flex;
justify-content: flex-end;
align-items: center;
padding: 0 20px;
font-size: 14px;
}
/* Main container */
.login-container {
display: flex;
height: calc(100vh - 80px); /* minus top & bottom bar */
}
/* Left image */
.login-left { .login-left {
flex: 2; flex: 2;
} }
@ -14,6 +32,7 @@
object-fit: cover; object-fit: cover;
} }
/* Right side */
.login-right { .login-right {
flex: 1; flex: 1;
padding: 40px; padding: 40px;
@ -29,6 +48,7 @@
font-weight: bold; font-weight: bold;
margin-bottom: 30px; margin-bottom: 30px;
color: #004aad; color: #004aad;
text-align: center;
} }
.logo span { .logo span {
@ -56,6 +76,7 @@
cursor: pointer; cursor: pointer;
} }
/* Keypad styling */
.numpad { .numpad {
width: 80%; width: 80%;
} }
@ -79,3 +100,15 @@
.back-btn { .back-btn {
background-color: #f9d3b4; background-color: #f9d3b4;
} }
/* Bottom bar */
.bottom-bar {
height: 40px;
background-color: orange;
color: white;
display: flex;
justify-content: flex;
align-items: center;
padding: 0 20px;
font-size: 14px;
}

17
btc-ui-app-2/src/app/login/login.html
View File

@ -1,7 +1,16 @@
<!-- Top Bar -->
<div class="top-bar">
<span>TOTE BETTING CONSOLE v7.9.1</span>
</div>
<!-- Main Login Container -->
<div class="login-container"> <div class="login-container">
<!-- Left Image -->
<div class="login-left"> <div class="login-left">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRXNtvgCYhMqpZef92nycXTb2pKqA2MoGLOAw&s" alt="Horse Racing" class="bg-image" /> <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRXNtvgCYhMqpZef92nycXTb2pKqA2MoGLOAw&s" alt="Horse Racing" class="bg-image" />
</div> </div>
<!-- Right Panel -->
<div class="login-right"> <div class="login-right">
<div class="logo">BTC <span>BANGALORE TURF CLUB LTD</span></div> <div class="logo">BTC <span>BANGALORE TURF CLUB LTD</span></div>
@ -10,6 +19,7 @@
<button class="login-btn">LOGIN</button> <button class="login-btn">LOGIN</button>
<!-- Numeric Keypad -->
<div class="numpad"> <div class="numpad">
<div class="row"> <div class="row">
<button>0</button> <button>0</button>
@ -32,4 +42,9 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- Bottom Bar -->
<div class="bottom-bar">
<span>Powered by <strong>Cezen Tech</strong></span>
</div>