CriticalDepsMirror/clay
1
0
Fork 0
mirror of https://github.com/pebble-dev/clay.git synced 2026-08-31 14:26:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

Add description field to all input type components.

Browse Source
This commit is contained in:
Keegan
2016-02-29 23:58:03 +11:00
parent 75aaa07048
commit 2f5f3cc4e8
17 changed files with 133 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/clay/_base.scss
+50 -43
View File
@@ -147,52 +147,59 @@ a {
}
}
.description {
padding-top: $item-spacing-v;
@include font-size(0.9);
color: $color-gray-9;
}
.inputs {
display: block;
width:100%;
border-collapse: collapse;
.section & .component {
display: table;
width:100%;
.label,
.input {
display: table-cell;
}
.input {
text-align: right;
}
&.invalid {
.input:after {
content: "!";
display: inline-block;
color: $color-white;
background: $color-orange;
border-radius: $border-radius;
width: 1.2em;
text-align: center;
height: 1.2em;
font-size: 1em;
vertical-align: middle;
line-height: 1.3em;
margin-left: -0.7em;
position:absolute;
@include font-pfdin(regular);
}
.input input {
color: $color-orange;
padding-right: 1em;
@include placeholder {
color: $color-orange;
}
}
}
}
//.section & .component {
// display: table;
// width:100%;
//
// .label,
// .input {
// display: table-cell;
// }
//
// .input {
// text-align: right;
// }
//
// &.invalid {
// .input:after {
// content: "!";
// display: inline-block;
// color: $color-white;
// background: $color-orange;
// border-radius: $border-radius;
// width: 1.2em;
// text-align: center;
// height: 1.2em;
// font-size: 1em;
// vertical-align: middle;
// line-height: 1.3em;
// margin-left: -0.7em;
// position:absolute;
// @include font-pfdin(regular);
// }
//
// .input input {
// color: $color-orange;
// padding-right: 1em;
//
// @include placeholder {
// color: $color-orange;
// }
//
// }
// }
//
//}
}
src/styles/clay/components/select.scss
+4 -1
View File
@@ -2,7 +2,10 @@
@import "clay";
.component-select {
position: relative;
label {
position: relative;
}
.value {
$triangle-size: 0.85rem;