From ca606477686f654cb445090ef89a8c1427609d26 Mon Sep 17 00:00:00 2001 From: BFlat Date: Sun, 24 Jul 2022 15:36:35 +0100 Subject: [PATCH 1/2] navbar styling and link fixes --- packages/fakeyou/src/AppNew.scss | 21 +++++-- packages/fakeyou/src/scss/site-refresh.scss | 4 ++ packages/fakeyou/src/v2/view/NewTopNavFc.tsx | 65 ++++++++++---------- 3 files changed, 50 insertions(+), 40 deletions(-) diff --git a/packages/fakeyou/src/AppNew.scss b/packages/fakeyou/src/AppNew.scss index 19bdd40087..64f7262692 100644 --- a/packages/fakeyou/src/AppNew.scss +++ b/packages/fakeyou/src/AppNew.scss @@ -62,6 +62,11 @@ $headings-font-family: "Merriweather", serif; cursor: pointer; } + .btn:focus { + outline: none; + box-shadow: none; + } + /*p { a:link, a:visited { @@ -204,13 +209,13 @@ $headings-font-family: "Merriweather", serif; backdrop-filter: blur(5px); border-bottom: 1px solid; border-color: rgba(255, 255, 255, 0.06); + } - .top-bar-text { - color: rgba($white, 0.7); - font-size: 12px; - font-weight: 400; - transition: 0.2s; - } + .top-bar-text { + color: rgba($white, 0.7); + font-size: 14px; + font-weight: 400; + transition: 0.2s; } .dropdown-divider-white { @@ -428,5 +433,9 @@ $headings-font-family: "Merriweather", serif; } } } + + .top-bar-text { + font-size: 12px; + } } } diff --git a/packages/fakeyou/src/scss/site-refresh.scss b/packages/fakeyou/src/scss/site-refresh.scss index 295917fcae..b7978823cc 100644 --- a/packages/fakeyou/src/scss/site-refresh.scss +++ b/packages/fakeyou/src/scss/site-refresh.scss @@ -491,6 +491,10 @@ styles with important tags: .alert { font-size: 14px; } + + .rounded-circle { + border-radius: 50px; + } } @media (min-width: 992px) { diff --git a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx index 46ed43dd3d..202ff68fdd 100644 --- a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx +++ b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx @@ -16,6 +16,7 @@ import { faTrophy, faUpload, faUser, + faSignOutAlt, } from "@fortawesome/free-solid-svg-icons"; import { faPatreon } from "@fortawesome/free-brands-svg-icons"; import { t } from "i18next"; @@ -238,28 +239,26 @@ function NewTopNavFc(props: Props) { const logoutHandler = async () => { await Logout(); props.querySessionCallback(); - history.push('/'); - } + history.push("/"); + }; const loggedIn = props.sessionWrapper.isLoggedIn(); let userOrLoginButton = ( <> - - Login + + + Login + ); - let signupOrLogOutButton = ( + let signupOrLogOutButton = ( <> - - @@ -271,36 +270,34 @@ function NewTopNavFc(props: Props) { let gravatar = ; if (displayName === undefined) { - displayName = 'My Account'; + displayName = "My Account"; } if (gravatarHash !== undefined) { - gravatar = + gravatar = ; } let url = `/profile/${displayName}`; userOrLoginButton = ( <> - - {gravatar}  {displayName} + + + {gravatar}  {displayName} + - ); signupOrLogOutButton = ( <> - ); @@ -325,9 +322,9 @@ function NewTopNavFc(props: Props) {
-

+ {/*

Online Users: 1,204 -

+

*/}

TTS Queued: 48

@@ -469,7 +466,7 @@ function NewTopNavFc(props: Props) {
  • - + My Data @@ -501,12 +498,12 @@ function NewTopNavFc(props: Props) {
  • -

    + {/*

    Online: 1,204 -

    -

    - Queued: 48 -

    +

    */} +
    + TTS Queued: 48 +
    • @@ -514,7 +511,7 @@ function NewTopNavFc(props: Props) {
    -
    +
    {userOrLoginButton} {signupOrLogOutButton}
    From ee490bef8a3c3f88be84b0de8c6e408bfb0994bc Mon Sep 17 00:00:00 2001 From: BFlat Date: Sun, 24 Jul 2022 15:36:49 +0100 Subject: [PATCH 2/2] login/signup page fixes --- .../fakeyou/src/v2/view/login/LoginPage.tsx | 42 ++++++--- .../fakeyou/src/v2/view/signup/SignupPage.tsx | 93 +++++++++++++------ 2 files changed, 92 insertions(+), 43 deletions(-) diff --git a/packages/fakeyou/src/v2/view/login/LoginPage.tsx b/packages/fakeyou/src/v2/view/login/LoginPage.tsx index 1fe4dce70d..82d45103bb 100644 --- a/packages/fakeyou/src/v2/view/login/LoginPage.tsx +++ b/packages/fakeyou/src/v2/view/login/LoginPage.tsx @@ -78,7 +78,7 @@ function LoginPage(props: Props) {
    Login Error: {errorMessage}
    - ) + ); } else { errorWarning = (
    @@ -92,36 +92,49 @@ function LoginPage(props: Props) { return (

    Login

    - + {errorWarning} - +
    - +
    {/*

    */}
    - +
    - +
    {/*

    */}
    - +
    - - - + +
    ); @@ -131,7 +144,7 @@ function LoginPage(props: Props) {
    -
    +

    Login

    {errorWarning} @@ -177,10 +190,9 @@ function LoginPage(props: Props) { Login

    - Don’t have an account? -   - Create an account now. diff --git a/packages/fakeyou/src/v2/view/signup/SignupPage.tsx b/packages/fakeyou/src/v2/view/signup/SignupPage.tsx index e2c5644577..60ffd4c594 100644 --- a/packages/fakeyou/src/v2/view/signup/SignupPage.tsx +++ b/packages/fakeyou/src/v2/view/signup/SignupPage.tsx @@ -207,7 +207,20 @@ function SignupPage(props: Props) { }; if (props.sessionWrapper.isLoggedIn()) { - return

    Invalid view for logged in users.
    ; + return ( +
    +
    +

    + Invalid view for logged in users. +

    +
    + + Back to main + +
    +
    +
    + ); } let usernameInputClass = USE_REFRESH ? "form-control" : "input"; @@ -274,45 +287,69 @@ function SignupPage(props: Props) { return (

    Sign Up

    - +
    - +

    {usernameInvalidReason}

    - +
    - +

    {emailInvalidReason}

    - +
    - +

    {passwordInvalidReason}

    - +
    - + @@ -321,24 +358,29 @@ function SignupPage(props: Props) { {passwordConfirmationInvalidReason}

    - +
    - +
    - Remember your password! We don't have password reset currently, and it'll be a - few more weeks before it's added (there are more important features to work on). If you lose your + Remember your password! We don't have password + reset currently, and it'll be a few more weeks before it's added + (there are more important features to work on). If you lose your password, please let us know in Discord.
    - - + + - +
    - - Already have an account? Log in instead! - + > + Already have an account? Log in instead! +
    ); } @@ -347,7 +389,7 @@ function SignupPage(props: Props) {
    -
    +

    Sign Up

    @@ -429,13 +471,8 @@ function SignupPage(props: Props) { Sign up

    - Already have an account? - - Log in instead. - + Already have an account?{" "} + Log in instead.