Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

userInfo v1

Browse source
This commit is contained in:
Felix Niklas 2014-09-25 13:29:06 +02:00
parent a878011d67
commit ea43cd651d
2 changed files with 111 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
app/assets/javascripts/app/views/widget/user.jst.eco
View file

@ -1,47 +1,54 @@
<div class="user-info">
<%- @user.avatar(true) %>
<div class="customer-info" title="<%- @Ti( 'Name') %>"><%= @user.displayName() %></div>
<table class="userInfo">
<tr>
<td>
<%- @user.avatar(true) %>
<td class="userInfo-name">
<div class="u-textTruncate" title="<%- @Ti( 'Name') %>">
<%= @user.displayName() %>
</div>
</tr>
<% for row in @userData: %>
<% if @user[row.name] || row.name is 'note': %>
<tr>
<% if row.tag isnt 'textarea': %>
<div class="customer-info" title="<%- @Ti( row.display ) %>"><%- @L( @P( @user[row.name] ) ) %></div>
<td class="userInfo-label"><%- @Ti( row.display ) %>
<td class="userInfo-value"><%- @L( @P( @user[row.name] ) ) %>
<% else: %>
<div class="customer-info" title="<%- @Ti( row.display ) %>">
<textarea class="customer-info" rows="3" name="<%= row.name %>" data-type="update" placeholder="<%- @T( row.display ) %>"><%= @user[row.name] %></textarea>
</div>
<td class="userInfo-label"><%- @Ti( row.display ) %>
<td class="userInfo-value">
<textarea rows="1" name="<%= row.name %>" data-type="update" placeholder="<%- @T('Add a Note') %>"><%= @user[row.name] %></textarea>
<% end %>
</tr>
<% end %>
<% end %>
<% if !_.isEmpty(@user['accounts']): %>
<div class="customer-info">
<strong><%- @T( 'Linked Accounts' ) %></strong><br/>
<tr>
<td class="userInfo-label"><%- @T( 'Linked Accounts' ) %>
<td class="userInfo-value">
<% for account of @user['accounts']: %>
<a href="<%= @user['accounts'][account]['link'] %>" target="_blank"><%= account %></a>
<a href="<%= @user['accounts'][account]['link'] %>" target="_blank"><%= account %></a>
<% end %>
</div>
</tr>
<% end %>
<% if !_.isEmpty(@user['links']): %>
<% for link in @user['links']: %>
<div class="customer-info">
<strong><%- @T( link['title'] ) %></strong><br/>
<% for item in link['items']: %>
<% if item['url']: %>
<a href="<%= item['url'] %>" title="<%- @Ti( item['title'] ) %>" style="<%= item['style'] %>" data-type="<%= item['data'] %>" class="<%= item['class'] %>" <% if link.new_window: %>target="_blank"<% end %>>
<% else: %>
<span title="<%- @Ti( item['title'] ) %>" style="<%= item['style'] %>" data-type="<%= item['data'] %>" class="<%= item['class'] %>">
<% end %>
<%- @T( item['name'] ) %> <% if item['count'] isnt undefined: %><span class="count">(<%= item['count'] %>)</span><% end %>
<% if item['url']: %>
</a>
<% else: %>
</span>
<% end %>
<tr>
<td class="userInfo-label"><%- @T( link['title'] ) %>
<td class="userInfo-value">
<% for item in link['items']: %>
<% if item['url']: %>
<a href="<%= item['url'] %>" title="<%- @Ti( item['title'] ) %>" style="<%= item['style'] %>" data-type="<%= item['data'] %>" class="<%= item['class'] %>" <% if link.new_window: %>target="_blank"<% end %>>
<% else: %>
<span title="<%- @Ti( item['title'] ) %>" style="<%= item['style'] %>" data-type="<%= item['data'] %>" class="<%= item['class'] %>">
<% end %>
</div>
<%- @T( item['name'] ) %> <% if item['count'] isnt undefined: %><span class="count">(<%= item['count'] %>)</span><% end %>
<% if item['url']: %>
</a>
<% else: %>
</span>
<% end %>
<% end %>
</tr>
<% end %>
<% end %>
</div>
</div>
</table>

81
app/assets/stylesheets/zzz.css.erb
View file

@ -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;
}
/*
----------------