Commit f429cacd authored by Juan Manuel Azambuja's avatar Juan Manuel Azambuja
Browse files

[Sprites] add sprites for icon images

parent 6c1a1ec6
......@@ -114,6 +114,7 @@ gem 'gon', '4.0.0'
group :assets do
gem 'bootstrap-sass', '2.0.3.1'
gem 'sass-rails', '3.2.5'
gem 'compass-rails'
# Windows and OSX have an execjs compatible runtime built-in, Linux users should
# install Node.js or use 'therubyracer'.
......
......@@ -110,6 +110,7 @@ GEM
activesupport (>= 3.2.0)
childprocess (0.3.5)
ffi (~> 1.0, >= 1.0.6)
chunky_png (1.2.6)
client_side_validations (3.1.4)
coffee-rails (3.2.2)
coffee-script (>= 2.2.0)
......@@ -119,6 +120,12 @@ GEM
execjs
coffee-script-source (1.3.3)
columnize (0.3.6)
compass (0.12.2)
chunky_png (~> 1.2)
fssm (>= 0.2.7)
sass (~> 3.1)
compass-rails (1.0.3)
compass (>= 0.12.2, < 0.14)
crack (0.3.1)
cucumber (1.2.1)
builder (>= 2.1.2)
......@@ -178,6 +185,7 @@ GEM
foreman (0.57.0)
thor (>= 0.13.6)
formatador (0.2.3)
fssm (0.2.9)
fuubar (1.0.0)
rspec (~> 2.0)
rspec-instafail (~> 0.2.0)
......@@ -465,6 +473,7 @@ DEPENDENCIES
capybara (= 1.1.2)
carrierwave (= 0.6.2)
client_side_validations (= 3.1.4)
compass-rails
cucumber-rails (= 1.3.0)
database_cleaner (= 0.8)
debugger (= 1.2.0)
......
app/assets/images/icons/padlock-closed.png

437 Bytes | W: | H:

app/assets/images/icons/padlock-closed.png

661 Bytes | W: | H:

app/assets/images/icons/padlock-closed.png
app/assets/images/icons/padlock-closed.png
app/assets/images/icons/padlock-closed.png
app/assets/images/icons/padlock-closed.png
  • 2-up
  • Swipe
  • Onion skin
app/assets/images/icons/padlock-open.png

437 Bytes | W: | H:

app/assets/images/icons/padlock-open.png

804 Bytes | W: | H:

app/assets/images/icons/padlock-open.png
app/assets/images/icons/padlock-open.png
app/assets/images/icons/padlock-open.png
app/assets/images/icons/padlock-open.png
  • 2-up
  • Swipe
  • Onion skin
