[ux] unify text inputs

This commit is contained in:
karolinaszczur 2013-10-23 14:16:27 +02:00
parent 8adb87f0b3
commit 4175ef1ca7
6 changed files with 15 additions and 24 deletions

View File

@ -196,7 +196,7 @@ exports.pages.groupchat = function anonymous(locals) {
exports.pages.main = function anonymous(locals) { exports.pages.main = function anonymous(locals) {
var buf = []; var buf = [];
with (locals || {}) { with (locals || {}) {
buf.push('<section class="page main"><div><h3>Current status</h3><div contenteditable="true" class="status"></div></div><div id="avatarChanger"><h3>Change Avatar</h3><div class="uploadRegion"><p>Drag and drop a new avatar here</p><img/><form><input id="uploader" type="file"/></form></div></div><div><h3>Add / Approve Contacts</h3><input id="addcontact"/><button class="addContact">Add</button><ul id="contactrequests"></ul></div><div><h3>Desktop Integration</h3><button class="enableAlerts">Enable alerts</button><button class="installFirefox">Install app</button></div></section>'); buf.push('<section class="page main"><div><h3>Current status</h3><div contenteditable="true" class="status"></div></div><div id="avatarChanger"><h3>Change Avatar</h3><div class="uploadRegion"><p>Drag and drop a new avatar here</p><img/><form><input id="uploader" type="file"/></form></div></div><div><h3>Add / Approve Contacts</h3><input type="text" id="addcontact"/><button class="addContact">Add</button><ul id="contactrequests"></ul></div><div><h3>Desktop Integration</h3><button class="enableAlerts">Enable alerts</button><button class="installFirefox">Install app</button></div></section>');
} }
return buf.join(""); return buf.join("");
}; };

View File

@ -14,7 +14,7 @@ section.page.main
div div
h3 Add / Approve Contacts h3 Add / Approve Contacts
input#addcontact input(type="text")#addcontact
button.addContact Add button.addContact Add
ul#contactrequests ul#contactrequests

View File

@ -1,6 +1,6 @@
// Forms and Buttons // Forms and Buttons
input[type=text], input[type=email], input[type=search], input[type=password], textarea input[type=text], input[type=email], input[type=search], input[type=password], textarea, .main .status
-webkit-appearance: none -webkit-appearance: none
roundall(3px) roundall(3px)
padding: 0 10px padding: 0 10px
@ -17,7 +17,7 @@ input[type=text], input[type=email], input[type=search], input[type=password], t
-webkit-transition: border .2s ease-in 0 -webkit-transition: border .2s ease-in 0
-moz-transition: border .2s ease-in 0 -moz-transition: border .2s ease-in 0
input[type=text], input[type=email], input[type=search], input[type=password] input[type=text], input[type=email], input[type=search], input[type=password], .main .status
height: 35px height: 35px
textarea textarea

View File

@ -5,15 +5,12 @@
padding: 20px padding: 20px
border-bottom: 1px solid $grayOutline border-bottom: 1px solid $grayOutline
.status
padding: 10px
&:last-of-type &:last-of-type
border: none border: none
.status
padding: 5px
background: $grayBackground
roundall(3px)
font-size: $fontSmall
.uploadRegion .uploadRegion
padding: 15px padding: 15px
font-size: $fontSmall font-size: $fontSmall

View File

@ -894,20 +894,12 @@ h3 {
padding: 20px; padding: 20px;
border-bottom: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4;
} }
.main > div .status {
padding: 10px;
}
.main > div:last-of-type { .main > div:last-of-type {
border: none; border: none;
} }
.main > div .status {
padding: 5px;
background: #f7f7f7;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
-o-border-radius: 3px;
-border-radius: 3px;
border-radius: 3px;
font-size: 12px;
}
.uploadRegion { .uploadRegion {
padding: 15px; padding: 15px;
font-size: 12px; font-size: 12px;
@ -996,7 +988,8 @@ input[type=text],
input[type=email], input[type=email],
input[type=search], input[type=search],
input[type=password], input[type=password],
textarea { textarea,
.main .status {
-webkit-appearance: none; -webkit-appearance: none;
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
@ -1026,7 +1019,8 @@ textarea {
input[type=text], input[type=text],
input[type=email], input[type=email],
input[type=search], input[type=search],
input[type=password] { input[type=password],
.main .status {
height: 35px; height: 35px;
} }
textarea { textarea {

View File

@ -1,5 +1,5 @@
CACHE MANIFEST CACHE MANIFEST
# 0.0.1 1382382268689 # 0.0.1 1382530461409
CACHE: CACHE:
/app.js /app.js