mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
131 lines
2.0 KiB
SCSS
131 lines
2.0 KiB
SCSS
|
|
// Forms
|
|
// --------------------------------------------------
|
|
|
|
|
|
form {
|
|
margin: 0 0 2.4rem;
|
|
}
|
|
|
|
label,
|
|
input,
|
|
select,
|
|
textarea {
|
|
line-height: normal;
|
|
font-family: inherit;
|
|
}
|
|
|
|
|
|
// Form Controls
|
|
// -------------------------------
|
|
|
|
.item-input {
|
|
|
|
// text inputs
|
|
textarea,
|
|
input[type="text"],
|
|
input[type="password"],
|
|
input[type="datetime"],
|
|
input[type="datetime-local"],
|
|
input[type="date"],
|
|
input[type="month"],
|
|
input[type="time"],
|
|
input[type="week"],
|
|
input[type="number"],
|
|
input[type="email"],
|
|
input[type="url"],
|
|
input[type="search"],
|
|
input[type="tel"],
|
|
input[type="color"] {
|
|
display: block;
|
|
background: transparent;
|
|
border: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
// tap inputs
|
|
input[type="radio"],
|
|
input[type="checkbox"] {
|
|
margin: 0;
|
|
}
|
|
|
|
input[type="file"],
|
|
input[type="image"],
|
|
input[type="submit"],
|
|
input[type="reset"],
|
|
input[type="button"],
|
|
input[type="radio"],
|
|
input[type="checkbox"] {
|
|
width: auto;
|
|
}
|
|
}
|
|
|
|
textarea {
|
|
margin: 0;
|
|
padding: 0;
|
|
height: auto;
|
|
overflow: auto;
|
|
color: inherit;
|
|
font: inherit;
|
|
}
|
|
|
|
.platform-mobile textarea {
|
|
resize: none;
|
|
}
|
|
|
|
|
|
// Placeholder
|
|
// -------------------------------
|
|
input,
|
|
textarea {
|
|
@include placeholder();
|
|
}
|
|
|
|
|
|
// DISABLED STATE
|
|
// -------------------------------
|
|
|
|
// Disabled and read-only inputs
|
|
input[disabled],
|
|
select[disabled],
|
|
textarea[disabled],
|
|
select[readonly] {
|
|
cursor: not-allowed;
|
|
}
|
|
// Explicitly reset the colors here
|
|
input[type="radio"][disabled],
|
|
input[type="checkbox"][disabled],
|
|
input[type="radio"][readonly],
|
|
input[type="checkbox"][readonly] {
|
|
background-color: transparent;
|
|
}
|
|
|
|
|
|
// Focus Utils
|
|
// -------------------------------
|
|
|
|
focus-holder input {
|
|
position: fixed;
|
|
top: 1px;
|
|
width: 9px;
|
|
left: -9999px;
|
|
z-index: 9999;
|
|
}
|
|
|
|
/*focus-holder input[tabindex="999"] {
|
|
left: 0px;
|
|
}
|
|
|
|
focus-holder input[tabindex="1001"] {
|
|
left: 20px;
|
|
}
|
|
|
|
focus-holder input[tabindex="1002"] {
|
|
left: auto;
|
|
right: 10px;
|
|
}
|
|
|
|
focus-holder input:focus {
|
|
background: red;
|
|
}*/
|