mirror of
https://github.com/Pathduck/gallery3.git
synced 2026-06-09 21:19:11 -04:00
Move basic form styles from wind themes to gallery.common.css.
This commit is contained in:
@@ -1,12 +1,14 @@
|
||||
/**
|
||||
* Gallery 3 commonly reused screen styles
|
||||
* Gallery 3 commonly re-used screen styles
|
||||
*
|
||||
* Sheet organization:
|
||||
*
|
||||
* 1) Text
|
||||
* 2) Dimension and scale
|
||||
* 3) States and interactions
|
||||
* 4) Positioning and order
|
||||
* 5) Containers/widgets
|
||||
* 2) Forms
|
||||
* 3) Dimension and scale
|
||||
* 4) States and interactions
|
||||
* 5) Positioning and order
|
||||
* 6) Containers/widgets
|
||||
*/
|
||||
|
||||
/** *******************************************************************
|
||||
@@ -25,9 +27,135 @@
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 2) Forms
|
||||
**********************************************************************/
|
||||
|
||||
#g-sidebar form {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #ccc;
|
||||
padding: .8em 1em !important;
|
||||
}
|
||||
|
||||
#g-banner fieldset,
|
||||
#g-sidebar fieldset {
|
||||
border: none;
|
||||
}
|
||||
|
||||
legend {
|
||||
font-weight: bold;
|
||||
margin-left: .8em;
|
||||
}
|
||||
|
||||
#g-banner legend,
|
||||
#g-sidebar legend,
|
||||
#g-content #g-search-form legend,
|
||||
input[type="hidden"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"] {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
textarea {
|
||||
border: 1px solid #e8e8e8;
|
||||
border-top-color: #ccc;
|
||||
border-left-color: #ccc;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 12em;
|
||||
}
|
||||
|
||||
input:focus,
|
||||
input.textbox:focus,
|
||||
input[type=text]:focus,
|
||||
textarea:focus,
|
||||
option:focus {
|
||||
background-color: #ffc;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Form layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
form li {
|
||||
margin: 0 !important;
|
||||
padding: .3em 0;
|
||||
}
|
||||
|
||||
form ul ul {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
form ul ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
display: block;
|
||||
clear: both;
|
||||
padding: .2em;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="reset"] {
|
||||
display: inline;
|
||||
clear: none;
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* Short forms ~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
.g-short-form label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.g-short-form fieldset {
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.g-short-form li {
|
||||
float: left;
|
||||
padding: .4em 0;
|
||||
}
|
||||
|
||||
.g-short-form .textbox,
|
||||
.g-short-form input[type=text] {
|
||||
color: #666;
|
||||
padding: .3em .6em;
|
||||
}
|
||||
|
||||
.g-short-form .textbox.g-error {
|
||||
border: 1px solid #f00;
|
||||
color: #f00;
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
.g-short-form .g-cancel {
|
||||
display: block;
|
||||
padding: .2em .8em;
|
||||
}
|
||||
|
||||
#g-sidebar .g-short-form li {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 2) Dimension and scale
|
||||
* 3) Dimension and scale
|
||||
**********************************************************************/
|
||||
|
||||
.g-narrow {
|
||||
@@ -39,7 +167,7 @@
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 3) States and interactions
|
||||
* 4) States and interactions
|
||||
**********************************************************************/
|
||||
|
||||
.g-active,
|
||||
@@ -77,6 +205,21 @@ form li.g-warning {
|
||||
padding: .3em .8em .3em 1em;
|
||||
}
|
||||
|
||||
form.g-error input[type="text"],
|
||||
li.g-error input[type="text"],
|
||||
form.g-error input[type="password"],
|
||||
li.g-error input[type="password"],
|
||||
form.g-error input[type="checkbox"],
|
||||
li.g-error input[type="checkbox"],
|
||||
form.g-error input[type="radio"],
|
||||
li.g-error input[type="radio"],
|
||||
form.g-error textarea,
|
||||
li.g-error textarea,
|
||||
form.g-error select,
|
||||
li.g-error select {
|
||||
border: 2px solid red;
|
||||
}
|
||||
|
||||
.g-error,
|
||||
.g-denied,
|
||||
tr.g-error td.g-error {
|
||||
@@ -148,7 +291,7 @@ form .g-error {
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 4) Positioning and order
|
||||
* 5) Positioning and order
|
||||
**********************************************************************/
|
||||
|
||||
.g-left {
|
||||
@@ -178,7 +321,7 @@ form .g-error {
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 5) Containers/widgets
|
||||
* 6) Containers/widgets
|
||||
**********************************************************************/
|
||||
|
||||
/* Generic block container ~~~~~~~~~~~~~~~ */
|
||||
@@ -298,11 +441,6 @@ div#g-action-status {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.g-inline * {
|
||||
float: left;
|
||||
margin-right: .4em;
|
||||
}
|
||||
|
||||
/* Dialogs ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
#g-dialog {
|
||||
@@ -341,42 +479,11 @@ div#g-action-status {
|
||||
margin: .4em 1em;
|
||||
}
|
||||
|
||||
/* Inline layout (forms, lists) ~~~~~~~~~~ */
|
||||
/* Inline layout ~~~~~~~~~~ */
|
||||
|
||||
.g-short-form label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.g-short-form fieldset {
|
||||
border: none;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.g-short-form li {
|
||||
.g-inline * {
|
||||
float: left;
|
||||
padding: .4em 0;
|
||||
}
|
||||
|
||||
.g-short-form .textbox {
|
||||
color: #666;
|
||||
padding: .3em .6em;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.g-short-form .textbox.g-error {
|
||||
border: 1px solid #f00;
|
||||
color: #f00;
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
.g-short-form .g-cancel {
|
||||
display: block;
|
||||
padding: .2em .8em;
|
||||
}
|
||||
|
||||
#g-sidebar .g-short-form li {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
margin-right: .4em;
|
||||
}
|
||||
|
||||
/* Right to left styles ~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
@@ -114,107 +114,6 @@ th {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Forms ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #ccc;
|
||||
padding-bottom: .8em;
|
||||
}
|
||||
|
||||
#g-header fieldset,
|
||||
#g-sidebar fieldset {
|
||||
border: none;
|
||||
}
|
||||
|
||||
legend {
|
||||
font-weight: bold;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
#g-header legend,
|
||||
#g-sidebar legend,
|
||||
#g-content #g-search-form legend,
|
||||
input[type="hidden"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"] {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
textarea {
|
||||
border: 1px solid #e8e8e8;
|
||||
border-top-color: #ccc;
|
||||
border-left-color: #ccc;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 12em;
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus,
|
||||
option:focus {
|
||||
background-color: #ffc;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Form layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
form li {
|
||||
margin: 0 !important;
|
||||
padding: .3em 1.5em .3em 1em;
|
||||
}
|
||||
|
||||
form ul ul {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
form ul ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
display: block;
|
||||
clear: both;
|
||||
padding: .2em;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="reset"] {
|
||||
display: inline;
|
||||
clear: none;
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* Form validation ~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
form.g-error input[type="text"],
|
||||
li.g-error input[type="text"],
|
||||
form.g-error input[type="password"],
|
||||
li.g-error input[type="password"],
|
||||
form.g-error input[type="checkbox"],
|
||||
li.g-error input[type="checkbox"],
|
||||
form.g-error input[type="radio"],
|
||||
li.g-error input[type="radio"],
|
||||
form.g-error textarea,
|
||||
li.g-error textarea,
|
||||
form.g-error select,
|
||||
li.g-error select {
|
||||
border: 2px solid red;
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 2) Reusable content blocks
|
||||
*********************************************************************/
|
||||
|
||||
@@ -118,112 +118,6 @@ td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* Forms ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
#g-sidebar form {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #ccc;
|
||||
padding: .8em 1em !important;
|
||||
}
|
||||
|
||||
#g-banner fieldset,
|
||||
#g-sidebar fieldset {
|
||||
border: none;
|
||||
}
|
||||
|
||||
legend {
|
||||
font-weight: bold;
|
||||
margin-left: .8em;
|
||||
}
|
||||
|
||||
#g-banner legend,
|
||||
#g-sidebar legend,
|
||||
#g-content #g-search-form legend,
|
||||
input[type="hidden"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"] {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
textarea {
|
||||
border: 1px solid #e8e8e8;
|
||||
border-top-color: #ccc;
|
||||
border-left-color: #ccc;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 12em;
|
||||
}
|
||||
|
||||
input:focus,
|
||||
textarea:focus,
|
||||
option:focus {
|
||||
background-color: #ffc;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Form layout ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
form li {
|
||||
margin: 0 !important;
|
||||
padding: .3em 0;
|
||||
}
|
||||
|
||||
form ul ul {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
form ul ul li {
|
||||
float: left;
|
||||
}
|
||||
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
display: block;
|
||||
clear: both;
|
||||
padding: .2em;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
input[type="reset"] {
|
||||
display: inline;
|
||||
clear: none;
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* Form validation ~~~~~~~~~~~~~~~~~~~~~~~ */
|
||||
|
||||
form.g-error input[type="text"],
|
||||
li.g-error input[type="text"],
|
||||
form.g-error input[type="password"],
|
||||
li.g-error input[type="password"],
|
||||
form.g-error input[type="checkbox"],
|
||||
li.g-error input[type="checkbox"],
|
||||
form.g-error input[type="radio"],
|
||||
li.g-error input[type="radio"],
|
||||
form.g-error textarea,
|
||||
li.g-error textarea,
|
||||
form.g-error select,
|
||||
li.g-error select {
|
||||
border: 2px solid red;
|
||||
}
|
||||
|
||||
/** *******************************************************************
|
||||
* 2) Reusable content blocks
|
||||
*********************************************************************/
|
||||
|
||||
Reference in New Issue
Block a user