first commit
This commit is contained in:
202
src/styles/account-page.scss
Normal file
202
src/styles/account-page.scss
Normal file
@@ -0,0 +1,202 @@
|
||||
@use "sass:map";
|
||||
|
||||
$account-padding-base: 15px;
|
||||
$account-border-radius: 6px;
|
||||
$account-menu-item-padding: 6px;
|
||||
$account-card-background: #f5f5f5;
|
||||
$account-menu-item-hover-background: #f5f5f5;
|
||||
$account-support-title-padding: 10px;
|
||||
|
||||
.account-container {
|
||||
margin-top: 25px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $account-padding-base;
|
||||
}
|
||||
|
||||
.account-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $account-padding-base;
|
||||
background-color: #fff;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.account-left-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $account-padding-base;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-radius: $account-border-radius;
|
||||
height: 1136px;
|
||||
}
|
||||
|
||||
.account-section {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.account-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $account-padding-base;
|
||||
}
|
||||
|
||||
.account-card {
|
||||
background: $account-card-background;
|
||||
border-radius: 6px;
|
||||
|
||||
padding: $account-padding-base;
|
||||
text-align: center;
|
||||
|
||||
&-title {
|
||||
font-size: 1.1em;
|
||||
color: $primary;
|
||||
margin: 0 0 $account-padding-base 0;
|
||||
}
|
||||
|
||||
&-description {
|
||||
margin: $account-padding-base 0;
|
||||
}
|
||||
|
||||
&-actions {
|
||||
margin: $account-padding-base 0 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
&-right-account {
|
||||
border: 1px solid #e9e9e9;
|
||||
}
|
||||
}
|
||||
|
||||
.account-docs-generated {
|
||||
border: 1px solid #e9e9e9;
|
||||
.account-card-title {
|
||||
margin: $account-padding-base 0;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.account-card-actions {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
&-progress-bar {
|
||||
margin: $account-padding-base 0;
|
||||
}
|
||||
}
|
||||
|
||||
.account-support {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
grid-gap: $account-padding-base;
|
||||
text-align: left;
|
||||
|
||||
&-title {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
padding: 0 6px;
|
||||
font-size: 0.9em;
|
||||
background: #a0a0a0;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
&-info {
|
||||
position: relative;
|
||||
padding-top: $account-support-title-padding + $account-padding-base;
|
||||
&-title {
|
||||
left: -$account-padding-base;
|
||||
border-radius: 0px $account-border-radius $account-border-radius 0px;
|
||||
}
|
||||
}
|
||||
|
||||
&-links {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
background: $white;
|
||||
border-radius: $account-border-radius;
|
||||
padding: $account-support-title-padding + $account-padding-base
|
||||
$account-padding-base $account-padding-base $account-padding-base;
|
||||
|
||||
&-title {
|
||||
left: 0;
|
||||
border-radius: 0px 0px $account-border-radius 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.account-info {
|
||||
text-align: left;
|
||||
|
||||
&-name {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.account-menu {
|
||||
padding: $account-padding-base - $account-menu-item-padding;
|
||||
border-radius: $account-border-radius;
|
||||
|
||||
&-item {
|
||||
margin: 2px 0px;
|
||||
letter-spacing: 0.03rem;
|
||||
font-weight: 500;
|
||||
a,
|
||||
a:hover,
|
||||
a:link,
|
||||
a:visited {
|
||||
display: block;
|
||||
color: inherit;
|
||||
padding: $account-menu-item-padding;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
background-color: #fff;
|
||||
border-left: 1px solid var(--accent-orange);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.account-subscriptions {
|
||||
text-align: left;
|
||||
|
||||
&-title {
|
||||
font-size: 1.1em;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&-item {
|
||||
margin: $account-padding-base 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
|
||||
&-label {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
&-value {
|
||||
flex: 0 0 80%;
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
&-actions {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: map.get($grid-breakpoints, "md")) {
|
||||
.account-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr 1fr;
|
||||
grid-gap: $account-padding-base;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: map.get($grid-breakpoints, "lg")) {
|
||||
.account-group {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: $account-padding-base;
|
||||
}
|
||||
}
|
||||
76
src/styles/app.scss
Normal file
76
src/styles/app.scss
Normal file
@@ -0,0 +1,76 @@
|
||||
:root {
|
||||
--font-dark: #000;
|
||||
--font-regular: #5f5f5f;
|
||||
--font-medium: #767676;
|
||||
--font-light: #868686;
|
||||
--font-lighter: #868686;
|
||||
--gattlin-grey: #a9a9a9;
|
||||
--ultra-light-accent: #e4e4e4;
|
||||
--barely-there-accent: #f9f9f9;
|
||||
--accent-orange: #f27300;
|
||||
--accent-orange-light: #ffd7b1;
|
||||
--background-blue: rgb(240, 247, 250);
|
||||
--bluest-blue: #003858;
|
||||
--haq-blue: rgb(242, 248, 255);
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100vh;
|
||||
}
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
|
||||
monospace;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 700px;
|
||||
margin-top: 15px;
|
||||
padding-right: 0.5rem;
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p,
|
||||
div,
|
||||
button {
|
||||
color: var(--font-regular);
|
||||
font-family: "Roboto";
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 0rem;
|
||||
}
|
||||
|
||||
.app-divider {
|
||||
border-bottom: 1px solid #d2d2d2;
|
||||
}
|
||||
|
||||
/*** Media Queries **/
|
||||
|
||||
@media only screen and (max-width: 400px) {
|
||||
.ks-nodisplay {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.tos-container {
|
||||
margin: 20px 10px;
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
.tos-para {
|
||||
margin: 10px 0px;
|
||||
}
|
||||
55
src/styles/buttons.scss
Normal file
55
src/styles/buttons.scss
Normal file
@@ -0,0 +1,55 @@
|
||||
$button-height: 45px;
|
||||
$button-padding: 0 5px;
|
||||
|
||||
.primary-button {
|
||||
height: $button-height;
|
||||
padding: $button-padding;
|
||||
min-width: 150px;
|
||||
background-color: #1a76c7;
|
||||
color: #fff;
|
||||
border-radius: 8px;
|
||||
border-style: none;
|
||||
&:hover {
|
||||
border: 2px solid #f27300;
|
||||
}
|
||||
}
|
||||
|
||||
.primary-disabled {
|
||||
height: $button-height;
|
||||
padding: $button-padding;
|
||||
min-width: 156px !important;
|
||||
background-color: #87beee;
|
||||
color: #e7e7e7;
|
||||
border-radius: 8px;
|
||||
border-style: none;
|
||||
&:hover {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.secondary-button {
|
||||
height: $button-height;
|
||||
padding: $button-padding;
|
||||
min-width: 150px;
|
||||
color: #1a76c7;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #1a76c7;
|
||||
&:hover {
|
||||
background-color: var(--background-blue) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
height: $button-height;
|
||||
padding: $button-padding;
|
||||
min-width: 115px;
|
||||
color: #1a76c7;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #1a76c7;
|
||||
&:hover {
|
||||
background-color: var(--background-blue) !important;
|
||||
color: #1a76c7;
|
||||
}
|
||||
}
|
||||
310
src/styles/cards.scss
Normal file
310
src/styles/cards.scss
Normal file
@@ -0,0 +1,310 @@
|
||||
.linkcard-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
border-radius: 6px;
|
||||
margin: 15px 0px;
|
||||
height: 65px;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
border: 1px solid #a9a9a9;
|
||||
}
|
||||
|
||||
.link-card-button1 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
height: 32px;
|
||||
width: 68px;
|
||||
font-weight: 700;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.link-card-button2 {
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
height: 32px;
|
||||
width: 68px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.card-viewButton-container {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
width: 8%;
|
||||
height: 100%;
|
||||
padding-right: 5px;
|
||||
margin-right: 10px;
|
||||
padding-top: 1px;
|
||||
}
|
||||
|
||||
.card-col-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 50px;
|
||||
height: 100%;
|
||||
margin-left: 5px;
|
||||
padding-left: 5px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.card-col1 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
margin-left: 5px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.card-col2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
padding-left: 5px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
.card-col3 {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
width: 15%;
|
||||
height: 100%;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.card-col4 {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
width: 15%;
|
||||
height: 100%;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.card-button-col {
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
width: 15%;
|
||||
display: flex;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.info-card-outer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f4f4f4;
|
||||
border: 1px solid #cdcdcd;
|
||||
padding: 10px 10px;
|
||||
border-radius: 10px;
|
||||
width: 680px;
|
||||
}
|
||||
|
||||
.info-upper-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 8px 20px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.info-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 50%;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.button-box {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.view-button {
|
||||
width: 80px;
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
.card-text1 {
|
||||
margin-top: 17px;
|
||||
margin-right: 20px;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.jurisdiction-box {
|
||||
min-width: 130px;
|
||||
}
|
||||
|
||||
.doc-card-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 6px 0px;
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.doc-card-input {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 95%;
|
||||
background-color: #fff;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #a9a9a9;
|
||||
}
|
||||
|
||||
.doc-col2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 200px;
|
||||
height: 100%;
|
||||
padding-top: 1px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.doc-col3 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-width: 190px;
|
||||
height: 100%;
|
||||
padding-top: 1px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.doc-col4 {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
align-items: center;
|
||||
min-width: 280px;
|
||||
height: 100%;
|
||||
padding-top: 1px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.doc-col5 {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
width: 90px;
|
||||
height: 100%;
|
||||
padding-right: 10px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.doc-col6 {
|
||||
width: 90px;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.doc-er {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
margin-left: -8px;
|
||||
}
|
||||
|
||||
.info-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #000;
|
||||
margin-left: 4px;
|
||||
font-weight: 400;
|
||||
letter-spacing: 1px;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
align-items: center;
|
||||
margin-right: 25px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.edit-button {
|
||||
height: 32px;
|
||||
width: 80px;
|
||||
margin-right: 10px;
|
||||
padding-top: 3px !important;
|
||||
border: 1px solid #1a76c7 !important;
|
||||
background-color: #fff;
|
||||
color: #1a76c7;
|
||||
}
|
||||
|
||||
.edit-button:hover {
|
||||
background-color: #f2fbfd;
|
||||
color: #1a76c7;
|
||||
}
|
||||
|
||||
.save-button {
|
||||
height: 32px;
|
||||
width: 80px;
|
||||
margin-right: 10px;
|
||||
padding-top: 3px !important;
|
||||
background-color: #1a76c7;
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: #1a76c7;
|
||||
color: #ffff;
|
||||
}
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
height: 32px;
|
||||
width: 80px;
|
||||
padding-top: 3px !important;
|
||||
margin-right: 20px;
|
||||
border: 1px solid #1a76c7 !important;
|
||||
background-color: #fff;
|
||||
color: #1a76c7;
|
||||
}
|
||||
|
||||
.doc-file-icon {
|
||||
//cursor: pointer;
|
||||
}
|
||||
|
||||
.cards-item-actions {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.delete-one {
|
||||
padding-top: 5px !important;
|
||||
}
|
||||
|
||||
.info-edit-input {
|
||||
padding: 0px 0px 0px 10px !important;
|
||||
height: 40px !important;
|
||||
min-height: 0px !important;
|
||||
width: 90% !important;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.doccard-button-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-left: 10px;
|
||||
width: 158px;
|
||||
}
|
||||
|
||||
.delete-doc-button {
|
||||
min-width: 80px !important;
|
||||
width: 80px !important;
|
||||
&:hover {
|
||||
border: none !important;
|
||||
border-color: #1a76c7 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.gen-button {
|
||||
width: 156px !important;
|
||||
}
|
||||
109
src/styles/case-details.scss
Normal file
109
src/styles/case-details.scss
Normal file
@@ -0,0 +1,109 @@
|
||||
.details-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.details-heading-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
padding: 10px;
|
||||
border: 1px solid var(--ultra-light-accent);
|
||||
border-radius: 10px;
|
||||
background-color: var(--barely-there-accent);
|
||||
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
|
||||
}
|
||||
|
||||
.details-subhead {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.pheno-phun {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.details-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.details-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.details-button-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin: 12px 0px;
|
||||
}
|
||||
|
||||
.details-button-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
margin-top: 8px;
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.back-button-box {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.details-heading {
|
||||
font-weight: 500;
|
||||
margin-bottom: 0.5rem;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.details-heading2 {
|
||||
margin-left: 2px;
|
||||
margin-right: 12px;
|
||||
margin-bottom: 12px !important;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: var(--font-medium);
|
||||
}
|
||||
|
||||
.details-heading3 {
|
||||
margin-left: 26px;
|
||||
padding-left: 12px;
|
||||
margin-bottom: 12px !important;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: var(--font-medium);
|
||||
}
|
||||
|
||||
.details-heading4 {
|
||||
padding-left: 12px;
|
||||
margin-bottom: 12px !important;
|
||||
margin-right: 8px;
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: var(--font-medium);
|
||||
}
|
||||
|
||||
.details-butn-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.upload-button-box {
|
||||
margin-left: 8px;
|
||||
}
|
||||
18
src/styles/caselist-page.scss
Normal file
18
src/styles/caselist-page.scss
Normal file
@@ -0,0 +1,18 @@
|
||||
.foo {
|
||||
height: 300px;
|
||||
&:hover {
|
||||
border: 2px solid #f27300;
|
||||
}
|
||||
}
|
||||
|
||||
.new-case-button {
|
||||
height: 50px;
|
||||
width: 150px;
|
||||
background-color: #1a76c7;
|
||||
color: #fff;
|
||||
border-radius: 10px;
|
||||
border-style: none;
|
||||
&:hover {
|
||||
border: 2px solid #f27300;
|
||||
}
|
||||
}
|
||||
225
src/styles/contact.scss
Normal file
225
src/styles/contact.scss
Normal file
@@ -0,0 +1,225 @@
|
||||
.contactContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
.contactInner {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 350px;
|
||||
width: 100%;
|
||||
margin-top: 15px;
|
||||
background-color: #f5fcfc;
|
||||
}
|
||||
|
||||
.contactLeftColumn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 50%;
|
||||
height: 350px;
|
||||
border-radius: 40px 0px 40px 0px;
|
||||
border: 1px solid #1093ff;
|
||||
}
|
||||
|
||||
.contactRightColumn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 350px;
|
||||
width: 50%;
|
||||
border-radius: 40px 0px 40px 0px;
|
||||
border: 1px solid #2196f3;
|
||||
}
|
||||
|
||||
.contactLink {
|
||||
font-size: 1rem;
|
||||
letter-spacing: -0.07rem;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.contact-link-two {
|
||||
font-size: 0.95rem;
|
||||
letter-spacing: 0.3rem;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
padding-right: 25px;
|
||||
}
|
||||
|
||||
.contactLinkThree {
|
||||
letter-spacing: 1rem;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.contactLinkFour {
|
||||
letter-spacing: 1rem;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.contactLinkFive {
|
||||
font-size: 0.95rem;
|
||||
letter-spacing: 0.45rem;
|
||||
color: #acacac;
|
||||
text-decoration: none;
|
||||
margin-left: 10px;
|
||||
padding-left: 35px;
|
||||
}
|
||||
|
||||
.contactLinkSix {
|
||||
font-size: 0.95rem;
|
||||
letter-spacing: 0.1rem;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.contact-info-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
width: 60%;
|
||||
height: 80%;
|
||||
}
|
||||
|
||||
.contact-detail-one {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
height: 50px;
|
||||
margin: 12px 0px;
|
||||
background-color: rgb(56, 56, 233);
|
||||
}
|
||||
|
||||
.contact-detail-two {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
height: 50px;
|
||||
margin: 12px 0px;
|
||||
background-color: hsl(17, 100%, 61%);
|
||||
letter-spacing: 0.2rem;
|
||||
}
|
||||
|
||||
.contact-detail-three {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
height: 50px;
|
||||
margin: 12px 0px;
|
||||
background-color: rgb(93, 206, 255);
|
||||
letter-spacing: 0.5rem;
|
||||
}
|
||||
|
||||
.contactDetailFour {
|
||||
width: 40%;
|
||||
background-color: orange;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.contactDetailFive {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
background-color: yellow;
|
||||
letter-spacing: 0.6rem;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.contactDetailSix {
|
||||
background-color: #acacac;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.imgBox {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.imgBoxOne {
|
||||
display: flex;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.imgBoxTwo {
|
||||
display: flex;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.imgBoxThree {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.threeInner {
|
||||
display: flex;
|
||||
margin-left: 5px;
|
||||
height: 300px;
|
||||
width: 130px;
|
||||
border-radius: 0px;
|
||||
overflow: hidden;
|
||||
opacity: 0.7;
|
||||
background: linear-gradient(to left, rgba(245, 246, 252, 0.52), cyan);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 430px) {
|
||||
.contactInner {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.contactLeftColumn {
|
||||
width: 100%;
|
||||
}
|
||||
.contactRightColumn {
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
margin-top: 25px;
|
||||
}
|
||||
.contactInfoBox {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.contactDetailTwo {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.contactDetailThree {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-link-three {
|
||||
color: black;
|
||||
letter-spacing: 1rem;
|
||||
text-decoration: none;
|
||||
letter-spacing: 1.2rem;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.contactLink {
|
||||
letter-spacing: 0.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
.threeInner {
|
||||
display: flex;
|
||||
margin-left: 5px;
|
||||
height: 300px;
|
||||
width: 130px;
|
||||
border-radius: 0px;
|
||||
overflow: hidden;
|
||||
opacity: 0.4;
|
||||
background: linear-gradient(to left, rgba(245, 246, 252, 0.52), red);
|
||||
}
|
||||
*/
|
||||
17
src/styles/custom.scss
Normal file
17
src/styles/custom.scss
Normal file
@@ -0,0 +1,17 @@
|
||||
$font-family-sans-serif: "Roboto", "Karla", "Great Vibes", "Helvetica Neue",
|
||||
system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Liberation Sans",
|
||||
Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
|
||||
"Noto Color Emoji" !default;
|
||||
$font-family-italic: "Roboto Regular 400 Italic";
|
||||
$navbar-padding-y: 1.2rem;
|
||||
$navbar-padding-x: 2rem;
|
||||
$headings-margin-bottom: 1rem;
|
||||
$primary: #1a76c7;
|
||||
$haq-blue: #edf4f5;
|
||||
$text-dark: #000;
|
||||
$text-medium: #767676;
|
||||
$text-light: #a9a9a9;
|
||||
$ultra-light-accent: #e4e4e4;
|
||||
$accent-orange: #f27300;
|
||||
$link-decoration: none;
|
||||
$link-hover-decoration: underline;
|
||||
87
src/styles/dashboard.scss
Normal file
87
src/styles/dashboard.scss
Normal file
@@ -0,0 +1,87 @@
|
||||
@use "sass:map";
|
||||
|
||||
.dashboard-header {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: flex-end;
|
||||
flex-direction: column;
|
||||
margin: 30px 0px 0px 0px;
|
||||
}
|
||||
|
||||
.dash-heading-text {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
.create-new-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.view-all-link {
|
||||
margin-right: 10px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.view-all-link-box {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.arrow-wrapper > svg {
|
||||
color: #fa6400;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.user-name-container2 {
|
||||
margin-top: -4px;
|
||||
margin-left: 8px;
|
||||
font-weight: 500;
|
||||
color: var(--font-light);
|
||||
}
|
||||
|
||||
.dash-divider {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.stats-row-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
margin: 12px 0px;
|
||||
padding: 0px 6px;
|
||||
background-color: #f5f5f5;
|
||||
height: 42px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.stats-unit-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.stats-text {
|
||||
margin-right: 8px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.stats-icon-wrapper {
|
||||
margin: 0px 10px 2px 10px;
|
||||
}
|
||||
|
||||
.dashboard-filter {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
justify-content: flex-end;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: map.get($grid-breakpoints, "md")) {
|
||||
.dashboard-filter {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
13
src/styles/demo-request-page.scss
Normal file
13
src/styles/demo-request-page.scss
Normal file
@@ -0,0 +1,13 @@
|
||||
.requestdemo-para {
|
||||
font-size: 1.3rem;
|
||||
margin-top: -12px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.demo-request-form {
|
||||
width: 760px;
|
||||
}
|
||||
|
||||
.requestdemo-tagline {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
38
src/styles/detailcard.scss
Normal file
38
src/styles/detailcard.scss
Normal file
@@ -0,0 +1,38 @@
|
||||
.det-card-card-outer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid var(--ultra-light-accent);
|
||||
background-color: #fcfcfc;
|
||||
padding: 5px 0px;
|
||||
border-radius: 10px;
|
||||
min-width: 700px;
|
||||
//box-shadow: rgba(204, 216, 228, 0.2) 0px 8px 24px;
|
||||
}
|
||||
|
||||
.detail-card-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.detail-card-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 200px;
|
||||
width: 32%;
|
||||
margin: 4px 4px;
|
||||
padding: 0px 12px;
|
||||
}
|
||||
|
||||
.detail-card-detail {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.detail-subhead {
|
||||
letter-spacing: 1px;
|
||||
font-weight: 500;
|
||||
}
|
||||
376
src/styles/docedit-page.scss
Normal file
376
src/styles/docedit-page.scss
Normal file
@@ -0,0 +1,376 @@
|
||||
.docedit-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.edit-divider-spacer {
|
||||
margin-bottom: 20px !important;
|
||||
}
|
||||
|
||||
.docedit-outer-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.docedit-header-text {
|
||||
margin-top: 50px;
|
||||
padding-top: 38px;
|
||||
color: #c5c5c5;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.edit-header-wrapper {
|
||||
width: 700px;
|
||||
}
|
||||
|
||||
.doc-editing-sub-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.doc-edit-subheader {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.req-item-outer-div {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.req-item-inner-div {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.doc-editing-button-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.edit-back-button {
|
||||
height: 50px;
|
||||
width: 215px;
|
||||
margin-right: 20px;
|
||||
border: 1px solid #1a76c7 !important;
|
||||
background-color: #fff !important;
|
||||
color: #1a76c7 !important;
|
||||
&:hover {
|
||||
background-color: var(--background-blue) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.edit-save-button {
|
||||
height: 50px;
|
||||
width: 150px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.generate-button-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 50px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.docedit-super-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
min-height: 55px;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.docedit-header-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 210px;
|
||||
color: #000000;
|
||||
font-weight: 500;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.docedit-header-col1 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
justify-content: left;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.docedit-header-col2 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 60%;
|
||||
height: 210px;
|
||||
margin-bottom: 8px;
|
||||
color: #000;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.docedit-header-col3 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin: auto;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
color: #373737;
|
||||
}
|
||||
|
||||
.header-middle-row1 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 4px 0px;
|
||||
padding: 4px 0px;
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.header-middle-row2 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 4px 0px;
|
||||
padding: 4px 0px;
|
||||
justify-content: space-between;
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.header-middle-row3 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 4px 0px 12px 0px;
|
||||
padding: 4px 0px;
|
||||
justify-content: space-between;
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.middle-row-inner {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.content-spacer {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.content-spacer2 {
|
||||
width: 116px;
|
||||
}
|
||||
|
||||
.header-middle-row4 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 4px 0px 6px 0px;
|
||||
padding: 4px 0px;
|
||||
justify-content: space-between;
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.header-middle-row5 {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 4px;
|
||||
padding: 4px 0px;
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.aginum {
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.aginum-agin {
|
||||
color: #373737;
|
||||
letter-spacing: 0.02rem;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.docedit-uppercol1 {
|
||||
width: 20%;
|
||||
color: #373737;
|
||||
}
|
||||
|
||||
.docedit-uppercol2 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 60%;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.docedit-uppercol-divider {
|
||||
width: 470px;
|
||||
border-bottom: 2px solid #c3c3c3;
|
||||
}
|
||||
|
||||
.docedit-uppercol3 {
|
||||
width: 20%;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.left-caption-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 6px;
|
||||
width: 50%;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.right-caption-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
width: 50%;
|
||||
margin: 25px 15px;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.doc-editing-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 60%;
|
||||
margin: 22px auto;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.casenum-box {
|
||||
margin-left: 15px;
|
||||
padding-left: 15px;
|
||||
color: #4e4e4e;
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.peez {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-right: 35px;
|
||||
margin-right: 20px;
|
||||
color: var(--font-light);
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.deez {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
padding-right: 23px;
|
||||
margin-right: 20px;
|
||||
margin-top: 5px;
|
||||
color: var(--font-light);
|
||||
letter-spacing: 0.02rem;
|
||||
}
|
||||
|
||||
.caption-box {
|
||||
word-spacing: 20px;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.topline-box {
|
||||
padding-top: 8px;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.topline-box2 {
|
||||
margin-top: 20px;
|
||||
padding-top: 8px;
|
||||
color: #4e4e4e;
|
||||
}
|
||||
|
||||
.edit-ele-input {
|
||||
color: #7d7d7d;
|
||||
}
|
||||
|
||||
.request-text-up {
|
||||
color: #a2a2a2;
|
||||
margin-top: 6px;
|
||||
padding: 0px 5px;
|
||||
}
|
||||
|
||||
.outer-div {
|
||||
border: 1px solid #a9a9a9;
|
||||
padding: 0px 5px;
|
||||
}
|
||||
|
||||
.pleading-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
letter-spacing: 0.02rem;
|
||||
padding: 0px 5px;
|
||||
margin: auto;
|
||||
text-decoration: underline;
|
||||
margin-bottom: 20px;
|
||||
font-weight: 500;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.scroll-button {
|
||||
position: fixed;
|
||||
top: 250px;
|
||||
right: 70px;
|
||||
width: 150px;
|
||||
height: 50px;
|
||||
background-color: #fff !important;
|
||||
color: #1a76c7 !important;
|
||||
border-color: #1a76c7 !important;
|
||||
&:hover {
|
||||
border-color: #1a76c7 !important;
|
||||
background-color: #ffeee3 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.create-gen-button {
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: #1664a9;
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.numbering-container {
|
||||
color: #a2a2a2;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.docedit-errstate-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1140px) {
|
||||
.scroll-button {
|
||||
right: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1080px) {
|
||||
.scroll-button {
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.prelim-statement-container {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
55
src/styles/doclist-page.scss
Normal file
55
src/styles/doclist-page.scss
Normal file
@@ -0,0 +1,55 @@
|
||||
.doc-list-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 25px 0px;
|
||||
background-color: #e6e6e653;
|
||||
border-radius: 10px;
|
||||
height: 85px;
|
||||
padding: 0px 0px 0px 15px;
|
||||
}
|
||||
|
||||
.doc-header-text {
|
||||
margin-bottom: -7px !important;
|
||||
margin-left: 6px;
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.nodocs-text-container {
|
||||
border-top: 1px solid #dcd9d9 !important;
|
||||
margin-top: 6px;
|
||||
margin: 15px 15px;
|
||||
padding: 15px 25px;
|
||||
}
|
||||
|
||||
.nodocs-text {
|
||||
padding: 3px 5px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.nodocs-light-text {
|
||||
padding: 3px 5px;
|
||||
}
|
||||
|
||||
.nodocs-list-item {
|
||||
padding: 3px 0px;
|
||||
}
|
||||
|
||||
.document-list-lower-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.user-name-container {
|
||||
margin-top: 8px;
|
||||
margin-left: 7px;
|
||||
color: var(--font-light);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.dropdown-container {
|
||||
padding: 0rem 1rem;
|
||||
}
|
||||
16
src/styles/edit-element.scss
Normal file
16
src/styles/edit-element.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
.outer-div {
|
||||
border: 1px solid black;
|
||||
}
|
||||
|
||||
.outer-div-after {
|
||||
border: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.edit-ele-input {
|
||||
border: none;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
min-height: 200px;
|
||||
resize: none;
|
||||
}
|
||||
79
src/styles/features.scss
Normal file
79
src/styles/features.scss
Normal file
@@ -0,0 +1,79 @@
|
||||
.features-container {
|
||||
margin-bottom: 38px;
|
||||
}
|
||||
|
||||
.features-top-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 28px 5px;
|
||||
padding: 0px 8px;
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.features-header-text {
|
||||
margin-top: 8px;
|
||||
margin-left: 8px;
|
||||
padding-left: 7px;
|
||||
}
|
||||
|
||||
.features-bottom-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin: 42px 5px 8px 5px;
|
||||
padding: 0px 8px;
|
||||
width: 100%;
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.features-top-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 6px 8px;
|
||||
width: 45%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.features-top-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 18px 8px;
|
||||
width: 55%;
|
||||
height: 100%;
|
||||
background-color: var(--haq-blue);
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.features-bottom-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 6px 8px;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.features-bottom-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 18px 8px;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
background-color: var(--haq-blue);
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.features-image-one {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-right: 10px;
|
||||
height: 300px;
|
||||
float: right;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.features-list-item {
|
||||
width: 94%;
|
||||
text-align: justify;
|
||||
font-size: 1.05rem;
|
||||
margin: 28px 0px;
|
||||
}
|
||||
99
src/styles/footer.scss
Normal file
99
src/styles/footer.scss
Normal file
@@ -0,0 +1,99 @@
|
||||
.footer-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 8px;
|
||||
background-color: var(--bluest-blue);
|
||||
}
|
||||
|
||||
.footer-upper-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 150px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.footer-right-box {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 12px;
|
||||
padding: 10px 20px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.footer-left-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 10px 20px;
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.footer-logo {
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.footer-left-inner {
|
||||
width: 100%;
|
||||
height: 95%;
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
|
||||
.footer-lower-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
//border-top: 1px solid #ffd7b1;
|
||||
height: 50px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
margin: 0px 10px;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.footer-item-link {
|
||||
letter-spacing: 0.11rem;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
margin: 0px 10px;
|
||||
padding: 0px 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
background-color: var(
|
||||
--bluest-blue
|
||||
); //#4675c3; // before Ali: #4e6a98; // #18263c; //#a7b1c0 #22416f //#22416f
|
||||
*/
|
||||
|
||||
@media only screen and (max-width: 430px) {
|
||||
.footer-left-box {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.footer-left-inner {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.footer-right-box {
|
||||
width: 60%;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.footer-logo {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.footer-item-link {
|
||||
font-size: 0.87rem;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
font-size: 0.87rem;
|
||||
}
|
||||
}
|
||||
1291
src/styles/homepage.scss
Normal file
1291
src/styles/homepage.scss
Normal file
File diff suppressed because it is too large
Load Diff
85
src/styles/howTo-page.scss
Normal file
85
src/styles/howTo-page.scss
Normal file
@@ -0,0 +1,85 @@
|
||||
.doc-list-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
margin: 25px 0px;
|
||||
background-color: #e6e6e653;
|
||||
border-radius: 10px;
|
||||
height: 85px;
|
||||
padding: 0px 0px 0px 16px;
|
||||
}
|
||||
|
||||
.doc-header-text {
|
||||
margin-bottom: -7px !important;
|
||||
margin-left: 6px;
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.user-name-container {
|
||||
margin-top: 8px;
|
||||
margin-left: 7px;
|
||||
color: var(--font-light);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.how-to-info-container {
|
||||
.how-to-info-wrapper {
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.how-to-image-wrapper {
|
||||
display: flex;
|
||||
max-width: 1100px;
|
||||
height: 100%;
|
||||
background-color: var(--haq-blue); //#e6e6e653;
|
||||
border-radius: 10px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.how-to-info-svg {
|
||||
padding: 30px 30px;
|
||||
width: 80%;
|
||||
height: 0%;
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.how-to-steps-container {
|
||||
margin: 5px 20px;
|
||||
}
|
||||
.steps-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 25px 0px;
|
||||
background-color: #e6e6e653;
|
||||
border-radius: 10px;
|
||||
padding: 16px 38px 16px 25px;
|
||||
text-align: justify;
|
||||
|
||||
strong {
|
||||
font-weight: 500;
|
||||
}
|
||||
ol {
|
||||
li {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.doc-header-text {
|
||||
margin-bottom: 16px !important;
|
||||
margin-left: 0px;
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.steps-p {
|
||||
margin-bottom: 14px;
|
||||
padding: 0px 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
32
src/styles/index.scss
Normal file
32
src/styles/index.scss
Normal file
@@ -0,0 +1,32 @@
|
||||
@import "custom";
|
||||
@import "~bootstrap/scss/bootstrap";
|
||||
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital@1&display=swap ");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Karla&family=Roboto&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap");
|
||||
|
||||
@import "app";
|
||||
@import "text-input";
|
||||
@import "progress-bar";
|
||||
@import "buttons";
|
||||
@import "cards";
|
||||
@import "case-details";
|
||||
@import "caselist-page";
|
||||
@import "upload-modal";
|
||||
@import "navbar";
|
||||
@import "navpanel";
|
||||
@import "account-page";
|
||||
@import "dashboard";
|
||||
@import "docedit-page";
|
||||
@import "doclist-page";
|
||||
@import "edit-element";
|
||||
@import "radio-group";
|
||||
@import "login";
|
||||
@import "password-reset";
|
||||
@import "footer";
|
||||
@import "footer";
|
||||
@import "modals";
|
||||
73
src/styles/login.scss
Normal file
73
src/styles/login.scss
Normal file
@@ -0,0 +1,73 @@
|
||||
.login-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 25px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.login-header-text {
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.login-button-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.login-form-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 25px;
|
||||
width: 600px;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
background-color: var(--background-blue);
|
||||
border: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
.login-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.login-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
letter-spacing: -0.1px;
|
||||
}
|
||||
|
||||
.password-input-container {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.recover-link {
|
||||
font-size: 1rem;
|
||||
margin: 4px 0px 0px 3px;
|
||||
padding-left: 2px;
|
||||
background-color: transparent;
|
||||
color: #0d6efd;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.recover-link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.register-box {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.login-alert {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.create-link {
|
||||
color: #0d6efd;
|
||||
}
|
||||
74
src/styles/modals.scss
Normal file
74
src/styles/modals.scss
Normal file
@@ -0,0 +1,74 @@
|
||||
.edit-modal-label {
|
||||
font-size: 0.95rem;
|
||||
font-family: Roboto;
|
||||
font-weight: 400;
|
||||
padding-left: 6px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
height: 43px;
|
||||
width: 70px;
|
||||
}
|
||||
|
||||
.modal-header-text-wrapper {
|
||||
margin-bottom: 12px;
|
||||
padding: 0px 8px;
|
||||
}
|
||||
|
||||
.upload-modal-header-text {
|
||||
font-family: Roboto;
|
||||
font-weight: 400;
|
||||
line-height: 1.25rem;
|
||||
margin: 0px 0px 10px 0px;
|
||||
}
|
||||
|
||||
.modal-document-error {
|
||||
margin: -10px 2px 0px 5px;
|
||||
color: red;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.create-modal-header {
|
||||
padding-left: 15px;
|
||||
margin-bottom: 29px;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.009rem;
|
||||
line-height: 1.2rem;
|
||||
}
|
||||
|
||||
.modal-caption-row {
|
||||
background-color: rgba(230, 230, 230, 0.3254901961);
|
||||
padding: 15px;
|
||||
margin-bottom: 12px;
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.modal-caption-vee {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.009rem;
|
||||
line-height: 1.2rem;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
|
||||
.caption-one-container {
|
||||
&.pe-input-container .form-floating .mb-3 {
|
||||
margin-bottom: 0px !important;
|
||||
&.form-label {
|
||||
margin-bottom: 0px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.caption-one-container > .mb-3 {
|
||||
margin-bottom: 0px !important;
|
||||
}
|
||||
|
||||
.create-modal-input {
|
||||
font-weight: 400;
|
||||
}
|
||||
123
src/styles/navbar.scss
Normal file
123
src/styles/navbar.scss
Normal file
@@ -0,0 +1,123 @@
|
||||
.navbar-wrapper {
|
||||
border-bottom: 1px solid #ffe2c8;
|
||||
}
|
||||
|
||||
.navbar-main {
|
||||
height: 5rem;
|
||||
background-color: rgb(240, 247, 250);
|
||||
color: var(--accent-orange);
|
||||
.navbar-nav {
|
||||
gap: 1.3rem;
|
||||
}
|
||||
|
||||
.nav-button {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
font-family: "Roboto";
|
||||
cursor: pointer;
|
||||
color: #767676;
|
||||
font-weight: 500;
|
||||
outline: none;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-items {
|
||||
color: #5f5f5f;
|
||||
font-size: 1.1rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.navbar-user-info {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.navbar-gear {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
padding: 0.5rem;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.navbar-gear > svg {
|
||||
color: #fa6400;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-main-spacer {
|
||||
height: 5rem;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.logo-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 167px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
|
||||
.novo-logo {
|
||||
height: 5rem;
|
||||
}
|
||||
|
||||
.nav-row {
|
||||
margin-top: 13px;
|
||||
margin-left: 5px;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.nav-menu-container {
|
||||
padding-right: 10px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.navbar-mobile-hamburg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 430px) {
|
||||
.main-container {
|
||||
margin-top: 36px;
|
||||
}
|
||||
|
||||
.desktop-hamburg {
|
||||
display: none;
|
||||
}
|
||||
.nav-logo {
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
.nav-row {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-items {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.me-auto {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.logo-container {
|
||||
width: 850px;
|
||||
}
|
||||
|
||||
.navbar-mobile-hamburg {
|
||||
display: flex;
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
justify-content: end;
|
||||
align-items: center;
|
||||
margin: auto;
|
||||
padding-top: 7px;
|
||||
}
|
||||
|
||||
.navbar-mobile-hamburg > svg {
|
||||
color: #fa6400;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
123
src/styles/navpanel.scss
Normal file
123
src/styles/navpanel.scss
Normal file
@@ -0,0 +1,123 @@
|
||||
.mobile-main-heading-hide {
|
||||
position: fixed;
|
||||
top: 55px;
|
||||
left: 0px;
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 420px;
|
||||
z-index: 999;
|
||||
transition-property: all;
|
||||
transition-duration: 0.5s;
|
||||
transition-timing-function: linear;
|
||||
visibility: hidden;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.mobile-main-heading-show {
|
||||
position: fixed;
|
||||
top: 55px;
|
||||
left: 0px;
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 420px;
|
||||
z-index: 999;
|
||||
transition-property: all;
|
||||
transition-duration: 0.5s;
|
||||
transition-timing-function: linear;
|
||||
visibility: visible;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
.mobile-heading-wrapper {
|
||||
position: fixed;
|
||||
top: 70px;
|
||||
right: 0px;
|
||||
background: linear-gradient(to left, rgba(245, 246, 252, 0.52), cyan);
|
||||
width: 0px;
|
||||
height: 461px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
transition-property: width;
|
||||
transition-duration: 0.5s;
|
||||
transition-timing-function: linear;
|
||||
border: 1px solid blue;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.mobile-heading-wrapper1 {
|
||||
position: fixed;
|
||||
top: 70px;
|
||||
right: 0px;
|
||||
background: linear-gradient(to left, rgba(245, 246, 252, 0.52), cyan);
|
||||
width: 430px;
|
||||
height: 461px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
transition-property: width;
|
||||
transition-duration: 0.5s;
|
||||
transition-timing-function: linear;
|
||||
z-index: 999;
|
||||
border: 1px solid blue;
|
||||
}
|
||||
|
||||
.mobile-heading-wrap {
|
||||
position: relative;
|
||||
margin: 0px 10px;
|
||||
margin-top: 7px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.mobile-info-box {
|
||||
height: 680px;
|
||||
background: linear-gradient(to left, rgba(245, 246, 252, 0.52), cyan);
|
||||
}
|
||||
|
||||
.mobile-heading-link-wrap {
|
||||
width: 330px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
margin: 50px 10px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.mobile-heading-link-box {
|
||||
margin-top: 10px;
|
||||
padding-top: 2px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.mobile-heading-links {
|
||||
padding-top: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mobile-lower {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.mobile-border-div {
|
||||
text-align: center;
|
||||
border-bottom: 1px solid var(--grayish-violet);
|
||||
width: 280px;
|
||||
}
|
||||
|
||||
.mobile-heading-close {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mobile-heading-close {
|
||||
color: #888888;
|
||||
font-weight: bold;
|
||||
font-size: 3em;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.ks-mobile_heading_submenu_links {
|
||||
width: 100%;
|
||||
}
|
||||
110
src/styles/njcaption.scss
Normal file
110
src/styles/njcaption.scss
Normal file
@@ -0,0 +1,110 @@
|
||||
.njcap-thirds {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 12px;
|
||||
padding-top: 8px;
|
||||
width: 100%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 20%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-middle {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 60%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-middle-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 60%;
|
||||
height: 280;
|
||||
}
|
||||
|
||||
.njcap-parties {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.njcap-vee {
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.njcap-plaintiff {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.njcap-plaintiff-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 30px;
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.njcap-middle-right {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 30px;
|
||||
width: 40%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-middle-right-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 10%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-middle-right-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 90%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 20%;
|
||||
height: 280px;
|
||||
}
|
||||
|
||||
.njcap-divider {
|
||||
margin-top: 2px;
|
||||
border-bottom: 1px solid #000;
|
||||
}
|
||||
|
||||
.njcap-divider2 {
|
||||
margin-top: 12px;
|
||||
height: 4px;
|
||||
border-top: 1px solid #000;
|
||||
}
|
||||
|
||||
.njcap-case-info-top {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 4px;
|
||||
margin-right: 4px;
|
||||
padding-right: 3px;
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.njcap-case-info {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 5px;
|
||||
margin-right: 4px;
|
||||
padding-right: 3px;
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
}
|
||||
65
src/styles/password-reset.scss
Normal file
65
src/styles/password-reset.scss
Normal file
@@ -0,0 +1,65 @@
|
||||
.password-reset-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 25px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.password-reset-header-text {
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.password-reset-button-wrapper {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.password-reset-form-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 25px;
|
||||
width: 600px;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
background-color: var(--background-blue);
|
||||
border: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
.password-reset-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 240px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.password-reset-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
letter-spacing: -0.1px;
|
||||
}
|
||||
|
||||
.success-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0px auto;
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
.reset-sent-text {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
.alert-box {
|
||||
min-height: 35px;
|
||||
}
|
||||
|
||||
.password-reset-alert {
|
||||
padding-left: 5px;
|
||||
color: red;
|
||||
}
|
||||
16
src/styles/progress-bar.scss
Normal file
16
src/styles/progress-bar.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
.progress-bar {
|
||||
width: 100%;
|
||||
background-color: #e0e0e0;
|
||||
padding: 3px;
|
||||
margin: 15px 0;
|
||||
border-radius: 3px;
|
||||
box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);
|
||||
|
||||
&-fill {
|
||||
display: block;
|
||||
height: 22px;
|
||||
background-color: #ffcb9b;
|
||||
border-radius: 3px;
|
||||
transition: width 500ms ease-in-out;
|
||||
}
|
||||
}
|
||||
107
src/styles/radio-group.scss
Normal file
107
src/styles/radio-group.scss
Normal file
@@ -0,0 +1,107 @@
|
||||
.checkbox-title {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 8px;
|
||||
color: #767676;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.op-div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.radio-group-wrapper {
|
||||
height: 85px;
|
||||
width: 372px;
|
||||
margin-left: 1px;
|
||||
margin-bottom: 24px;
|
||||
padding-left: 8px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #d4d4d4;
|
||||
}
|
||||
.checkbox-options-section {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
background: white;
|
||||
border-color: #000;
|
||||
border-radius: 6px;
|
||||
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
|
||||
}
|
||||
.checkbox-option-div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 65px;
|
||||
}
|
||||
|
||||
.option-li:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.option-div {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding-bottom: 12px;
|
||||
padding-top: 12px;
|
||||
}
|
||||
.option-label {
|
||||
margin-top: -5px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.option-subdiv {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.option-title {
|
||||
color: #000;
|
||||
font-weight: 700;
|
||||
margin: 1px;
|
||||
}
|
||||
.option-value {
|
||||
color: #000;
|
||||
font-weight: 800;
|
||||
margin: 1px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.circle-container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #f27300;
|
||||
}
|
||||
|
||||
.circle-container > svg {
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.zora {
|
||||
height: 65px;
|
||||
width: 110px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.checked-icon {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 140px;
|
||||
}
|
||||
|
||||
.m-1 {
|
||||
margin: 1rem;
|
||||
}
|
||||
.mb-3 {
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
.clickable-icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
47
src/styles/signup.scss
Normal file
47
src/styles/signup.scss
Normal file
@@ -0,0 +1,47 @@
|
||||
.signup-super-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.signup-sub-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 45px;
|
||||
width: 920px;
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
background-color: rgb(240, 247, 250);
|
||||
border: 1px solid #e9e9e9;
|
||||
}
|
||||
|
||||
.signup-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.signup-header-text {
|
||||
letter-spacing: -0.6px;
|
||||
font-weight: 400;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.signup-form {
|
||||
width: 880px;
|
||||
}
|
||||
|
||||
.signup-button-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.signup-btn {
|
||||
width: 150px;
|
||||
}
|
||||
40
src/styles/spinner.scss
Normal file
40
src/styles/spinner.scss
Normal file
@@ -0,0 +1,40 @@
|
||||
.spinner-outer-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.spinner-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 4px;
|
||||
padding: 10px 0px;
|
||||
border-bottom: 1px solid #ffd7b1;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.loading-text-box {
|
||||
font-weight: 400;
|
||||
font-size: 0.98rem;
|
||||
letter-spacing: -0.3px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 5px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding: 10px 0px 20px 0px;
|
||||
width: 500px;
|
||||
}
|
||||
|
||||
.loading-graph {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: var(--font-lighter);
|
||||
padding: 10px 0px 8px 0px;
|
||||
border-bottom: 1px solid #ffd7b1;
|
||||
width: 500px;
|
||||
}
|
||||
13
src/styles/text-input.scss
Normal file
13
src/styles/text-input.scss
Normal file
@@ -0,0 +1,13 @@
|
||||
.pe-input-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.textinput-error-box {
|
||||
margin: 0px 2px 0px 5px;
|
||||
font-size: 0.85rem;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.select-option:hover {
|
||||
background-color: white;
|
||||
}
|
||||
22
src/styles/upload-modal.scss
Executable file
22
src/styles/upload-modal.scss
Executable file
@@ -0,0 +1,22 @@
|
||||
.file-uploader {
|
||||
display: flex;
|
||||
> label {
|
||||
flex: 1 0;
|
||||
}
|
||||
.drag-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
border: $border-width solid $border-color;
|
||||
border-radius: $border-radius;
|
||||
background-color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
.filled {
|
||||
border: $border-width solid rgb(96, 205, 255);
|
||||
background-color: rgb(241, 241, 241);
|
||||
}
|
||||
}
|
||||
//
|
||||
Reference in New Issue
Block a user