From 6c27623b8092c5e5e03e646d9ad74b5847af670d Mon Sep 17 00:00:00 2001
From: Devin Howard <devin@callysto.com>
Date: Mon, 26 Oct 2015 12:22:40 +0800
Subject: [PATCH] change css files to use asset_data_uri

---
 app/assets/stylesheets/application.css.erb    | 72 +++++++++----------
 app/assets/stylesheets/base.css.erb           | 40 +++++------
 app/assets/stylesheets/clean.css.erb          | 40 +++++------
 .../{jquery-ui.css => jquery-ui.css.erb}      | 34 ++++-----
 .../stylesheets/jquery.mCustomScrollbar.css   |  4 +-
 5 files changed, 95 insertions(+), 95 deletions(-)
 rename app/assets/stylesheets/{jquery-ui.css => jquery-ui.css.erb} (88%)

diff --git a/app/assets/stylesheets/application.css.erb b/app/assets/stylesheets/application.css.erb
index ed4ec2ac..f2093a0f 100644
--- a/app/assets/stylesheets/application.css.erb
+++ b/app/assets/stylesheets/application.css.erb
@@ -78,7 +78,7 @@ html {
 
 } 
 body {
-    background: #d8d9da url(shattered_@2X.png);
+    background: #d8d9da url(<%= asset_data_uri('shattered_@2X.png') %>);
     font-family: 'din-medium', helvetica, sans-serif;
     color: #424242;
     -moz-osx-font-smoothing: grayscale;
@@ -300,7 +300,7 @@ input[type="submit"]:active {
     display: none;
     width: 40px;
     height: 40px;
-    background-image: url(photo.png);
+    background-image: url(<%= asset_data_uri('photo.png') %>);
     position: absolute;
     top: 22px;
     left: 22px;
@@ -413,7 +413,7 @@ input[type="submit"]:active {
 
 }
 .accountName:hover .nameEdit:after {
-    background:url(edit.png)no-repeat;
+    background: url(<%= asset_data_uri('edit.png') %>) no-repeat;
     content:" ";
     position:absolute;
     width:25px;
@@ -547,7 +547,7 @@ input[type="submit"]:active {
     display: block;
     height: 16px;
     width: 16px;
-    background-image: url(metacodesettings_sprite.png);
+    background-image: url(<%= asset_data_uri('metacodesettings_sprite.png') %>);
     position: absolute;
     z-index: 2;
     top: 20px;
@@ -652,7 +652,7 @@ label {
     box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.4);
 }
 .headertop .tab {
-    background: url(tab.png) no-repeat 0 0;
+    background: url(<%= asset_data_uri('tab.png') %>) no-repeat 0 0;
     position: absolute;
     top: -11px;
     right: -2px;
@@ -719,7 +719,7 @@ label {
 .accountInnerArrow {
     width:16px;
     height:16px;
-    background-image: url(arrowdown_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowdown_sprite.png') %>);
     background-repeat: no-repeat;
     position:absolute;
     top: 8px;
@@ -783,7 +783,7 @@ label {
     position:absolute;
     pointer-events:none;
     background-repeat:no-repeat;
-    background-image: url(user_sprite.png);
+    background-image: url(<%= asset_data_uri('user_sprite.png') %>);
 }
 .accountSettings .accountIcon {
     background-position: 0 0;
@@ -1145,7 +1145,7 @@ h3.realtimeBoxTitle {
     position: absolute;
     top: 4px;
     right: 0;
-    background-image: url('junto24_sprite.png');
+    background-image: url(<%= asset_data_uri(''junto24_sprite.png'') %>);
 }
 .realtimeMapperList .littleRtOff  .littleJuntoIcon {
     background-position: 0 0;
@@ -1222,7 +1222,7 @@ h3.realtimeBoxTitle {
     position: absolute;
     top: 0;
     left: 4px;
-    background-image: url(context_sprite.png);
+    background-image: url(<%= asset_data_uri('context_sprite.png') %>);
     background-repeat: no-repeat;
     width: 24px;
     height: 24px;
@@ -1238,7 +1238,7 @@ h3.realtimeBoxTitle {
 }
 
 .rightclickmenu .rc-center .rc-icon {
-    background-image: url(context_topicview_sprite.png);
+    background-image: url(<%= asset_data_uri('context_topicview_sprite.png') %>);
 }
 .rightclickmenu .rc-popout .rc-icon {
     background-position: 0 -72px;
@@ -1251,7 +1251,7 @@ h3.realtimeBoxTitle {
 }
 .rightclickmenu .rc-siblings .rc-icon {
     background-position: 0 -24px;
-    background-image: url(context_topicview_sprite.png);
+    background-image: url(<%= asset_data_uri('context_topicview_sprite.png') %>);
 }
 .rightclickmenu .expandLi {
     position: absolute;
@@ -1259,7 +1259,7 @@ h3.realtimeBoxTitle {
     right: 8px;
     width: 16px;
     height: 16px;
-    background-image: url(arrowright_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowright_sprite.png') %>);
     background-repeat: no-repeat;
     background-position: 0 -32px;
 }
@@ -1294,7 +1294,7 @@ h3.realtimeBoxTitle {
     position: absolute;
     top: 0;
     left: 4px;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
     background-size: 72px 48px;
     background-repeat: no-repeat;
     width: 24px;
@@ -1339,7 +1339,7 @@ h3.realtimeBoxTitle {
     right: 4px;
     width: 16px;
     height: 16px;
-    background-image: url(arrowright_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowright_sprite.png') %>);
     background-repeat: no-repeat;
     background-position: 0 -32px;
 }
@@ -1419,7 +1419,7 @@ h3.realtimeBoxTitle {
     top: 8px;
     right: 8px;
     background-repeat: no-repeat;
-    background-image: url(arrowright_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowright_sprite.png') %>);
     background-position: 0 -32px;
 }
 #new_topic .tt-suggestion:hover .expandTopicMetadata,
@@ -1445,7 +1445,7 @@ h3.realtimeBoxTitle {
     width: 32px;
     height: 32px;
     background-repeat: no-repeat;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
     position: absolute;
     bottom: 4px;
     right: 4px;
@@ -1465,7 +1465,7 @@ h3.realtimeBoxTitle {
 #new_topic .topicNumMaps {
     height: 14px;
     padding: 1px 0 1px 32px;
-    background-image: url(metamap16.png);
+    background-image: url(<%= asset_data_uri('metamap16.png') %>);
     background-repeat: no-repeat;
     background-position: 8px 0;
     position: absolute;
@@ -1474,7 +1474,7 @@ h3.realtimeBoxTitle {
 #new_topic .topicNumSynapses {
     height: 14px;
     padding: 1px 0 1px 32px;
-    background-image: url(synapse16.png);
+    background-image: url(<%= asset_data_uri('synapse16.png') %>);
     background-repeat: no-repeat;
     background-position: 8px 0;
     position: absolute;
@@ -1564,7 +1564,7 @@ h3.realtimeBoxTitle {
     width: 32px;
     height: 32px;
     background-repeat: no-repeat;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
 }
 /* map info box */
 /* map info box */
@@ -1604,7 +1604,7 @@ h3.realtimeBoxTitle {
     resize: none;
 }
 .mapInfoBox.canEdit #mapInfoName:hover {
-    background-image: url(edit.png);
+    background-image: url(<%= asset_data_uri('edit.png') %>);
     background-repeat: no-repeat;
     background-position: bottom right;
     cursor: text;
@@ -1758,11 +1758,11 @@ h3.realtimeBoxTitle {
 }
 
 .mapTopics {
-    background-image: url(topic32.png);
+    background-image: url(<%= asset_data_uri('topic32.png') %>);
     background-position: 13px center;
 }
 .mapSynapses {
-    background-image: url(synapse32padded.png);
+    background-image: url(<%= asset_data_uri('synapse32padded.png') %>);
     background-position: 13px center;
 }
 .mapInfoBox .mapPermission {
@@ -1772,7 +1772,7 @@ h3.realtimeBoxTitle {
     padding: 0;
     margin: 8px 30px 8px 10px;
     position: relative;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
 }
 .mapInfoBox .mapPermission.commons {
     background-position: 0 0;
@@ -1784,12 +1784,12 @@ h3.realtimeBoxTitle {
     background-position: -32px 0;
 }
 .yourMap .mapPermission:hover {
-    background-image: url(arrowperms_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowperms_sprite.png') %>);
     cursor: pointer;
     background-position: -32px 0;
 }
 .yourMap .mapPermission.minimize {
-    background-image: url(arrowperms_sprite.png) !important;
+    background-image: url(<%= asset_data_uri('arrowperms_sprite.png') %>) !important;
     cursor: pointer;
     background-position: 0 0;
 }
@@ -1804,7 +1804,7 @@ h3.realtimeBoxTitle {
     width: 32px;
     height: 32px;
     background-repeat: no-repeat;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
 }
 .mapInfoBox .mapPermission .permissionSelect .commons {
     background-position: 0 0;
@@ -1851,7 +1851,7 @@ h3.realtimeBoxTitle {
     width: 340px;
 }
 .mapInfoBox.canEdit .mapInfoDesc:hover {
-    background-image: url(edit.png);
+    background-image: url(<%= asset_data_uri('edit.png') %>);
     background-position: top right;
     background-repeat: no-repeat;
     cursor: text;
@@ -1896,7 +1896,7 @@ h3.realtimeBoxTitle {
 .mapInfoShareIcon {
     width: 24px;
     height: 24px;
-    background-image: url(share_sprite_mapinfo.png);
+    background-image: url(<%= asset_data_uri('share_sprite_mapinfo.png') %>);
     background-repeat: no-repeat;
     margin: 4px auto 0;
     background-position: 0 -24px;
@@ -1917,7 +1917,7 @@ and it won't be important on password protected instances */
     width: 16px;
     height: 16px;
     margin: 8px auto 0;
-    background-image: url(remove_mapinfo_sprite.png);
+    background-image: url(<%= asset_data_uri('remove_mapinfo_sprite.png') %>);
     background-repeat: no-repeat;
     background-position: -16px 0;
 }
@@ -1978,7 +1978,7 @@ and it won't be important on password protected instances */
     border: solid 2px #000;
 }
 #lightbox_overlay #lightbox_main a#lightbox_close {
-    background-image: url(xlightbox.png);
+    background-image: url(<%= asset_data_uri('xlightbox.png') %>);
     cursor: pointer;
     height: 32px;
     outline-style: none;
@@ -2077,7 +2077,7 @@ and it won't be important on password protected instances */
     color: #00bcd4;
 }
 .lightbox_links .lightboxAboutIcon {
-    background-image: url(about_sprite.png);
+    background-image: url(<%= asset_data_uri('about_sprite.png') %>);
     background-repeat: no-repeat;
     width:32px;
     height:32px;
@@ -2497,7 +2497,7 @@ and it won't be important on password protected instances */
     position: relative;
 }
 .new_map .mapPermIcon {
-    background-image: url(permissions64sprite.png);
+    background-image: url(<%= asset_data_uri('permissions64sprite.png') %>);
     background-repeat: no-repeat;
     width:64px;
     height:64px;
@@ -2612,7 +2612,7 @@ and it won't be important on password protected instances */
 }
 
 #zoomIn {
-    background: #424242 url(zoom_sprite.png) no-repeat;
+    background: #424242 url(<%= asset_data_uri('zoom_sprite.png') %>) no-repeat;
     width: 22px;
     height: 22px;
     display: inline-block;
@@ -2624,7 +2624,7 @@ and it won't be important on password protected instances */
 }
 
 #zoomOut {
-    background: #424242 url(zoom_sprite.png) no-repeat;
+    background: #424242 url(<%= asset_data_uri('zoom_sprite.png') %>) no-repeat;
     width: 22px;
     height: 22px;
     display: inline-block;
@@ -2636,7 +2636,7 @@ and it won't be important on password protected instances */
 }
 
 #centerMap {
-    background: #424242 url(extents_sprite.png) no-repeat;
+    background: #424242 url(<%= asset_data_uri('extents_sprite.png') %>) no-repeat;
     width: 22px;
     height: 22px;
     display: inline-block;
@@ -2941,7 +2941,7 @@ and it won't be important on password protected instances */
 .compassArrow {
     display: none;
     background-repeat: no-repeat;
-    background-image: url(compass_arrow.png);
+    background-image: url(<%= asset_data_uri('compass_arrow.png') %>);
     width: 48px;
     height: 32px;
     position: absolute;
diff --git a/app/assets/stylesheets/base.css.erb b/app/assets/stylesheets/base.css.erb
index 858163ad..216fa04d 100644
--- a/app/assets/stylesheets/base.css.erb
+++ b/app/assets/stylesheets/base.css.erb
@@ -85,7 +85,7 @@
   padding: 0 16px;
 }
 .canEdit #titleActivator:hover {
-  background-image: url(edit.png);
+  background-image: url(<%= asset_data_uri('edit.png') %>);
   background-repeat: no-repeat;
   background-position: bottom right;
   cursor: text;
@@ -148,7 +148,7 @@
   margin-right: 8px;
 }
 .canEdit .CardOnGraph .best_in_place_desc:hover {
-  background-image: url(edit.png);
+  background-image: url(<%= asset_data_uri('edit.png') %>);
   background-position: top right;
   background-repeat: no-repeat;
   cursor: text;
@@ -244,7 +244,7 @@
   left: 0;
   width: 32px;
   height: 32px;
-  background-image: url(map32_sprite.png);
+  background-image: url(<%= asset_data_uri('map32_sprite.png') %>);
   background-repeat: no-repeat;
   background-position: 0 0;
   cursor: pointer;
@@ -335,7 +335,7 @@
   left: 0;
   width: 32px;
   height: 32px;
-  background-image: url(synapse32_sprite.png);
+  background-image: url(<%= asset_data_uri('synapse32_sprite.png') %>);
   background-repeat: no-repeat;
   background-position: 0 0;
 }
@@ -382,7 +382,7 @@
   min-width: 32px;
   margin-top: 8px;
   margin-left: 8px;
-  background-image: url(permissions32_sprite.png);
+  background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
   background-position: 0 0;
 }
 .mapPerm.co {
@@ -396,12 +396,12 @@
 }
 
 .yourTopic .mapPerm:hover, .yourEdge .mapPerm:hover {
-  background-image: url(arrowperms_sprite.png);
+  background-image: url(<%= asset_data_uri('arrowperms_sprite.png') %>);
   background-position: -32px 0;
   cursor:pointer;
 }
 .yourTopic .mapPerm.minimize, .yourEdge .mapPerm.minimize {
- background-image: url(arrowperms_sprite.png) !important;
+ background-image: url(<%= asset_data_uri('arrowperms_sprite.png') %>) !important;
 background-position: 0 0;
 cursor: pointer;
 }
@@ -417,7 +417,7 @@ cursor: pointer;
   height: 32px;
   background-repeat: no-repeat;
   background-position: 0 0;
-  background-image: url(permissions32_sprite.png);
+  background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
 }
 .mapPerm .permissionSelect .commons {
   background-position: 0 0;
@@ -462,7 +462,7 @@ cursor: pointer;
   right: 16px;
   width: 16px;
   height: 16px;
-  background-image: url(arrowright_sprite.png);
+  background-image: url(<%= asset_data_uri('arrowright_sprite.png') %>);
   background-repeat: no-repeat;
   background-position: 0 -32px;
 }
@@ -542,7 +542,7 @@ background-color: #E0E0E0;
   right: 8px;
   width: 16px;
   height: 16px;
-  background-image: url(arrowright_sprite.png);
+  background-image: url(<%= asset_data_uri('arrowright_sprite.png') %>);
   background-repeat: no-repeat;
   background-position: 0 -32px;
 }
@@ -648,10 +648,10 @@ background-color: #E0E0E0;
   left: 12px;
 }
 #linkIcon {
-  background-image: url(link_sprite.png);
+  background-image: url(<%= asset_data_uri('link_sprite.png') %>);
 }
 #uploadIcon {
-  background-image: url(upload_sprite.png);
+  background-image: url(<%= asset_data_uri('upload_sprite.png') %>);
 }
 #addlink:hover #linkIcon, #addupload:hover #uploadIcon {
   background-position: 0 -24px;
@@ -690,7 +690,7 @@ font-family: 'din-regular', helvetica, sans-serif;
   height: 24px;
   background-repeat: no-repeat;
   background-position: 0 0;
-  background-image: url(link_sprite.png);
+  background-image: url(<%= asset_data_uri('link_sprite.png') %>);
   pointer-events: none;
   z-index: 1;
 }
@@ -703,7 +703,7 @@ font-family: 'din-regular', helvetica, sans-serif;
   height: 32px;
   cursor: pointer;
   float:none;
-  background-image: url(remove.png);
+  background-image: url(<%= asset_data_uri('remove.png') %>);
   background-repeat: no-repeat;
   background-position: center center;
 }
@@ -781,7 +781,7 @@ font-family: 'din-regular', helvetica, sans-serif;
 }
 
 #editSynUpperBar {
-  background: #FFFFFF url(synapse32.png) no-repeat 8px center;
+  background: #FFFFFF url(<%= asset_data_uri('synapse32.png') %>) no-repeat 8px center;
   min-height: 48px;
   height: 48px;
   border-bottom: 1px solid #222222;
@@ -814,7 +814,7 @@ font-family: 'din-regular', helvetica, sans-serif;
 }
 
 .canEdit #edit_synapse_desc:hover {
-  background-image: url(edit.png);
+  background-image: url(<%= asset_data_uri('edit.png') %>);
   background-repeat: no-repeat;
   background-position: 164px center;
   cursor: text;
@@ -841,7 +841,7 @@ font-family: 'din-regular', helvetica, sans-serif;
   height: 24px;
   top: 12px;
   right: 8px;
-  background-image: url(arrowdown_sprite.png);
+  background-image: url(<%= asset_data_uri('arrowdown_sprite.png') %>);
   background-repeat: no-repeat;
   background-position: 4px -12px;
 }
@@ -923,11 +923,11 @@ font-family: 'din-regular', helvetica, sans-serif;
   background-repeat: no-repeat;
 }
 #edit_synapse_right {
-  background-image: url(synapsedirectionright_sprite.png);
+  background-image: url(<%= asset_data_uri('synapsedirectionright_sprite.png') %>);
   right: 16px; 
 }
 #edit_synapse_left {
-  background-image: url(synapsedirectionleft_sprite.png);
+  background-image: url(<%= asset_data_uri('synapsedirectionleft_sprite.png') %>);
   right: 56px; 
 }
 #edit_synapse_left.checked, #edit_synapse_right.checked {
@@ -1103,7 +1103,7 @@ font-family: 'din-regular', helvetica, sans-serif;
 }
 
 .mapperMetadata {
-    background: url(profile_card_sprite.png) no-repeat center 0;
+    background: url(<%= asset_data_uri('profile_card_sprite.png') %>) no-repeat center 0;
     height: 64px;
     width: 160px;
     margin: 16px auto 0;
diff --git a/app/assets/stylesheets/clean.css.erb b/app/assets/stylesheets/clean.css.erb
index 008e8c9d..fa0c9758 100644
--- a/app/assets/stylesheets/clean.css.erb
+++ b/app/assets/stylesheets/clean.css.erb
@@ -134,7 +134,7 @@
 	width: 40px;
     height: 32px;
     background-color: #757575;
-    background-image: url(home_light.png);
+    background-image: url(<%= asset_data_uri('home_light.png') %>);
     background-repeat: no-repeat;
     background-position: center center;
     border-top-left-radius: 2px;
@@ -142,7 +142,7 @@
     float:left;
 }
 .homeButton:hover {
-    background-image: url(home_light.png);
+    background-image: url(<%= asset_data_uri('home_light.png') %>);
 }
 .homeButton a {
     display:block;
@@ -176,7 +176,7 @@
     border-top-right-radius: 2px;
     border-bottom-right-radius: 2px;
     height: 32px;
-    background: #4fb5c0 url('search.png') no-repeat center center;
+    background: #4fb5c0 url(<%= asset_data_uri(''search.png'') %>) no-repeat center center;
     background-size: 32px 32px;
     cursor: pointer;
 }
@@ -288,7 +288,7 @@
 .sidebarSearch .tt-dropdown-menu .minimizeResults, .sidebarSearch .tt-dropdown-menu .maximizeResults {
     width: 32px;
     height: 32px;
-    background-image: url(arrowpermswhite_sprite.png);
+    background-image: url(<%= asset_data_uri('arrowpermswhite_sprite.png') %>);
     background-repeat: no-repeat;
     cursor: pointer;
     position: absolute;
@@ -425,7 +425,7 @@
     display:none;
     width: 24px;
     height: 24px;
-    background: url(addtopic_sprite.png);
+    background: url(<%= asset_data_uri('addtopic_sprite.png') %>);
     background-repeat: no-repeat;
     background-size: 48px 24px;
     top: 12px;
@@ -442,7 +442,7 @@
 .sidebarSearch div.topicCount {
     width: 24px;
     height: 24px;
-    background: url(topic16.png);
+    background: url(<%= asset_data_uri('topic16.png') %>);
     background-repeat: no-repeat;
     background-position: 0 center;
     top: 0;
@@ -455,7 +455,7 @@
 .sidebarSearch div.mapCount {
     width: 24px;
     height: 24px;
-    background: url(metamap16.png);
+    background: url(<%= asset_data_uri('metamap16.png') %>);
     background-repeat: no-repeat;
     background-position: 0 center;
     left: 0;
@@ -466,7 +466,7 @@
 .sidebarSearch div.synapseCount {
     width: 24px;
     height: 24px;
-    background: url(synapse16.png);
+    background: url(<%= asset_data_uri('synapse16.png') %>);
     background-repeat: no-repeat;
     background-position: 0 center;
     top: 24px;
@@ -573,7 +573,7 @@
 .sidebarSearch div.mapPermission {
     width: 24px;
     height: 24px;
-    background-image: url(permissions32_sprite.png);
+    background-image: url(<%= asset_data_uri('permissions32_sprite.png') %>);
     background-repeat: no-repeat;
     background-size: 72px 48px !important;
     top: 24px;
@@ -665,7 +665,7 @@
 .upperRightIcon {
     width: 32px;
     height: 32px;
-    background-image: url('topright_sprite.png');
+    background-image: url(<%= asset_data_uri(''topright_sprite.png'') %>);
     background-repeat: no-repeat;
     cursor: pointer;
 }
@@ -816,12 +816,12 @@
 }
 
 .fullWidthWrapper.withPartners {
-    background: url(homepage_bg_fade.png) no-repeat center -300px;
+    background: url(<%= asset_data_uri('homepage_bg_fade.png') %>) no-repeat center -300px;
 }
 .homeWrapper.homePartners {
     padding: 64px 0 280px;
     height: 96px;
-    background: url(partner_logos.png) no-repeat 0 64px;
+    background: url(<%= asset_data_uri('partner_logos.png') %>) no-repeat 0 64px;
 }
 
 .github-fork-ribbon-wrapper {
@@ -863,7 +863,7 @@
     cursor: pointer;
 }
 .openCheatsheet {
-    background-image: url('help_sprite.png');
+    background-image: url(<%= asset_data_uri(''help_sprite.png'') %>);
     background-repeat:no-repeat;
 }
 .openCheatsheet:hover {
@@ -872,7 +872,7 @@
 .mapInfoIcon {
 	position: relative;
 	top: 56px; /* puts it just offscreen */
-    background-image: url('mapinfo_sprite.png');
+    background-image: url(<%= asset_data_uri(''mapinfo_sprite.png'') %>);
     background-repeat:no-repeat;
 }
 .mapInfoIcon:hover {
@@ -931,7 +931,7 @@
 .zoomExtents {
     margin-bottom:5px;
     border-radius: 2px;
-    background-image: url(extents_sprite.png);
+    background-image: url(<%= asset_data_uri('extents_sprite.png') %>);
 }
 
 .zoomExtents:hover {
@@ -1076,7 +1076,7 @@
 }
 
 .zoomIn {
-    background-image: url(zoom_sprite.png);
+    background-image: url(<%= asset_data_uri('zoom_sprite.png') %>);
     background-position: 0 /…0;
     border-top-left-radius: 2px;
     border-top-right-radius: 2px;
@@ -1085,7 +1085,7 @@
     background-position: -32px 0;
 }
 .zoomOut {
-    background-image: url(zoom_sprite.png);
+    background-image: url(<%= asset_data_uri('zoom_sprite.png') %>);
     background-position:0 -32px;
     border-bottom-left-radius: 2px;
     border-bottom-right-radius: 2px;
@@ -1163,15 +1163,15 @@
     left:5px;
 }
 .exploreMapsCenter .myMaps .exploreMapsIcon {
-    background-image: url(<%= asset_path 'exploremaps_sprite.png' %>);
+    background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
     background-position: 0 0;
 }
 .exploreMapsCenter .activeMaps .exploreMapsIcon {
-    background-image: url(<%= asset_path 'exploremaps_sprite.png' %>);
+    background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
     background-position: -32px 0;
 }
 .exploreMapsCenter .featuredMaps .exploreMapsIcon {
-    background-image: url(<%= asset_path 'exploremaps_sprite.png' %>);
+    background-image: url(<%= asset_data_uri 'exploremaps_sprite.png' %>);
     background-position: -64px 0;
 }
 .myMaps:hover .exploreMapsIcon, .myMaps.active .exploreMapsIcon {
diff --git a/app/assets/stylesheets/jquery-ui.css b/app/assets/stylesheets/jquery-ui.css.erb
similarity index 88%
rename from app/assets/stylesheets/jquery-ui.css
rename to app/assets/stylesheets/jquery-ui.css.erb
index c89a95ff..88113a6e 100644
--- a/app/assets/stylesheets/jquery-ui.css
+++ b/app/assets/stylesheets/jquery-ui.css.erb
@@ -243,25 +243,25 @@ body .ui-tooltip { border-width: 2px; }
 .ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
 .ui-widget .ui-widget { font-size: 1em; }
 .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
-.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
+.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(<%= asset_data_uri('ui-bg_flat_75_ffffff_40x100.png') %>)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
 .ui-widget-content a { color: #222222/*{fcContent}*/; }
-.ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/; background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; }
+.ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/; background: #cccccc/*{bgColorHeader}*/ url(<%= asset_data_uri('images/ui-bg_highlight-soft_75_cccccc_1x100.png') %>)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; }
 .ui-widget-header a { color: #222222/*{fcHeader}*/; }
 
 /* Interaction states
 ----------------------------------*/
-.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }
+.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(<%= asset_data_uri('images/ui-bg_glass_75_e6e6e6_1x400.png') %>)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; }
 .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; }
-.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 0px solid #999999/*{borderColorHover}*/; background: #dadada/*{bgColorHover}*/ url(images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; }
+.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 0px solid #999999/*{borderColorHover}*/; background: #dadada/*{bgColorHover}*/ url(<%= asset_data_uri('images/ui-bg_glass_75_dadada_1x400.png') %>)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; }
 .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited { color: #212121/*{fcHover}*/; text-decoration: none; }
-.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; }
+.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(<%= asset_data_uri('images/ui-bg_glass_65_ffffff_1x400.png') %>)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; }
 .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; text-decoration: none; }
 
 /* Interaction Cues
 ----------------------------------*/
-.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; }
+.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(<%= asset_data_uri('images/ui-bg_glass_55_fbf9ee_1x400.png') %>)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; }
 .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636/*{fcHighlight}*/; }
-.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(images/ui-bg_glass_95_fef1ec_1x400.png)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; }
+.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(<%= asset_data_uri('images/ui-bg_glass_95_fef1ec_1x400.png') %>)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; }
 .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cd0a0a/*{fcError}*/; }
 .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cd0a0a/*{fcError}*/; }
 .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; }
