Skip to content

Commit

Permalink
Updated Sidebar classes & look for Subtags (still rough, but pushing …
Browse files Browse the repository at this point in the history 
…for the curious)
  • Loading branch information
@bnvk
bnvk committed Oct 24, 2014
1 parent 5f61129 commit 612294f
Show file tree
Hide file tree
Showing 4 changed files with 38 additions and 37 deletions.
2 changes: 1 addition & 1 deletion static/default/css/default.css
View file

Large diffs are not rendered by default.

4 changes: 2 additions & 2 deletions static/default/html/jsapi/tags/content.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ $(document).on('click', '.modal-tag-icon-option', function() {
Mailpile.notification(result);

// Update Sidebar
$('#sidebar-tag-' + tid).find('span.sidebar-icon').removeClass(old).addClass(icon);
$('#sidebar-tag-' + tid).find('span.icon').removeClass(old).addClass(icon);

// Update Tag Editor
$('#data-tag-icon').val(icon);
Expand Down Expand Up @@ -92,7 +92,7 @@ $(document).on('click', '.modal-tag-color-option', function(e) {
Mailpile.notification(result);

// Update Sidebar
$('#sidebar-tag-' + tid).find('span.sidebar-icon').css('color', hex);
$('#sidebar-tag-' + tid).find('span.icon').css('color', hex);

// Update Tag Editor
$('#data-tag-label-color').val(name);
Expand Down
12 changes: 6 additions & 6 deletions static/default/html/partials/sidebar.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@
{% set tag_new_count = tag.stats.new %}
{% endif %}
<a href="{{tag.url}}" class="sidebar-tag color-{{tag.label_color}}{% if tag_new_count %} has_unread{% endif %}" title="{{tag.name}} {{tag.stats.all}}" data-tid="{{tag.tid}}">
<span class="sidebar-icon {{tag.icon}}" style="color: {{theme_settings().colors[tag.label_color]}};"></span>
<span class="sidebar-name">{{tag.name}}</span>
<span class="sidebar-notification">{% if tag_new_count %} {{friendly_number(tag_new_count)}}{% endif %}</span>
<span class="icon {{tag.icon}}" style="color: {{theme_settings().colors[tag.label_color]}};"></span>
<span class="name">{{tag.name}}</span>
<span class="notification">{% if tag_new_count %} {{friendly_number(tag_new_count)}}{% endif %}</span>
</a>
{% if tag.get("subtags") %}
<a href="#" class="sidebar-tag-expand" data-tid="{{tag.tid}}">
Expand All @@ -33,10 +33,10 @@
{% for subtag in tag.subtags %}
<li id="sidebar-tag-{{subtag.tid}}" data-tid="{{subtag.tid}}" data-display_order="{{subtag.display_order}}" class="sidebar-subtag sidebar-tags-draggable subtag-of-{{tag.tid}}">
<a href="{{subtag.url}}" class="sidebar-tag hide" title="{{subtag.name}} {{subtag.stats.all}}" data-tid="{{subtag.tid}}">
<span class="sidebar-icon {{subtag.icon}}" style="color: {{theme_settings().colors[subtag.label_color]}};"></span>
<span class="sidebar-name">{{subtag.name}}</span>
<span class="icon {{subtag.icon}}" style="color: {{theme_settings().colors[subtag.label_color]}};"></span>
<span class="name">{{subtag.name}}</span>
{% if subtag.stats.new %}
<span class="sidebar-notification" id="sidebar-notifications-{{tag.tid}}">{{ friendly_number(subtag.stats.new) }}</span>
<span class="notification" id="sidebar-notifications-{{tag.tid}}">{{ friendly_number(subtag.stats.new) }}</span>
{% endif %}
</a>
</li>
Expand Down
57 changes: 29 additions & 28 deletions static/default/less/app/sidebar.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,11 +24,11 @@
#sidebar.cozy ul li { margin-top: 2px; margin-bottom: 2px; padding-top: 2px; padding-bottom: 2px; }
#sidebar.snug ul li { margin-top: 2px; margin-bottom: 2px; padding-top: 1px; padding-bottom: 1px; }

#sidebar a.sidebar-tag {
#sidebar a.sidebar-tag {
position: relative;
width: 195px;
width: 170px;
height: 24px;
display: table;
display: inline-block;
vertical-align: middle;
text-align: left;
transition-duration: 0.2s;
Expand All @@ -42,61 +42,66 @@
#sidebar li.is-editing,
#sidebar li.is-editing a.sidebar-tag { cursor: move; }

#sidebar span.sidebar-icon {
#sidebar span.icon {
width: 24px;
height: 18px;
display: table-cell;
display: inline-block;
vertical-align: middle;
text-align: center;
font-weight: normal;
font-size: 18px;
line-height: 18px;
}

#sidebar.cozy span.sidebar-icon { font-size: 18px; line-height: 18px; }
#sidebar.snug span.sidebar-icon { font-size: 16px; line-height: 16px; }
#sidebar.cozy span.icon { font-size: 18px; line-height: 18px; }
#sidebar.snug span.icon { font-size: 16px; line-height: 16px; }

#sidebar a.sidebar-tag span.sidebar-name,
#sidebar a.sidebar-tag span.sidebar-notification {
#sidebar a.sidebar-tag > span.name,
#sidebar a.sidebar-tag > span.notification {
vertical-align: middle;
font-family: @mailpile-text-font-family;
font-weight: normal;
font-size: 18px;
line-height: 24px;
}

#sidebar a.sidebar-tag span.sidebar-name {
#sidebar a.sidebar-tag span.name {
display: inline-block;
max-width: 132px;
padding-left: 5px;
white-space: nowrap;
overflow-x: hidden;
}

#sidebar a.sidebar-tag span.sidebar-notification {
#sidebar a.sidebar-tag span.notification {
letter-spacing: -.5px;
color: @gray;
}

