OpenServer/SecureNotes
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Moving to new theme

Browse Source
This commit is contained in:
Fabian
2019-06-18 22:55:04 +02:00
parent 560828f4a2
commit 0b56f9b1a8
21 changed files with 268 additions and 462 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/modals/InputModal.tsx
View File

@ -27,27 +27,24 @@ export class InputModal extends Modal<string> {
render() {
return <Modal.BaseModal modal={this.props.modal}>
<div class="uk-form-horizontal uk-margin-large">
<div class="uk-margin">
<label class="uk-form-label" for={this.rand}>{this.props.modal.fieldname}</label>
<div class="uk-form-controls">
<input
class="uk-input"
id={this.rand}
type={this.props.modal.type}
placeholder={this.props.modal.fieldname}
autofocus
ref={elm => { this.input = elm; }}
onKeyDown={evt => {
if (evt.keyCode === 13) {
this.props.modal.result(this.input.value)
}
}}
/>
</div>
<div>
<div class="input-group">
<label for={this.rand}>{this.props.modal.fieldname}</label>
<input
id={this.rand}
type={this.props.modal.type}
placeholder={this.props.modal.fieldname}
autofocus
ref={elm => { this.input = elm; }}
onKeyDown={evt => {
if (evt.keyCode === 13) {
this.props.modal.result(this.input.value)
}
}}
/>
</div>
<div class="uk-margin" style="text-align: right;">
<button class="uk-button uk-button-primary" style="display: inline-block;" onClick={() => {
<div class="modal-action">
<button class="btn btn-primary" onClick={() => {
this.props.modal.result(this.input.value);
}}>Enter</button>
</div>

2
src/components/modals/LoadingModal.tsx
View File

@ -12,7 +12,7 @@ export default class LoadingModal extends Modal<undefined> {
getComponent() {
return <Modal.BaseModal modal={this}>
<div style="display: flex; justify-content: center;">
<div style="margin: 3rem;" class="uk-spinner uk-icon">
<div style="margin: 3rem;" class="">
<svg width="90" height="90" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg" data-svg="spinner"><circle fill="none" stroke="#000" cx="15" cy="15" r="14" style="stroke-width: 0.333333px;"></circle></svg>
</div>
</div>

4
src/components/modals/Modal.tsx
View File

@ -65,8 +65,8 @@ export default abstract class Modal<T> {
this.props.modal.result(null)
}
}}>
<div id="ModalContent" class="uk-card uk-card-body uk-card-body modal-body" >
<div class="modal-title uk-card-title" style="">
<div id="ModalContent" class="modal" >
<div class="modal-title" style="">
<h3>{this.props.modal.title}</h3>
{/* <div> */}
{!this.props.modal.noClose ?

16
src/components/modals/YesNoModal.tsx
View File

@ -28,15 +28,13 @@ export class YesNoModal extends Modal<boolean> {
render() {
return <Modal.BaseModal modal={this.props.modal}>
<div class="uk-margin-large">
<div style="text-align: right;">
<button class="uk-button uk-button-primary uk-margin-right" style="display: inline-block;" onClick={() => {
this.props.modal.result(false);
}}><span style="text-decoration: underline;">N</span>o</button>
<button class="uk-button uk-button-primary" style="display: inline-block;" onClick={() => {
this.props.modal.result(true);
}}><span style="text-decoration: underline;">Y</span>es</button>
</div>
<div class="modal-action">
<button class="btn-primary" onClick={() => {
this.props.modal.result(false);
}}><span style="text-decoration: underline;">N</span>o</button>
<button class="btn-primary" onClick={() => {
this.props.modal.result(true);
}}><span style="text-decoration: underline;">Y</span>es</button>
</div>
</Modal.BaseModal>
}

25
src/components/modals/modal.scss
View File

@ -19,17 +19,6 @@
}
}
.modal-container>.uk-card {
position: absolute;
left: 0;
right: 0;
top: 10%;
width: 80%;
max-width: 800px;
margin: auto;
background: white;
}
.modal-title {
display: flex;
justify-content: space-between;
@ -37,18 +26,4 @@
>svg {
height: 1em;
}
}
.modal-body {
animation: growModalBox .2s linear;
}
@keyframes growModalBox {
from {
transform: scale(0);
}
to {
transform: scale(1);
}
}