@@ -273,14 +273,14 @@ body .ui-tooltip { border-width: 2px; }
 ----------------------------------*/
 
 /* states and images */
-.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
-.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsContent}*/; }
-.ui-widget-header .ui-icon {background-image: url(images/ui-icons_222222_256x240.png)/*{iconsHeader}*/; }
-.ui-state-default .ui-icon { background-image: url(images/ui-icons_888888_256x240.png)/*{iconsDefault}*/; }
-.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsHover}*/; }
-.ui-state-active .ui-icon {background-image: url(images/ui-icons_454545_256x240.png)/*{iconsActive}*/; }
-.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_2e83ff_256x240.png)/*{iconsHighlight}*/; }
-.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_cd0a0a_256x240.png)/*{iconsError}*/; }
+.ui-icon { width: 16px; height: 16px; background-image: url(<%= asset_data_uri('images/ui-icons_222222_256x240.png') %>)/*{iconsContent}*/; }
+.ui-widget-content .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_222222_256x240.png') %>)/*{iconsContent}*/; }
+.ui-widget-header .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_222222_256x240.png') %>)/*{iconsHeader}*/; }
+.ui-state-default .ui-icon { background-image: url(<%= asset_data_uri('images/ui-icons_888888_256x240.png') %>)/*{iconsDefault}*/; }
+.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_454545_256x240.png') %>)/*{iconsHover}*/; }
+.ui-state-active .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_454545_256x240.png') %>)/*{iconsActive}*/; }
+.ui-state-highlight .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_2e83ff_256x240.png') %>)/*{iconsHighlight}*/; }
+.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(<%= asset_data_uri('images/ui-icons_cd0a0a_256x240.png') %>)/*{iconsError}*/; }
 
 /* positioning */
 .ui-icon-carat-1-n { background-position: 0 0; }