......@@ -7,8 +7,6 @@ Diaspora.Pages.UsersGettingStarted = function() {
$('#edit_profile').bind('ajax:success', function(evt, data, status, xhr){
$('#gs-name-form-spinner').addClass("hidden");
$('.profile .saved').show();
$('.profile .saved').fadeOut(2000);
});
// It seems that the default behavior of rails ujs is to clear the remote form
......
@import 'compass'
@import 'ui.css.sass'
@import '_mixins.css.scss'
@import '_flash_messages.scss'
@import 'new_styles/_spinner'
/* ===== sprites ===== */
@import 'icons/*.png'
@include all-icons-sprites
/* ====== media ====== */
.media
:margin 10px
......@@ -403,6 +408,20 @@ ul.as-selections
&:hover
@include opacity(1)
.block_user
:display inline-block
.icons-ignoreuser
:height 14px
:width 13px
.delete
:display inline-block
.icons-deletelabel
:height 8px
:width 8px
.status_message_show
.comment_box
:width 653px
......@@ -697,6 +716,14 @@ form p.checkbox_select
:text
:align left
.icons-monotone_wrench_settings
:display inline-block
:width 16px
:height 16px
a.question_mark
:text-decoration none
#publisher_service_icons
:position relative
:top 3px
......@@ -761,7 +788,11 @@ form p.checkbox_select
:padding 3px
:position absolute
:right 6px
:top 0
:margin-top 9px
.icons-deletelabel
:height 8px
:width 8px
&:hover
@include opacity(1)
......@@ -1144,36 +1175,47 @@ h3 span.current_gs_step
:display inline-block
:margin-top 2px
:float left
:width 61px
a:hover
:text
:decoration none
.badge
:position relative
:top 2px
:display inline
:margin 0 2px
:padding 8px 3px
:bottom 9px
:font
:weight bold
:size smaller
:width 28px
:width 22px
&:hover
.badge_count
:background
:color lighten(#A40802, 5%)
a.badge_link
:display block
:width 100%
:height 16px
:float left
.icons-notifications_grey
:height 16px
.icons-mail_grey
:height 11px
#message_inbox_badge
img
:position relative
:top -2px
:float left
:padding 3px 3px 0px 0px
#notification_badge
img
:position relative
:float left
:padding 0px 3px 0px 3px
.badge_count
@include border-radius(2px)
......@@ -1248,6 +1290,11 @@ ul#request_result
:right 8px
:top 3px
.icons-monotone_plus_add_round,
.icons-monotone_check_yes
:height 20px
:width 20px
> .contacts
:margin 0
:padding 5px
......@@ -1290,12 +1337,10 @@ ul#request_result
:border
:bottom none
:height 12px !important
:width 12px !important
:padding
:right 4px
:left 4px
:min-width auto
:float right
:padding 2px 4px
:margin-top 5px
&.added
@include linear-gradient(rgb(158,255,153), rgb(92,199,86))
......@@ -1615,13 +1660,19 @@ ul#press_logos
:color #999
.likes
.img
.icons-heart
:height 12px
:width 13px
:display inline-block
:vertical-align top
:margin-top 3px
:margin-right 5px
img
:height 12px
:width 12px
.bd
:display inline-block
.expand_likes
:vertical-align text-bottom
.mark_all_read
:position relative
......@@ -1712,6 +1763,10 @@ ul#press_logos
:padding
:left 60px
.icons-monotone_email_letter_round
:height 128px
:width 128px
#email_invitation
input
:width 100%
......@@ -1836,6 +1891,10 @@ ul#press_logos
:top 118px
:right 5px
.icons-deletelabel
:height 8px
:width 8px
h3
:margin 0
:top 6px
......@@ -2113,7 +2172,6 @@ h1.tag
:bottom 1px solid #ddd
:padding 2px 0
:top 0
:left 22px
&.no_icon
:padding
......@@ -2126,16 +2184,47 @@ h1.tag
:font-weight bold
:color #777
.icons-plus,
.icons-heart,
.icons-question,
.icons-monotone_wrench_settings,
.icons-coffee,
.icons-bookmark,
:position absolute
:margin-left 3px
.icons-plus
:width 14px
:height 14px
.icons-heart
:width 13px
:height 13px
.icons-question
:width 16px
:height 16px
.icons-monotone_wrench_settings
:width 16px
:height 16px
.icons-bookmark
:width 14px
:height 16px
.icons-coffee
:width 16px
:height 14px
h5.title-header
:margin-left 22px
h5
:font-size 12px
:margin 0
:color #666
img
:position absolute
:left 3px
:top 0px
.section
.content
:padding 8px
......@@ -2211,14 +2300,47 @@ ul.left_nav
&.sub
:padding-left 6px
a.community_aspect_selector
:width 152px
:vertical-align middle
:display inline-block
:line-height 25px
:text
:decoration none
a
:color #777
:font-weight bold
:color #777
:text
:decoration none
ul.sub_nav
li:hover,
li.hover
@include border-radius(2px)
:background
:color lighten($blue,45%)
.edit,
.unfollow_icon
:display inline-block
.icons-monotone_close_exit_delete
:height 16px
:width 16px
.invisible
:visibility hidden
li
:position relative
:width 100%
.icons-check_yes_ok
:height 18px
:width 18px
:display inline-block
:margin-left 3px
:vertical-align middle
li.active
> a.home_selector:not(.sub_selected)
:font
......@@ -2231,12 +2353,6 @@ ul.left_nav
:weight 700
:color #666
> a.aspect_selector
:background
:image image-url("icons/check_yes_ok.png")
:position 3px 50%
:repeat no-repeat
a.aspect_selector,
a.home_selector,
a.tag_selector,
......@@ -2246,7 +2362,6 @@ ul.left_nav
:cursor -moz-grabbing
:cursor grabbing
a.aspect_selector,
a.home_selector,
a.tag_selector,
a.element_selector,
......@@ -2255,7 +2370,6 @@ ul.left_nav
:width 100%
:padding 3px 7px
a.aspect_selector,
a.home_selector,
a.tag_selector,
a.element_selector
......@@ -2266,8 +2380,8 @@ ul.left_nav
:text
:decoration none
.edit,
.unfollow_icon
:margin-right 10px
:margin-top 4px
@include transition(opacity)
@include opacity(0.3)
......@@ -2276,25 +2390,42 @@ ul.left_nav
&:hover
@include opacity(1)
.contact_count
.edit
:margin-right 10px
:margin-top 4px
:width 12px
:height 12px
:margin-top 6px
@include transition(opacity)
@include opacity(0.3)
:float right
:display none
&:hover
@include opacity(1)
.contact_count
:width 16px
:line-height 16px
:text-align center
@include border-radius(4px)
:margin-top 1px
:color #999
:background
:color #eee
:padding 0 5px
:display inline
:display inline-block
:font
:size 11px
a.home_selector
.contact_count
:float right
ul.sub_nav
:padding 0
:margin 0
li
:width 162px
:width 204px
a.aspect_selector,
a.toggle_selector,
.new_aspect,
a.tag_selector
......@@ -2310,12 +2441,32 @@ ul.left_nav
ul.sub_nav
:width 140px
a.aspect_selector,
a.aspect_selector
:width 112px
:vertical-align middle
:display inline-block
:line-height 25px
:text
:decoration none
a.tag_selector
:width 140px
li
:height 25px
.icons-check_yes_ok
:height 18px
:width 18px
:display inline-block
:margin-left 3px
:vertical-align middle
li:hover,
li.hover
width: 172px
@include border-radius(2px)
:background
:color lighten($blue,45%)
.edit,
.unfollow_icon
:display inline-block
......@@ -2388,6 +2539,10 @@ a.toggle_selector
:height 30px
:width 30px
.icons-monotone_close_exit_delete
:height 20px
:width 20px
#aspect_controls
@include border-radius(2px)
:background
......@@ -2415,12 +2570,25 @@ a.toggle_selector
:margin 5px 0
.bottom_submit_section
:overflow hidden
:display block
:position relative
:text-align right
form
:float left
:display inline-block
:text-align right
.creation
:float right
.icons-padlock-open,
.icons-padlock-closed
:float left
:height 16px
:width 16px
:margin
:left 4px
:top 2px
#no_contacts
:text-align center
......@@ -2429,10 +2597,6 @@ a.toggle_selector
:color #eee
:color #666
.left
:position absolute
:left 0
#notification_dropdown
@include dropdown-shadow
......@@ -2441,7 +2605,7 @@ a.toggle_selector
:left 300px
:width 380px
:display none
:margin-top 8px
:float left
:color #444
......@@ -2502,7 +2666,7 @@ a.toggle_selector
:margin
:left 0px
:padding
:bottom 10px
:bottom 12px
.cubbies_collage
:position absolute
......@@ -2785,11 +2949,13 @@ a.toggle_selector
.close
@include opacity(0)
@include transition(opacity, 0.2s)
:float right
:position relative
:top -9px
:top 1px
:right -5px
:float right
.icons-deletelabel
:height 8px
:width 8px
&:hover
.close
......
{{#if canRemove}}
<div class="controls">
<a href="#" class="delete comment_delete" title="{{t "delete"}}">
<img alt="Deletelabel" src="{{imageUrl "deletelabel.png"}}" />
<div alt="Deletelabel" class="icons-deletelabel" />
<a/>
</div>
{{/if}}
......
......@@ -20,27 +20,30 @@
<div id="nav_badges">
<div class="badge badge-inverse" id="notification_badge">
<a href="/notifications" title="{{t "header.notifications"}}">
<img alt="{{t "header.notifications"}}" id="notification-flag" src="{{imageUrl "icons/notifications_grey.png"}}" />
<div class="badge_count {{#unless current_user.notifications_count}} hidden {{/unless}}">
{{current_user.notifications_count}}
</div>
</a>
<div class="icons-notifications_grey" >
<a href="/notifications" title="{{t "header.notifications"}}" class="badge_link" >
<div class="badge_count {{#unless current_user.notifications_count}} hidden {{/unless}}">
{{current_user.notifications_count}}
</div>
</a>
</div>
</div>
<div class="badge badge-inverse" id="message_inbox_badge">
<a href="/conversations" title="{{t "header.messages"}}">
<img alt="{{t "header.messages"}}" src="{{imageUrl "icons/mail_grey.png"}}" />
<div class="badge_count {{#unless current_user.unread_messages_count}} hidden {{/unless}}">
{{current_user.unread_messages_count}}
</div>
</a>
<div class="icons-mail_grey" >
<a href="/conversations" title="{{t "header.messages"}}" class="badge_link" >
<div class="badge_count {{#unless current_user.unread_messages_count}} hidden {{/unless}}">
{{current_user.unread_messages_count}}
</div>
</a>
</div>
</div>
<div id="notification_dropdown">
<div class="header">
<div class="right">
<a href="#" id="mark_all_read_link">
{{t "header.mark_all_as_read"}}
</a>
......
{{#if likesCount}}
<div class="comment">
<div class="media">