introduce .u-unclickable, refactor .u-clickable
new camelCase sole purpose utility classes
This commit is contained in:
parent
091504eeb4
commit
9999caf2d9
5 changed files with 34 additions and 28 deletions
|
@ -33,7 +33,7 @@
|
|||
<div class="sidebar bottom-form-shadow flex">
|
||||
<div class="horizontal center">
|
||||
<h2 class="flex contain-text"></h2>
|
||||
<div class="close-sidebar centered clickable">
|
||||
<div class="close-sidebar centered u-clickable">
|
||||
<div class="arrow-right icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -75,7 +75,7 @@
|
|||
|
||||
<form class="bottom-form form-inline horizontal" role="form">
|
||||
<div class="form-group">
|
||||
<label for="update_ticket_1_state_id123" class="input-group-addon clickable">State</label>
|
||||
<label for="update_ticket_1_state_id123" class="input-group-addon u-clickable">State</label>
|
||||
<select id="update_ticket_1_state_id123" class="form-control level-1" name="state_id">
|
||||
<option value="4">closed</option>
|
||||
<option value="1" selected="">new</option>
|
||||
|
@ -84,7 +84,7 @@
|
|||
</select>
|
||||
</div>
|
||||
<div class="form-group is-changed">
|
||||
<label for="update_ticket_1_priority_id123" class="input-group-addon clickable">Priority</label>
|
||||
<label for="update_ticket_1_priority_id123" class="input-group-addon u-clickable">Priority</label>
|
||||
<select id="update_ticket_1_priority_id123" class="form-control" name="priority_id">
|
||||
<option value="1">1 low</option>
|
||||
<option value="2" selected="">2 normal</option>
|
||||
|
@ -92,7 +92,7 @@
|
|||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="update_ticket_1_group_id123" class="input-group-addon clickable">Group</label>
|
||||
<label for="update_ticket_1_group_id123" class="input-group-addon u-clickable">Group</label>
|
||||
<select id="update_ticket_1_group_id123" class="form-control" name="group_id">
|
||||
<option value="4">FillGroup::450863</option>
|
||||
<option value="3">FillGroup::918672</option>
|
||||
|
@ -101,7 +101,7 @@
|
|||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="update_ticket_1_owner_id123" class="input-group-addon clickable">Owner</label>
|
||||
<label for="update_ticket_1_owner_id123" class="input-group-addon u-clickable">Owner</label>
|
||||
<select id="update_ticket_1_owner_id123" class="form-control" name="owner_id">
|
||||
<option value="">-</option>
|
||||
<option value="3">Felix Niklas</option>
|
||||
|
|
|
@ -63,7 +63,7 @@
|
|||
<% if article.actions: %>
|
||||
<div class="article-actions horizontal stretch">
|
||||
<% for action in article.actions: %>
|
||||
<a href="<%= action.href %>" data-type="<%= action.type %>" class="article-action clickable<% if action.class: %> <%= action.class %><% end %>">
|
||||
<a href="<%= action.href %>" data-type="<%= action.type %>" class="article-action u-clickable<% if action.class: %> <%= action.class %><% end %>">
|
||||
<span class="<%= action.type %> action icon"></span><%- @T( action.name ) %>
|
||||
</a>
|
||||
<% end %>
|
||||
|
|
|
@ -4,28 +4,28 @@
|
|||
<div class="avatar user-popover" data-id="<%= @S('id') %>" style="background-image: url(<%- @S('image') %>)"></div>
|
||||
<div class="edit-controls">
|
||||
<div class="dark pop-select">
|
||||
<div class="pop-selected clickable centered">
|
||||
<div class="pop-selected u-clickable centered">
|
||||
<div class="gray <%- @type %> channel icon"></div>
|
||||
</div>
|
||||
<div class="pop-selector hide">
|
||||
<div class="horizontal">
|
||||
<div class="pop-selectable clickable centered" data-value="email">
|
||||
<div class="pop-selectable u-clickable centered" data-value="email">
|
||||
<div class="white email channel icon"></div>
|
||||
</div>
|
||||
<div class="pop-selectable clickable centered" data-value="facebook">
|
||||
<div class="pop-selectable u-clickable centered" data-value="facebook">
|
||||
<div class="white facebook channel icon"></div>
|
||||
</div>
|
||||
<div class="pop-selectable clickable centered" data-value="twitter">
|
||||
<div class="pop-selectable u-clickable centered" data-value="twitter">
|
||||
<div class="white twitter channel icon"></div>
|
||||
</div>
|
||||
<div class="pop-selectable clickable centered" data-value="phone">
|
||||
<div class="pop-selectable u-clickable centered" data-value="phone">
|
||||
<div class="white phone channel icon"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="recipient-picker clickable horizontal centered">
|
||||
<div class="recipient-picker u-clickable horizontal centered">
|
||||
<div class="recipients icon"></div>
|
||||
<div class="recipient-count">3</div>
|
||||
<div class="recipient-list hide">
|
||||
|
@ -37,7 +37,7 @@
|
|||
<div class="list-entry horizontal centered">
|
||||
<div class="avatar" style="background-image: url(http://berta9.express.ge/31/performer/Paul%20van%20Dyk/.photo/34_paul_van_dyk_01.jpg)"></div>
|
||||
<div class="list-entry-name flex">Hans Peter Baxxter</div>
|
||||
<div class="list-entry-type clickable horizontal">
|
||||
<div class="list-entry-type u-clickable horizontal">
|
||||
<div class="active" data-value="to">To</div>
|
||||
<div data-value="cc" title="<%- @T('carbon copy') %>">Cc</div>
|
||||
</div>
|
||||
|
@ -45,7 +45,7 @@
|
|||
<!-- <div class="list-entry horizontal centered">
|
||||
<div class="avatar" style="background-image: url(https://s3.amazonaws.com/uifaces/faces/twitter/adellecharles/48.jpg)"></div>
|
||||
<div class="list-entry-name flex">Julia Maier</div>
|
||||
<div class="list-entry-type clickable horizontal">
|
||||
<div class="list-entry-type u-clickable horizontal">
|
||||
<div class="active" data-value="to">To</div>
|
||||
<div data-value="cc" title="<%- @T('carbon copy') %>">Cc</div>
|
||||
</div>
|
||||
|
@ -53,7 +53,7 @@
|
|||
<div class="list-entry horizontal centered">
|
||||
<div class="avatar" style="background-image: url(https://s3.amazonaws.com/uifaces/faces/twitter/sindresorhus/48.jpg)"></div>
|
||||
<div class="list-entry-name flex">Remo Batlogg</div>
|
||||
<div class="list-entry-type clickable horizontal">
|
||||
<div class="list-entry-type u-clickable horizontal">
|
||||
<div class="active" data-value="to">To</div>
|
||||
<div data-value="cc" title="<%- @T('carbon copy') %>">Cc</div>
|
||||
</div>
|
||||
|
@ -71,12 +71,15 @@
|
|||
<div class="text-bubble">
|
||||
<div class="bubble-arrow"></div>
|
||||
<textarea></textarea>
|
||||
<span class="bubble-placeholder">Antwort eingeben oder <span class="highlight">Dateien wählen</span></span>
|
||||
<div class="bubble-placeholder">
|
||||
<span class="u-unclickable">Antwort eingeben oder </span>
|
||||
<span class="highlight u-clickable js-upload">Dateien wählen</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="edit-controls">
|
||||
<div class="horizontal justify-end center">
|
||||
<div class="visibility toggle clickable centered">
|
||||
<div class="visibility toggle u-clickable centered">
|
||||
<div class="internal-visibility">
|
||||
<div class="internal visibility icon"></div>
|
||||
<div class="visibility-label">internal</div>
|
||||
|
|
|
@ -5,21 +5,21 @@
|
|||
<li class="horizontal center">
|
||||
<span class="flex">Midi Notes</span>
|
||||
<span>3</span>
|
||||
<span class="tag-delete js-delete centered clickable">
|
||||
<span class="tag-delete js-delete centered u-clickable">
|
||||
<span class="delete icon"></span>
|
||||
</span>
|
||||
<li class="horizontal center">
|
||||
<span class="flex">Transitions</span>
|
||||
<span>23</span>
|
||||
<span class="tag-delete js-delete centered clickable">
|
||||
<span class="tag-delete js-delete centered u-clickable">
|
||||
<span class="delete icon"></span>
|
||||
</span>
|
||||
<li class="horizontal center">
|
||||
<span class="flex">New UI</span>
|
||||
<span>3</span>
|
||||
<span class="tag-delete js-delete centered clickable">
|
||||
<span class="tag-delete js-delete centered u-clickable">
|
||||
<span class="delete icon"></span>
|
||||
</span>
|
||||
</ul>
|
||||
<div class="text-muted js-newTag clickable">+ <%- @T('Add Tag') %></div>
|
||||
<div class="text-muted js-newTag u-clickable">+ <%- @T('Add Tag') %></div>
|
||||
</div>
|
||||
|
|
|
@ -14,6 +14,16 @@ small {
|
|||
color: hsl(202,68%,54%);
|
||||
}
|
||||
|
||||
.u-unclickable {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.u-clickable {
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#app > nav {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
|
@ -1483,12 +1493,6 @@ footer {
|
|||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.clickable {
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.customer_info {
|
||||
}
|
||||
|
||||
|
@ -2937,7 +2941,6 @@ footer {
|
|||
color: #b3b3b3;
|
||||
left: 20px;
|
||||
top: 10px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.pop-select {
|
||||
|
|
Loading…
Reference in a new issue