mirror of
https://github.com/khoj-ai/khoj.git
synced 2025-02-17 08:04:21 +00:00
Update web login screen to show frosted minimal chat UI in background
This commit is contained in:
parent
1b0318564e
commit
e10b260988
4 changed files with 21 additions and 2 deletions
|
@ -9,6 +9,7 @@
|
|||
--primary-focus: rgba(255, 179, 0, 0.125);
|
||||
--primary-inverse: rgba(0, 0, 0, 0.75);
|
||||
--background-color: #f5f4f3;
|
||||
--frosted-background-color: rgba(245, 244, 243, 0.75);
|
||||
--main-text-color: #475569;
|
||||
--summer-sun: #fcc50b;
|
||||
--water: #44b9da;
|
||||
|
@ -26,6 +27,7 @@
|
|||
--primary-focus: rgba(255, 179, 0, 0.25);
|
||||
--primary-inverse: rgba(0, 0, 0, 0.75);
|
||||
--background-color: #f5f4f3;
|
||||
--frosted-background-color: rgba(245, 244, 243, 0.75);
|
||||
--main-text-color: #475569;
|
||||
--summer-sun: #fcc50b;
|
||||
--water: #44b9da;
|
||||
|
@ -42,6 +44,7 @@
|
|||
--primary-focus: rgba(255, 179, 0, 0.25);
|
||||
--primary-inverse: rgba(0, 0, 0, 0.75);
|
||||
--background-color: #f5f4f3;
|
||||
--frosted-background-color: rgba(245, 244, 243, 0.75);
|
||||
--main-text-color: #475569;
|
||||
--summer-sun: #fcc50b;
|
||||
--water: #44b9da;
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 193 KiB |
Binary file not shown.
After Width: | Height: | Size: 81 KiB |
|
@ -65,13 +65,24 @@
|
|||
padding: 0px;
|
||||
margin: 0px;
|
||||
height: 100%;
|
||||
background: var(--background-color);
|
||||
background: url('/static/assets/samples/desktop-plain-chat-sample.png') no-repeat center center fixed;
|
||||
background-size: contain;
|
||||
color: var(--main-text-color);
|
||||
font-family: var(--font-family);
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
body::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--frosted-background-color);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
body > * {
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
|
@ -100,9 +111,9 @@
|
|||
grid-template-rows: 1fr auto auto 1fr;
|
||||
gap: 32px;
|
||||
min-height: 300px;
|
||||
background: var(--background-color);
|
||||
margin-left: 25%;
|
||||
margin-right: 25%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
div.g_id_signin {
|
||||
|
@ -118,9 +129,14 @@
|
|||
}
|
||||
|
||||
@media only screen and (max-width: 700px) {
|
||||
body{
|
||||
background: url('/static/assets/samples/phone-plain-chat-sample.png') no-repeat center center fixed;
|
||||
background-size: contain;
|
||||
}
|
||||
div#login-modal {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue