diff --git a/app/assets/javascripts/app/views/widget/user.jst.eco b/app/assets/javascripts/app/views/widget/user.jst.eco
index f7dcc8f2a..2345a8d37 100644
--- a/app/assets/javascripts/app/views/widget/user.jst.eco
+++ b/app/assets/javascripts/app/views/widget/user.jst.eco
@@ -1,47 +1,54 @@
-
-
- <%- @user.avatar(true) %>
-
-
<%= @user.displayName() %>
+
+
+
+ <%- @user.avatar(true) %>
+ |
+
+ <%= @user.displayName() %>
+
+ |
<% for row in @userData: %>
<% if @user[row.name] || row.name is 'note': %>
+
<% if row.tag isnt 'textarea': %>
- <%- @L( @P( @user[row.name] ) ) %>
+ <%- @Ti( row.display ) %>
+ | <%- @L( @P( @user[row.name] ) ) %>
<% else: %>
-
-
-
+ | <%- @Ti( row.display ) %>
+ |
+
<% end %>
+ |
<% end %>
<% end %>
<% if !_.isEmpty(@user['accounts']): %>
-
-
<%- @T( 'Linked Accounts' ) %>
+
+ <%- @T( 'Linked Accounts' ) %>
+ |
<% for account of @user['accounts']: %>
- <%= account %>
+ <%= account %>
<% end %>
-
+ |
<% end %>
<% if !_.isEmpty(@user['links']): %>
<% for link in @user['links']: %>
-
-
-
+
diff --git a/app/assets/stylesheets/zzz.css.erb b/app/assets/stylesheets/zzz.css.erb
index d392ab2bd..f1e484ef1 100644
--- a/app/assets/stylesheets/zzz.css.erb
+++ b/app/assets/stylesheets/zzz.css.erb
@@ -172,10 +172,13 @@ span[data-tooltip]:hover:before {
transition: transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
}
+.textarea::-webkit-input-placeholder,
.form-control::-webkit-input-placeholder,
.token-input::-webkit-input-placeholder { color: hsl(0,0%,80%); }
+.textarea::-moz-placeholder,
.form-control::-moz-placeholder,
.token-input::-moz-placeholder { opacity: 1; color: hsl(0,0%,80%); }
+.textarea:-ms-input-placeholder,
.form-control:-ms-input-placeholder,
.token-input:-ms-input-placeholder { color: hsl(0,0%,80%); }
@@ -418,13 +421,22 @@ label {
margin-top: -23px;
}
+input,
+textarea,
.form-control {
+ display: block;
+ padding: 6px 12px;
+ width: 100%;
height: 41px;
- line-height: 22px;
+ font-size: 14px;
font-weight: normal;
- box-shadow: none;
+ line-height: 22px;
+ color: #555;
+ background: white;
+ border: 1px solid #ccc;
border-radius: 3px;
transition: none;
+ box-shadow: none;
}
.form-control:focus,
@@ -1340,11 +1352,6 @@ footer {
color: #bbb;
}
-.customer-info {
- width: 100%;
- padding-top: 7px;
-}
-
.inline-edit {
padding: 4px;
}
@@ -1399,8 +1406,13 @@ footer {
padding: 9px 24px 8px;
}
+.btn:active {
+ box-shadow: none;
+}
+
.btn--primary,
-.btn--primary:hover {
+.btn--primary:hover,
+.btn--primary:focus {
color: white;
background: #419ed7;
border-color: #419ed7;
@@ -3330,6 +3342,59 @@ footer {
right: 0;
}
+.userInfo {
+ width: 100%;
+ border-collapse: collapse;
+ table-layout: auto;
+}
+
+.userInfo .avatar {
+ float: right;
+}
+
+.userInfo-name {
+ color: rgba(0,8,14,.73);
+ font-size: 16px;
+ position: relative;
+}
+
+ .userInfo-name div {
+ position: absolute;
+ width: 100%;
+ top: 50%;
+ margin-top: -10px;
+ line-height: 20px;
+ }
+
+.userInfo td {
+ padding: 5px 0;
+}
+
+.userInfo td:first-child {
+ padding-right: 10px;
+ vertical-align: top;
+}
+
+.userInfo-label {
+ color: #bbb;
+ font-weight: normal;
+ text-align: right;
+}
+
+.userInfo-value {
+ word-wrap: break-word;
+}
+
+ .userInfo-value textarea {
+ width: 100%;
+ height: auto;
+ line-height: 20px;
+ border: none;
+ padding: 0;
+ outline: none;
+ resize: none;
+ }
+
/*
----------------