@@ -470,5 +470,5 @@ body .ui-tooltip { border-width: 2px; }
 .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }
 
 /* Overlays */
-.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; }
-.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; }
+.ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(<%= asset_data_uri('images/ui-bg_flat_0_aaaaaa_40x100.png') %>)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; }
+.ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(images/<%= asset_data_uri('ui-bg_flat_0_aaaaaa_40x100.png') %>)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; }
diff --git a/app/assets/stylesheets/jquery.mCustomScrollbar.css b/app/assets/stylesheets/jquery.mCustomScrollbar.css
index e318b29c..f799cdc4 100644
--- a/app/assets/stylesheets/jquery.mCustomScrollbar.css
+++ b/app/assets/stylesheets/jquery.mCustomScrollbar.css
@@ -162,7 +162,7 @@
 .mCSB_scrollTools .mCSB_buttonDown,
 .mCSB_scrollTools .mCSB_buttonLeft,
 .mCSB_scrollTools .mCSB_buttonRight{
-	background-image:url(mCSB_buttons.png);
+	background-image:url(<%= asset_data_uri('mCSB_buttons.png') %>);
 	background-repeat:no-repeat;
 	opacity:0.4;
 	filter:"alpha(opacity=40)"; -ms-filter:"alpha(opacity=40)"; /* old ie */
@@ -471,4 +471,4 @@
 }
 .mCS-dark-thin>.mCSB_scrollTools .mCSB_buttonRight{
 	background-position:-80px -56px;
-}
\ No newline at end of file
+}