Skip to content
GitLab
Unverified Commit 9e456fa0 authored by ggrund-tsi's avatar ggrund-tsi Committed by GitHub
Browse files

update style (#64) 


Co-authored-by: default avatarGordon Grund <gordon.grund@outlook.de>
parent 244bba5d
Hide whitespace changes
Inline Side-by-side
src/assets/SCSS/custom.scss
View file @ 9e456fa0
......@@ -148,6 +148,9 @@ hr {
font-size: 20px;
align-self: center;
text-align: center;
@include media-breakpoint-up(sm) {
justify-content: flex-end;
}
}
#qr-code-container {
......@@ -176,7 +179,7 @@ hr {
outline: 3px solid $info;
}
.qt-input:hover:not(:focus){
border: 1px solid $info;
border: 1px solid $primary;
}
.btn-primary:focus{
border: 1px solid $info;
......@@ -184,22 +187,27 @@ hr {
// box-shadow: 3px 3px px $info;
outline: 4px solid $info!important;
}
.btn-primary:hover:not(:focus){
border: 1px solid $info;
outline: 3px solid $info;
}
// .btn-primary:hover:not(:focus){
// border: 1px solid $info;
// outline: 3px solid $info;
// }
.btn-info{
border: 1px solid $info;
color: black;
@include media-breakpoint-down(xs) {
padding-right: 15%;
}
}
.btn-info:focus{
border: 1px solid $dark;
border: 1px solid black;
box-shadow:none !important;
// box-shadow: 3px 3px px $info;
outline: 3px solid $dark!important;
}
.btn-info:hover:not(:focus){
border: 1px solid $dark;
outline: 3px solid $dark;
border: 1px solid black;
outline: 3px solid black;
}
.btn-info::after{
position: absolute;
......@@ -208,7 +216,7 @@ hr {
right:8%;
width: 0;
height: 0;
border: solid $dark;
border: solid black;
border-width: 0 3px 3px 0;
display: inline-block;
padding: 4px;
......@@ -284,18 +292,16 @@ hr {
font-size: 22px;
}
.data-label {
font-size: 18px;
font-size: 16px;
line-height: 22px;
}
.input-label {
font-size: 20px;
font-size: 16px;
@include media-breakpoint-up(md) {
font-size: 20px;
}
}
.txt-no-wrap{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.first-col-item {
@include media-breakpoint-up(sm) {
padding-left: 15px;
......@@ -319,6 +325,14 @@ hr {
justify-content: flex-start;
}
}
.jcc-xs-jcfe-md {
display: flex;
justify-content: center;
@include media-breakpoint-up(md) {
justify-content: flex-end;
}
}
.tac-xs-tal-md {
text-align: center;
......
src/components/modules/card-footer.component.tsx
View file @ 9e456fa0
......@@ -13,7 +13,7 @@ const CardFooter = (props: any) => {
<Row>
<Col xs='6' md='3' className='pl-0 pr-2'>
<Button
className='my-1 my-md-0'
className=''
block
onClick={props.handleCancel}
>
......@@ -22,7 +22,7 @@ const CardFooter = (props: any) => {
</Col>
<Col xs='6' md='3' className='pr-0 pl-2'>
<Button
className='my-1 my-md-0 text-dark'
className=''
variant='info'
block
type='submit'
......
src/components/modules/card-header.component.tsx
View file @ 9e456fa0
......@@ -11,10 +11,10 @@ const CardHeader = (props: any) => {
return (!props ? <></> :
<Card.Header id='data-header' className='p-3'>
<Row>
<Col md='6' className='pl-0'>
<Col md='6' className='px-0'>
<Card.Title className='m-md-0 tac-xs-tal-md jcc-xs-jcfs-md' as={'h3'} >{props.title}</Card.Title>
</Col>
<Col md='6' className='d-flex pr-0 justify-content-end'>
<Col md='6' className='d-flex px-0 jcc-xs-jcfe-md'>
<Card.Text id='id-query-text'>{t('translation:query-id-card')}</Card.Text>
</Col>
</Row>
......
src/components/modules/form-group.component.tsx
View file @ 9e456fa0
......@@ -243,7 +243,7 @@ export const PersonInputs = (props: any) => {
{/* date of birth input */}
<Form.Group as={Row} controlId='formDateOfBirthInput' className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:date-of-birth') + '*'}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:date-of-birth') + '*'}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......
src/components/record-recovery-cert-data.component.tsx
View file @ 9e456fa0
......@@ -207,7 +207,7 @@ const RecordRecoveryCertData = (props: any) => {
{/* Date of First Positive Test Result */}
<Form.Group as={Row} controlId='formLastDateInput'className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:first-positive-test-date') + '*'}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:first-positive-test-date') + '*'}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......@@ -248,7 +248,7 @@ const RecordRecoveryCertData = (props: any) => {
{/* Date: Certificate Valid From - To */}
<Form.Group as={Row} controlId='formDateOfBirthInput'className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:cert-valid-from-to') + '*'}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:cert-valid-from-to') + '*'}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......
src/components/record-test-cert-data.component.tsx
View file @ 9e456fa0
......@@ -248,7 +248,7 @@ const RecordTestCertData = (props: any) => {
{/* sampleDateTime */}
<Form.Group as={Row} controlId='formSampleDateTimeInput'className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:sampleDateTime') + '*'}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:sampleDateTime') + '*'}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......@@ -271,7 +271,7 @@ const RecordTestCertData = (props: any) => {
{/* testDateTime */}
<Form.Group as={Row} controlId='formTestDateTimeInput'className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:testDateTime')}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:testDateTime')}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......
src/components/record-vaccination-cert-data.component.tsx
View file @ 9e456fa0
......@@ -255,7 +255,7 @@ const RecordVaccinationCertData = (props: any) => {
{/* vacLastDate */}
<Form.Group as={Row} controlId='formLastDateInput'className='pb-3 mb-0'>
<Form.Label className='input-label txt-no-wrap' column xs='5' sm='3'>{t('translation:vac-last-date') + '*'}</Form.Label>
<Form.Label className='input-label ' column xs='5' sm='3'>{t('translation:vac-last-date') + '*'}</Form.Label>
<Col xs='7' sm='9' className='d-flex'>
<DatePicker
......
src/components/show-certificate.component.tsx
View file @ 9e456fa0
......@@ -151,7 +151,7 @@ const ShowCertificate = (props: any) => {
<Row>
<Col xs='6' md='4' className='pl-0 pr-2'>
<Button
className='my-1 my-md-0'
className=''
block
onClick={handleBack}
>
......@@ -160,7 +160,7 @@ const ShowCertificate = (props: any) => {
</Col>
<Col xs='6' md='3' className='pr-0 pl-2'>
<Button
className='my-1 my-md-0 text-dark'
className=''
variant='info'
block
onClick={finishProcess}
......
src/components/spinner/spinner.component.scss
View file @ 9e456fa0
$primary: #004494;
.loader,
.loader:before,
.loader:after {
border-radius: 50%;
}
.loader {
color: #e91dca;
color: $primary;
font-size: 11px;
text-indent: -99999em;
margin: 55px auto;
......
src/misc/ShowCertificateData.tsx
View file @ 9e456fa0
......@@ -191,7 +191,7 @@ export const ShowCertificateData = (props: any) => {
<Card.Text className='data-header-title jcc-xs-jcfs-sm' >{dataSet.title}</Card.Text>
{dataSet.entries.map((entry) => {
return entry.data
? <Card.Text key={JSON.stringify(entry)} className='data-label jcc-xs-jcfs-sm mb-1' >{`${entry.label}: ${entry.data}`}</Card.Text>
? <Card.Text key={JSON.stringify(entry)} className='data-label jcc-xs-jcfs-sm mb-2' >{`${entry.label}: ${entry.data}`}</Card.Text>
: <React.Fragment key={JSON.stringify(entry)} />
})}
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment