From 591df676373a80f8362d02429b6682231cb03f4c Mon Sep 17 00:00:00 2001
From: ahamelers <audrey@ahamelers.com>
Date: Sun, 10 Mar 2019 23:24:53 +0000
Subject: [PATCH] #410
---
app/components/login/Login.jsx | 4 ++++
app/components/signup/Signup.jsx | 4 ++++
app/epmc-theme/elements/Checkbox.jsx | 2 ++
app/epmc-theme/elements/Steps.jsx | 36 +++++++++++++++-------------
4 files changed, 29 insertions(+), 17 deletions(-)
diff --git a/app/components/login/Login.jsx b/app/components/login/Login.jsx
index 139e8fc20..8d6cdbb4b 100644
--- a/app/components/login/Login.jsx
+++ b/app/components/login/Login.jsx
@@ -18,6 +18,10 @@ const ShowPassword = styled(Checkbox)`
right: 0;
top: 0;
font-size: ${th('fontSizeBaseSmall')};
+ input {
+ transform: scale(1.1);
+ zoom: 1.1;
+ }
`
const PasswordField = styled.div`
position: relative;
diff --git a/app/components/signup/Signup.jsx b/app/components/signup/Signup.jsx
index 7f8132734..576fa9cf0 100644
--- a/app/components/signup/Signup.jsx
+++ b/app/components/signup/Signup.jsx
@@ -18,6 +18,10 @@ const ShowPassword = styled(Checkbox)`
right: 0;
top: 0;
font-size: ${th('fontSizeBaseSmall')};
+ input {
+ transform: scale(1.1);
+ zoom: 1.1;
+ }
`
const PasswordDetails = styled.div`
display: flex;
diff --git a/app/epmc-theme/elements/Checkbox.jsx b/app/epmc-theme/elements/Checkbox.jsx
index 5c09d642d..a49f83a44 100755
--- a/app/epmc-theme/elements/Checkbox.jsx
+++ b/app/epmc-theme/elements/Checkbox.jsx
@@ -13,5 +13,7 @@ export default {
`,
Input: css`
height: calc(${th('gridUnit')} * 3);
+ transform: scale(1.25);
+ zoom: 1.25;
`,
}
diff --git a/app/epmc-theme/elements/Steps.jsx b/app/epmc-theme/elements/Steps.jsx
index 3d4acb03c..06216ffb3 100755
--- a/app/epmc-theme/elements/Steps.jsx
+++ b/app/epmc-theme/elements/Steps.jsx
@@ -3,29 +3,31 @@ import { th } from '@pubsweet/ui-toolkit'
export default {
Step: css`
- background-color: ${th('colorBorder')};
- border: 0;
+ height: calc(${th('gridUnit')} * 2);
+ width: calc(${th('gridUnit')} * 2);
+ background-color: ${({ isCurrent, isPast }) =>
+ (isPast && th('colorFurniture')) ||
+ (isCurrent && th('colorTextReverse')) ||
+ th('colorBorder')};
+ border-color: ${({ isCurrent, isPast }) =>
+ isCurrent || isPast ? th('colorFurniture') : th('colorBorder')};
+ border-width: calc(${th('gridUnit')} / 2);
+ box-sizing: border-box;
`,
Separator: css`
- background-color: ${th('colorBorder')};
- height: 4px;
+ background-color: ${({ isCurrent, isPast }) =>
+ isPast ? th('colorFurniture') : th('colorBorder')};
+ height: calc(${th('gridUnit')} / 2);
border: 0;
`,
+ StepTitle: css`
+ font-weight: ${({ isCurrent, isPast }) =>
+ isCurrent || isPast ? '600' : 'normal'};
+ `,
Bullet: css`
- background-color: ${th('colorFurniture')};
- width: calc(${th('gridUnit')} * 2);
- height: calc(${th('gridUnit')} * 2);
- border: 0;
- & + * {
- font-weight: 600;
- }
+ display: none;
`,
Success: css`
- color: ${th('colorFurniture')};
- width: calc(${th('gridUnit')} * 2);
- height: calc(${th('gridUnit')} * 2);
- & + * {
- font-weight: 600;
- }
+ display: none;
`,
}
--
GitLab