Index: sky/framework/sky-input.sky |
diff --git a/sky/framework/sky-input.sky b/sky/framework/sky-input.sky |
index 2dcd646b0b7c93123deba337dd5feaecbd134dfc..ae49b907005c1ab9d43ca1d80d5d50ce13d404b6 100644 |
--- a/sky/framework/sky-input.sky |
+++ b/sky/framework/sky-input.sky |
@@ -10,17 +10,21 @@ |
<style> |
:host { |
display: flex; |
- border: 1px solid blue; |
- margin: 5px; |
- padding: 4px; |
} |
#control { |
+ margin: 8px; |
+ padding: 8px; |
+ border-bottom: 1px solid #E7E7E7; |
flex: 1; |
align-self: center; |
height: 1.2em; |
white-space: nowrap; |
overflow: hidden; |
} |
+ #control.focused { |
+ padding-bottom: 7px; |
+ border-bottom: 2px solid #009cf3; |
+ } |
</style> |
<div id="control" contenteditable /> |
</template> |
@@ -57,10 +61,14 @@ class SkyInput extends SkyElement { |
} |
void _handleFocus(_) { |
+ if (_control) |
+ _control.setAttribute('class', 'focused'); |
// TODO(abarth): Show the keyboard. |
} |
void _handleBlur(_) { |
+ if (_control) |
+ _control.removeAttribute('class'); |
// TODO(abarth): Hide the keyboard. |
} |
} |