summaryrefslogtreecommitdiffstats
path: root/client/src
diff options
context:
space:
mode:
Diffstat (limited to 'client/src')
-rw-r--r--client/src/admin/data/translations.js8
-rw-r--r--client/src/admin/scss/_forms.scss5
-rw-r--r--client/src/admin/scss/_globals.scss14
-rw-r--r--client/src/admin/scss/_info.scss1
-rw-r--r--client/src/admin/scss/_main.scss1
-rw-r--r--client/src/admin/scss/_mainScreen.scss24
-rw-r--r--client/src/admin/scss/_topBar.scss9
-rw-r--r--client/src/login/jsx/LoginPanel.jsx16
-rw-r--r--client/src/login/scss/_loginPanel.scss34
9 files changed, 77 insertions, 35 deletions
diff --git a/client/src/admin/data/translations.js b/client/src/admin/data/translations.js
index b4c34a2..732e311 100644
--- a/client/src/admin/data/translations.js
+++ b/client/src/admin/data/translations.js
@@ -4,9 +4,9 @@ export const translations = {
"en": {
"main-title": "Website Manager",
"login-to-admin": "Login to Admin Panel",
- "login-info": "Put your user name and password, then click login button",
+ "login-info": "Put your email and password, then click login button",
"login": "Login",
- "user": "User name",
+ "email": "Email",
"password": "Password",
"no-saved-websites": "You don't have any saved projects, create a new one",
"create-new-project": "Create new project",
@@ -16,9 +16,9 @@ export const translations = {
"show-saved-projects": "Show saved projects",
"show-saved-projects-hover": "Click to show list of all saved projects",
"click-to-change-language": "Click to change language in the website manager",
- "click-to-change-user": "Click to logout or change user password",
+ "click-to-change-user": "Click to logout or change user settings",
"logout": "Logout",
- "click-to-logout": "Click to logout/change current user",
+ "click-to-logout": "Click to logout current user",
"user-settings": "User settings",
"click-to-change-user-settings": "Click to change user name, password or to completely remove current user",
},
diff --git a/client/src/admin/scss/_forms.scss b/client/src/admin/scss/_forms.scss
index 0585cd6..e74c343 100644
--- a/client/src/admin/scss/_forms.scss
+++ b/client/src/admin/scss/_forms.scss
@@ -12,7 +12,7 @@
}
.text-input-label {
- font-size: 1.25em;
+ font-size: 1em;
width: 100%;
color: #aaa;
display:block;
@@ -21,10 +21,11 @@
transition: all .3s;
z-index: -1;
cursor: text;
+ pointer-events: none;
}
.text-input-field {
- font-size: 1.5rem;
+ font-size: 1.25rem;
box-shadow: none;
background: $background;
color: $text;
diff --git a/client/src/admin/scss/_globals.scss b/client/src/admin/scss/_globals.scss
index f03ad86..d15363f 100644
--- a/client/src/admin/scss/_globals.scss
+++ b/client/src/admin/scss/_globals.scss
@@ -3,10 +3,14 @@ html {
}
* {
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: -moz-none;
- -o-user-select: none;
- user-select: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: -moz-none;
+ -o-user-select: none;
+ user-select: none;
+}
+
+p {
+ line-height: 1.5;
}
diff --git a/client/src/admin/scss/_info.scss b/client/src/admin/scss/_info.scss
index ac32949..9c760db 100644
--- a/client/src/admin/scss/_info.scss
+++ b/client/src/admin/scss/_info.scss
@@ -3,6 +3,5 @@
color: #ddd;
flex-grow: 0;
text-align: center;
- padding-bottom: 3vh;
padding-top: 3vh;
}
diff --git a/client/src/admin/scss/_main.scss b/client/src/admin/scss/_main.scss
index e182f3c..a5e6636 100644
--- a/client/src/admin/scss/_main.scss
+++ b/client/src/admin/scss/_main.scss
@@ -3,6 +3,7 @@
flex-direction: column;
justify-content: space-between;
position: fixed;
+ padding: 1em 1.5em 1.5em 1.5em;
top: 0;
right: 0;
bottom: 0;
diff --git a/client/src/admin/scss/_mainScreen.scss b/client/src/admin/scss/_mainScreen.scss
index 4eec73a..e9eeeb3 100644
--- a/client/src/admin/scss/_mainScreen.scss
+++ b/client/src/admin/scss/_mainScreen.scss
@@ -1,13 +1,31 @@
.main-screen {
text-align: center;
+ @keyframes shine {
+ 0% {background-size: 220% 100%;}
+ 10% {background-position: 0 100%;}
+ 100% {background-position: 0 100%;}
+ }
+
&__header {
display: block;
margin-top: 10vh;
margin-bottom: 20vh;
- font-size: 300%;
- color: white;
+ font-size: 2.5em;
+ font-weight: bold;
+ color: $text;
text-align: center;
+ position: relative;
+ overflow: hidden;
+ background: linear-gradient(to right, $text 50%, $text-selected 55%, $text 60%);
+ background-clip: text;
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ background-position: 110%;
+ animation: shine 15s ease-out;
+ background-size: 220% 100%;
+ animation-iteration-count: infinite;
+ animation-delay: 8s;
}
&__list {
@@ -15,7 +33,7 @@
}
&__item {
- font-size: 175%;
+ font-size: 1.5em;
color: white;
transition: color .3s;
cursor: pointer;
diff --git a/client/src/admin/scss/_topBar.scss b/client/src/admin/scss/_topBar.scss
index af9fcd6..3fe5006 100644
--- a/client/src/admin/scss/_topBar.scss
+++ b/client/src/admin/scss/_topBar.scss
@@ -5,10 +5,10 @@
}
.top-bar {
- flex-grow: 0;
- display: flex;
- justify-content: end;
- padding: 1em;
+ width: 100%;
+ text-align: right;
+ white-space: nowrap;
+ padding-bottom: 1em;
&__fog {
@@ -22,6 +22,7 @@
.user {
position: relative;
+ display: inline-block;
&__list {
position: absolute;
diff --git a/client/src/login/jsx/LoginPanel.jsx b/client/src/login/jsx/LoginPanel.jsx
index c84e843..8a38f50 100644
--- a/client/src/login/jsx/LoginPanel.jsx
+++ b/client/src/login/jsx/LoginPanel.jsx
@@ -16,26 +16,26 @@ const LoginPanel = () => {
const submit = (e) => {
e.preventDefault();
- login({email, password});
+ active && login({email, password});
}
return (
<div className="login-panel">
+ <p className="login-panel__header">
+ {t('login-to-admin')}
+ </p>
<form className="login-panel__form" onSubmit={submit}>
- <p className="login-panel__header">
- {t('login-to-admin')}
- </p>
<div className="text-input">
<input
onChange={e => setEmail(e.target.value)}
- placeholder={t('user')}
- id="admin-user-name"
- name="admin-user-name"
+ placeholder={t('email')}
+ id="admin-email"
+ name="admin-email"
type="text"
className="text-input-field"
value={email}
/>
- <label htmlFor="admin-user-name" className="text-input-label">{t('user')}</label>
+ <label htmlFor="admin-user-name" className="text-input-label">{t('email')}</label>
</div>
<div className="text-input">
<input
diff --git a/client/src/login/scss/_loginPanel.scss b/client/src/login/scss/_loginPanel.scss
index 8afb066..b105784 100644
--- a/client/src/login/scss/_loginPanel.scss
+++ b/client/src/login/scss/_loginPanel.scss
@@ -1,14 +1,37 @@
.login-panel {
text-align: center;
+ padding: 1.5em;
&__form {
display: inline-block;
+ width: 100%;
+ max-width: 400px;
+ }
+
+ @keyframes shine {
+ 0% {background-size: 220% 100%;}
+ 7% {background-position: 0 100%;}
+ 100% {background-position: 0 100%;}
}
&__header {
- color: white;
- font-size: 2em;
+ color: $text;
+ font-size: 1.75em;
+ line-height: 1.5;
margin-bottom: 4em;
+ position: relative;
+ display: inline-block;
+ color: $text;
+ overflow: hidden;
+ background: linear-gradient(to right, $text 50%, $text-selected 55%, $text 60%);
+ background-clip: text;
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ background-position: 110%;
+ animation: shine 15s ease-out;
+ background-size: 220% 100%;
+ animation-iteration-count: infinite;
+ animation-delay: 8s;
}
&__button {
@@ -21,14 +44,9 @@
padding: .5em 1.5em;
margin: 0 auto;
transition: .3s color, .3s background;
- cursor: pointer;
-
- &:hover {
- background: $text-inactive;
- color: $background;
- }
&.active {
+ cursor: pointer;
background: $background;
color: $text-selected;
border: 2px solid $text-selected;
generated by cgit v1.2.3 (git 2.25.1) at 2025-08-22 19:41:09 +0000