mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
form WIP
This commit is contained in:
Christine Slotty
parent
fb3c8ff74c
commit
0d9d1b595e
@ -1,6 +1,6 @@
|
||||
<?php
|
||||
|
||||
/*
|
||||
/*
|
||||
* To change this license header, choose License Headers in Project Properties.
|
||||
* To change this template file, choose Tools | Templates
|
||||
* and open the template in the editor.
|
||||
@ -8,35 +8,22 @@
|
||||
|
||||
return [
|
||||
// Container element used by control().
|
||||
'inputContainer' => '<div class="form-group row showcase_row_area">{{content}}</div>',
|
||||
'inputContainer' => '{{content}}',
|
||||
// Container element used by control() when a field has an error.
|
||||
//'inputContainerError' => '<div class="input {{type}}{{required}} error">{{content}}{{error}}</div>',
|
||||
'inputContainerError' => '<div class="form-group row showcase_row_area {{type}}{{required}} is-invalid">{{content}}{{error}}</div>',
|
||||
'inputContainerError' => '<div class="{{type}}{{required}} is-invalid">{{content}}{{error}}</div>',
|
||||
// Label element when inputs are not nested inside the label.
|
||||
'label' => '<div class="col-md-3 showcase_text_area">'
|
||||
. '<label{{attrs}}>{{text}}</label>'
|
||||
. '</div>',
|
||||
'label' => '<label{{attrs}} class="form-label">{{text}}</label>',
|
||||
// Generic input element.
|
||||
'input' => '<div class="col-md-9 showcase_content_area">'
|
||||
. '<input type="{{type}}" class="form-control" name="{{name}}"{{attrs}}/>'
|
||||
. '</div>',
|
||||
'input' => '<input type="{{type}}" class="form-control" name="{{name}}"{{attrs}}/>',
|
||||
// Textarea input element,
|
||||
'textarea' => '<div class="col-md-9 showcase_content_area">'
|
||||
. '<textarea class="form-control" name="{{name}}"{{attrs}}>{{value}}</textarea>'
|
||||
. '</div>',
|
||||
'textarea' => '<textarea class="form-control" name="{{name}}"{{attrs}}>{{value}}</textarea>',
|
||||
// Error message wrapper elements.
|
||||
//'error' => '<div class="error-message">{{content}}</div>',
|
||||
//'error' => '{{content}}',
|
||||
'error' => '<div class="col-md-9 offset-md-3 showcase_content_area invalid-feedback">'
|
||||
'error' => '<div class="invalid-feedback">'
|
||||
. '{{content}}'
|
||||
. '</div>',
|
||||
|
||||
// Container for error items.
|
||||
//'errorList' => '<ul>{{content}}</ul>',
|
||||
'errorList' => '{{content}}',
|
||||
|
||||
// Error item wrapper.
|
||||
//'errorItem' => '<li>{{text}}</li>',
|
||||
'errorItem' => '<div>{{text}}</div>'
|
||||
];
|
||||
/*
|
||||
@ -49,11 +36,11 @@ return [
|
||||
<input type="number" step="0.01" class="form-control" id="inputAmount" name="inputAmount" >
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="input number required">
|
||||
<label for="amount">Amount</label>
|
||||
<input type="number" name="amount" required="required" step="0.01" id="amount">
|
||||
</div>
|
||||
|
||||
|
||||
*/
|
||||
@ -19,8 +19,8 @@ $this->loadHelper('Form', [
|
||||
<?= $this->Form->control('email', ['label' => __('Empfänger'), 'placeholder' => 'E-Mail']) ?>
|
||||
<?= $this->Form->control('memo', ['label' => __('Verwendungszweck'), 'rows' => 3]) ?>
|
||||
<?= $this->Form->control('amount', ['label' => __('Betrag in GDD')]) ?>
|
||||
<?= $this->Form->button(__('Transaktion abschließen'), ['name' => 'next', 'class' => 'btn btn-sm btn-primary']) ?>
|
||||
<!--<?= $this->Form->button(__('Weitere Transaktion erstellen'), ['name' => 'add', 'class' => 'btn btn-sm']) ?>-->
|
||||
<?= $this->Form->button(__('Transaktion abschließen'), ['name' => 'next', 'class' => 'form-button']) ?>
|
||||
<!--<?= $this->Form->button(__('Weitere Transaktion erstellen'), ['name' => 'add', 'class' => 'form-button']) ?>-->
|
||||
<?= $this->Form->end() ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -60,6 +60,7 @@
|
||||
/* CONTENT-NAV */
|
||||
/* CONTENT-ITEMS */
|
||||
/* CONTENT-TABLE */
|
||||
/* FORMS */
|
||||
/* VARIOUS INDIVIDUAL */
|
||||
/* XXX TODO XXX */
|
||||
/*rgba(0, 0, 0, 0.5) ??? */
|
||||
@ -489,12 +490,12 @@
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
|
||||
border: 1px solid rgba(238, 238, 238, 0.75);
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
/* Top Info Above Main */
|
||||
.info-container {
|
||||
max-width: 70%;
|
||||
padding: 0.5em 25px;
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
/* Main Container */
|
||||
.main-container {
|
||||
@ -504,6 +505,7 @@
|
||||
.content-region {
|
||||
border-bottom: 1px dashed #F5F5F5;
|
||||
padding: 0 25px;
|
||||
padding-bottom: 2em;
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
.content-collection {
|
||||
@ -558,24 +560,6 @@
|
||||
.wiretransfer {
|
||||
grid-template-columns: 5fr 4fr 3fr 2fr 1fr;
|
||||
}
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
.form-header {
|
||||
border-left: 3px solid #047006;
|
||||
background: #f9fafb;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
.form-body {
|
||||
margin: 36px 75px;
|
||||
}
|
||||
.form-group {
|
||||
display: flex;
|
||||
}
|
||||
/* OTHER */
|
||||
.info-item i,
|
||||
.info-item-link,
|
||||
@ -705,70 +689,164 @@ To change this license header, choose License Headers in Project Properties.
|
||||
To change this template file, choose Tools | Templates
|
||||
and open the template in the editor.
|
||||
*/
|
||||
/* ============================================================
|
||||
|
||||
Screen styles for forms.
|
||||
|
||||
Datei : form.css
|
||||
Datum : 2020-06-07
|
||||
Autor : Christine Slotty
|
||||
Copyright : Gradio
|
||||
|
||||
============================================================*/
|
||||
@media screen {
|
||||
/* =========
|
||||
FORMS
|
||||
=========*/
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
.form-header {
|
||||
border-left: 3px solid #047006;
|
||||
background: #f9fafb;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
.form-body form {
|
||||
display: grid;
|
||||
grid-template-columns: 200px 1fr;
|
||||
margin: 36px 75px;
|
||||
grid-gap: 1em;
|
||||
}
|
||||
.form-label {
|
||||
grid-column: 0.5;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
}
|
||||
.form-control {
|
||||
grid-column: 0.66666667;
|
||||
width: 100%;
|
||||
height: calc(1.5em + 0.75rem + 2px);
|
||||
margin: 0;
|
||||
padding: 0.375rem 0.75rem;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
color: rgba(16, 16, 16, 0.8);
|
||||
display: block;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: #6c757d;
|
||||
background-color: #f6f7f9;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #f0f2f5;
|
||||
border-radius: 0.25rem;
|
||||
-webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
.form-button {
|
||||
cursor: pointer;
|
||||
font: 600 13.3333px Arial;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: #fff;
|
||||
background-color: #047006;
|
||||
border-color: #047006;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.2rem;
|
||||
height: 35px;
|
||||
max-height: 35px;
|
||||
padding: 4px 15px;
|
||||
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.form-button:hover {
|
||||
color: #fff;
|
||||
background-color: #034b04;
|
||||
border-color: #023f03;
|
||||
}
|
||||
}
|
||||
/*
|
||||
Created on : 30.10.2019, 14:41:57
|
||||
Author : einhornimmond
|
||||
*/
|
||||
/* Button */
|
||||
Button
|
||||
.grd-form-bn:hover,
|
||||
.grd-active {
|
||||
background-color: lightgray;
|
||||
border-color: #000;
|
||||
background-color: @button-background-active;
|
||||
border-color: @button-border-color;
|
||||
}
|
||||
|
||||
.grd-form-bn {
|
||||
padding: 5px;
|
||||
border: 1px solid grey;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: #444;
|
||||
padding: 5px;
|
||||
border: 1px solid @form-button-border;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: @form-button-text;
|
||||
}
|
||||
|
||||
.grd-form-bn-small {
|
||||
}
|
||||
|
||||
a.grd-form-bn,
|
||||
a.grd-form-bn:visited {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
color: @button-text;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed {
|
||||
background-color: lightcyan;
|
||||
color: green;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
background-color: @success-background;
|
||||
color: @success;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed:not([disabled]):hover {
|
||||
background-color: lightgreen;
|
||||
background-color: @success-background-hover;
|
||||
}
|
||||
|
||||
.grd-form-bn-discard {
|
||||
margin-left: 5px;
|
||||
border: 1px solid red;
|
||||
color: red;
|
||||
cursor: pointer;
|
||||
margin-left: 5px;
|
||||
border: 1px solid @error;
|
||||
color: @error;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* form elements */
|
||||
|
||||
form elements
|
||||
.grd_textarea {
|
||||
border: 1px solid grey;
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
border: 1px solid grey;
|
||||
background-color: @form-text-background;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.grd-input label {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
|
||||
input.grd-privkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-pubkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-non-der-keys {
|
||||
width: 900px;
|
||||
width: 900px;
|
||||
}
|
||||
|
||||
input:not([type='radio']) {
|
||||
width: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
label:not(.grd_radio_label) {
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
}
|
||||
*/
|
||||
/*
|
||||
To change this license header, choose License Headers in Project Properties.
|
||||
To change this template file, choose Tools | Templates
|
||||
|
||||
@ -60,6 +60,7 @@
|
||||
/* CONTENT-NAV */
|
||||
/* CONTENT-ITEMS */
|
||||
/* CONTENT-TABLE */
|
||||
/* FORMS */
|
||||
/* VARIOUS INDIVIDUAL */
|
||||
/* XXX TODO XXX */
|
||||
/*rgba(0, 0, 0, 0.5) ??? */
|
||||
@ -489,12 +490,12 @@
|
||||
border-radius: 0.5em;
|
||||
box-shadow: 0 0 10px 0 rgba(183, 192, 206, 0.2);
|
||||
border: 1px solid rgba(238, 238, 238, 0.75);
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
/* Top Info Above Main */
|
||||
.info-container {
|
||||
max-width: 70%;
|
||||
padding: 0.5em 25px;
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
/* Main Container */
|
||||
.main-container {
|
||||
@ -504,6 +505,7 @@
|
||||
.content-region {
|
||||
border-bottom: 1px dashed #F5F5F5;
|
||||
padding: 0 25px;
|
||||
padding-bottom: 2em;
|
||||
margin: 1em 0.25em;
|
||||
}
|
||||
.content-collection {
|
||||
@ -558,24 +560,6 @@
|
||||
.wiretransfer {
|
||||
grid-template-columns: 5fr 4fr 3fr 2fr 1fr;
|
||||
}
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
.form-header {
|
||||
border-left: 3px solid #047006;
|
||||
background: #f9fafb;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
.form-body {
|
||||
margin: 36px 75px;
|
||||
}
|
||||
.form-group {
|
||||
display: flex;
|
||||
}
|
||||
/* OTHER */
|
||||
.info-item i,
|
||||
.info-item-link,
|
||||
@ -705,70 +689,164 @@ To change this license header, choose License Headers in Project Properties.
|
||||
To change this template file, choose Tools | Templates
|
||||
and open the template in the editor.
|
||||
*/
|
||||
/* ============================================================
|
||||
|
||||
Screen styles for forms.
|
||||
|
||||
Datei : form.css
|
||||
Datum : 2020-06-07
|
||||
Autor : Christine Slotty
|
||||
Copyright : Gradio
|
||||
|
||||
============================================================*/
|
||||
@media screen {
|
||||
/* =========
|
||||
FORMS
|
||||
=========*/
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
.form-header {
|
||||
border-left: 3px solid #047006;
|
||||
background: #f9fafb;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
.form-body form {
|
||||
display: grid;
|
||||
grid-template-columns: 200px 1fr;
|
||||
margin: 36px 75px;
|
||||
grid-gap: 1em;
|
||||
}
|
||||
.form-label {
|
||||
grid-column: 0.5;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
}
|
||||
.form-control {
|
||||
grid-column: 0.66666667;
|
||||
width: 100%;
|
||||
height: calc(1.5em + 0.75rem + 2px);
|
||||
margin: 0;
|
||||
padding: 0.375rem 0.75rem;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
color: rgba(16, 16, 16, 0.8);
|
||||
display: block;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: #6c757d;
|
||||
background-color: #f6f7f9;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #f0f2f5;
|
||||
border-radius: 0.25rem;
|
||||
-webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
}
|
||||
.form-button {
|
||||
cursor: pointer;
|
||||
font: 600 13.3333px Arial;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: #fff;
|
||||
background-color: #047006;
|
||||
border-color: #047006;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0.2rem;
|
||||
height: 35px;
|
||||
max-height: 35px;
|
||||
padding: 4px 15px;
|
||||
box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
.form-button:hover {
|
||||
color: #fff;
|
||||
background-color: #034b04;
|
||||
border-color: #023f03;
|
||||
}
|
||||
}
|
||||
/*
|
||||
Created on : 30.10.2019, 14:41:57
|
||||
Author : einhornimmond
|
||||
*/
|
||||
/* Button */
|
||||
Button
|
||||
.grd-form-bn:hover,
|
||||
.grd-active {
|
||||
background-color: lightgray;
|
||||
border-color: #000;
|
||||
background-color: @button-background-active;
|
||||
border-color: @button-border-color;
|
||||
}
|
||||
|
||||
.grd-form-bn {
|
||||
padding: 5px;
|
||||
border: 1px solid grey;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: #444;
|
||||
padding: 5px;
|
||||
border: 1px solid @form-button-border;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: @form-button-text;
|
||||
}
|
||||
|
||||
.grd-form-bn-small {
|
||||
}
|
||||
|
||||
a.grd-form-bn,
|
||||
a.grd-form-bn:visited {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
color: @button-text;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed {
|
||||
background-color: lightcyan;
|
||||
color: green;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
background-color: @success-background;
|
||||
color: @success;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed:not([disabled]):hover {
|
||||
background-color: lightgreen;
|
||||
background-color: @success-background-hover;
|
||||
}
|
||||
|
||||
.grd-form-bn-discard {
|
||||
margin-left: 5px;
|
||||
border: 1px solid red;
|
||||
color: red;
|
||||
cursor: pointer;
|
||||
margin-left: 5px;
|
||||
border: 1px solid @error;
|
||||
color: @error;
|
||||
cursor: pointer;
|
||||
}
|
||||
/* form elements */
|
||||
|
||||
form elements
|
||||
.grd_textarea {
|
||||
border: 1px solid grey;
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
border: 1px solid grey;
|
||||
background-color: @form-text-background;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.grd-input label {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
|
||||
input.grd-privkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-pubkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-non-der-keys {
|
||||
width: 900px;
|
||||
width: 900px;
|
||||
}
|
||||
|
||||
input:not([type='radio']) {
|
||||
width: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
label:not(.grd_radio_label) {
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
}
|
||||
*/
|
||||
/*
|
||||
To change this license header, choose License Headers in Project Properties.
|
||||
To change this template file, choose Tools | Templates
|
||||
|
||||
@ -42,6 +42,9 @@
|
||||
@content-table-header-bg: #fafafa;
|
||||
@content-table-header-border: #f2f4f9;
|
||||
|
||||
/* FORMS */
|
||||
@form-label: #212529;
|
||||
|
||||
/* VARIOUS INDIVIDUAL */
|
||||
@grd-orange: #ffa600;
|
||||
|
||||
|
||||
@ -61,13 +61,13 @@
|
||||
border-radius: .5em;
|
||||
box-shadow: 0 0 10px 0 @container-shadow;
|
||||
border: 1px solid @container-border;
|
||||
margin: 1em .25em;
|
||||
}
|
||||
|
||||
/* Top Info Above Main */
|
||||
.info-container {
|
||||
max-width: 70%;
|
||||
padding: .5em 25px;
|
||||
margin: 1em .25em;
|
||||
}
|
||||
|
||||
/* Main Container */
|
||||
@ -79,6 +79,7 @@
|
||||
.content-region {
|
||||
border-bottom: 1px dashed @light;
|
||||
padding: 0 25px;
|
||||
padding-bottom: 2em;
|
||||
margin: 1em .25em;
|
||||
}
|
||||
|
||||
@ -145,28 +146,6 @@
|
||||
grid-template-columns: 5fr 4fr 3fr 2fr 1fr;
|
||||
}
|
||||
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-header {
|
||||
border-left: 3px solid @form-header-border;
|
||||
background: @form-header-background;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
|
||||
.form-body {
|
||||
margin: 36px 75px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* OTHER */
|
||||
.info-item i,
|
||||
.info-item-link,
|
||||
|
||||
@ -4,25 +4,113 @@ To change this template file, choose Tools | Templates
|
||||
and open the template in the editor.
|
||||
*/
|
||||
|
||||
/*
|
||||
Created on : 30.10.2019, 14:41:57
|
||||
Author : einhornimmond
|
||||
*/
|
||||
/* ============================================================
|
||||
|
||||
/* Button */
|
||||
Screen styles for forms.
|
||||
|
||||
Datei : form.css
|
||||
Datum : 2020-06-07
|
||||
Autor : Christine Slotty
|
||||
Copyright : Gradio
|
||||
|
||||
============================================================*/
|
||||
@media screen {
|
||||
|
||||
/* =========
|
||||
FORMS
|
||||
=========*/
|
||||
|
||||
/* Form Content */
|
||||
.action-form {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.form-header {
|
||||
border-left: 3px solid @form-header-border;
|
||||
background: @form-header-background;
|
||||
padding: 15px 20px;
|
||||
margin: 0;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 6px 0 0;
|
||||
}
|
||||
|
||||
.form-body form {
|
||||
display: grid;
|
||||
grid-template-columns: 200px 1fr;
|
||||
margin: 36px 75px;
|
||||
grid-gap: 1em;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
grid-column: 1 / 2;
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
grid-column: 2 / 3;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: calc(1.5em + .75rem + 2px);
|
||||
margin: 0;
|
||||
padding: .375rem .75rem;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
color: rgba(16, 16, 16, .8);
|
||||
display: block;
|
||||
font-size: 1rem;
|
||||
font-weight: 400;
|
||||
line-height: 1.5;
|
||||
color: #6c757d;
|
||||
background-color: #f6f7f9;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid #f0f2f5;
|
||||
border-radius: .25rem;
|
||||
-webkit-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
|
||||
}
|
||||
|
||||
.form-button {
|
||||
cursor: pointer;
|
||||
font: 600 13.3333px Arial;
|
||||
font-size: .875rem;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: #fff;
|
||||
background-color: #047006;
|
||||
border-color: #047006;
|
||||
border: 1px solid transparent;
|
||||
border-radius: .2rem;
|
||||
height: 35px;
|
||||
max-height: 35px;
|
||||
padding: 4px 15px;
|
||||
box-shadow: 0 0 2px 0 rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
.form-button:hover {
|
||||
color: #fff;
|
||||
background-color: #034b04;
|
||||
border-color: #023f03;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/*
|
||||
Button
|
||||
.grd-form-bn:hover,
|
||||
.grd-active {
|
||||
background-color: @button-background-active;
|
||||
border-color: @button-border-color;
|
||||
border-color: @button-border-color;
|
||||
}
|
||||
|
||||
.grd-form-bn {
|
||||
padding: 5px;
|
||||
border: 1px solid @form-button-border;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: @form-button-text;
|
||||
padding: 5px;
|
||||
border: 1px solid @form-button-border;
|
||||
display: table-cell;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: @form-button-text;
|
||||
}
|
||||
|
||||
.grd-form-bn-small {
|
||||
@ -30,57 +118,58 @@ background-color: @button-background-active;
|
||||
|
||||
a.grd-form-bn,
|
||||
a.grd-form-bn:visited {
|
||||
color: @button-text;
|
||||
text-decoration: none;
|
||||
color: @button-text;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed {
|
||||
background-color: @success-background;
|
||||
color: @success;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
background-color: @success-background;
|
||||
color: @success;
|
||||
margin-top: 3px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.grd-form-bn-succeed:not([disabled]):hover {
|
||||
background-color: @success-background-hover;
|
||||
background-color: @success-background-hover;
|
||||
}
|
||||
|
||||
.grd-form-bn-discard {
|
||||
margin-left: 5px;
|
||||
border: 1px solid @error;
|
||||
color: @error;
|
||||
cursor: pointer;
|
||||
margin-left: 5px;
|
||||
border: 1px solid @error;
|
||||
color: @error;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* form elements */
|
||||
form elements
|
||||
.grd_textarea {
|
||||
border: 1px solid grey;
|
||||
background-color: @form-text-background;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
border: 1px solid grey;
|
||||
background-color: @form-text-background;
|
||||
padding: 5px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.grd-input label {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
|
||||
input.grd-privkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-pubkey {
|
||||
width: 465px;
|
||||
width: 465px;
|
||||
}
|
||||
|
||||
input.grd-non-der-keys {
|
||||
width: 900px;
|
||||
width: 900px;
|
||||
}
|
||||
|
||||
input:not([type='radio']) {
|
||||
width: 200px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
label:not(.grd_radio_label) {
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
display: inline-block;
|
||||
}
|
||||
*/
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user