#sidebar.cozy span.sidebar-name,
#sidebar.cozy span.sidebar-notification { font-size: 16px; line-height: 18px; }
#sidebar.snug span.sidebar-name,
#sidebar.snug span.sidebar-notification { font-size: 14px; line-height: 16px; }
#sidebar.cozy span.name,
#sidebar.cozy span.notification { font-size: 16px; line-height: 18px; }
#sidebar.snug span.name,
#sidebar.snug span.notification { font-size: 14px; line-height: 16px; }

#sidebar a.sidebar-tag.has_unread span.sidebar-name,
#sidebar a.sidebar-tag.has_unread span.sidebar-notification {
#sidebar a.sidebar-tag.has_unread span.name,
#sidebar a.sidebar-tag.has_unread span.notification {
font-family: @mailpile-text-font-family-bold;
font-weight: normal;
}

#sidebar a.sidebar-tag-expand {
display: inline-block;
color: @gray;
}


/* Sidebar - Subtags */

#sidebar ul.sidebar-subtags {
background: @white;
border: 1px solid @grayMid;
margin: 5px 0px;
border-radius: (@base-border-radius * 1.5);
border-radius: @base-border-radius;
}

#sidebar ul.sidebar-subtags li.sidebar-subtag {
Expand All @@ -106,18 +111,13 @@
padding-bottom: 1px;
}

#sidebar ul.sidebar-subtags li.sidebar-subtag a.sidebar-tag {
font-size: 16px;
font-family: Helvetica, Arial, sans-serif;
}

#sidebar ul.sidebar-subtags li.sidebar-subtag a.sidebar-tag span.sidebar-name,
#sidebar ul.sidebar-subtags li.sidebar-subtag a.sidebar-tag span.sidebar-notification {
#sidebar ul.sidebar-subtags li.sidebar-subtag a.sidebar-tag span.name,
#sidebar ul.sidebar-subtags li.sidebar-subtag a.sidebar-tag span.notification {
vertical-align: middle;
font-family: @mailpile-text-font-family;
font-weight: normal;
font-size: 18px;
line-height: 24px;
font-size: 16px;
font-family: @text-font-family;
line-height: 18px;
}


Expand Down Expand Up @@ -152,6 +152,7 @@
background: @orange;
}


/* Sidebar - Drag & Drop */

.sidebar-tags-draggable {
Expand Down

0 comments on commit 612294f

Please sign in to comment.