Change to Font Awesome icon font (fixes #2138)

- remove Glyphicon assets and customize bootstrap CSS
- add Font Awesome v4.4.0 assets
- replace Glyphicons with Font Awesome icons in HTML
- add icons to modal headers
- add attribution for Font Awesome
- format HTML source code for buttons

gui/syncthing/core/aboutModalView.html

@@ -1,4 +1,4 @@
-<modal id="about" large="yes" close="yes" status="info" title="{{'About' | translate}}">
+<modal id="about" status="info" icon="heart-o" title="{{'About' | translate}}" large="yes" close="yes">
   <h1 class="text-center"><img alt="Syncthing" title="Syncthing" src="assets/img/logo-horizontal.svg" style="vertical-align: -16px" height="100" width="366"/><br/><small>{{versionString()}}</small></h1>
   <hr/>
 
@@ -86,5 +86,6 @@
     <li><a href="https://github.com/vitrun/qart">vitrun/qart</a>, Copyright &copy; The Go Authors.</li>
     <li><a href="https://angularjs.org/">AngularJS</a>, Copyright &copy; 2010-2015 Google, Inc.</li>
     <li><a href="http://getbootstrap.com/">Bootstrap</a>, Copyright &copy; 2011-2015 Twitter, Inc.</li>
+    <li><a href="http://fontawesome.io/">Font Awesome</a>, Copyright &copy; 2015 Dave Gandy</li>
   </ul>
 </modal>

gui/syncthing/core/httpErrorDialogView.html

@@ -1,4 +1,4 @@
-<modal id="httpError" status="danger" icon="exclamation-sign" title="{{'Connection Error' | translate}}">
+<modal id="httpError" status="danger" icon="exclamation-circle" title="{{'Connection Error' | translate}}">
 	<p translate>
 	  Syncthing seems to be experiencing a problem processing your request. Please refresh the page or restart Syncthing if the problem persists.
 	</p>

gui/syncthing/core/languageSelectDirective.js

@@ -4,7 +4,7 @@ angular.module('syncthing.core')
         return {
             restrict: 'EA',
             template:
-                    '<a ng-if="visible" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true"><span class="glyphicon glyphicon-globe"></span>&nbsp;{{localesNames[currentLocale] || "English"}} <span class="caret"></span></a>'+
+                    '<a ng-if="visible" href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true"><span class="fa fa-globe"></span>&nbsp;{{localesNames[currentLocale] || "English"}} <span class="caret"></span></a>'+
                     '<ul ng-if="visible" class="dropdown-menu">'+
                         '<li ng-repeat="(i,name) in localesNames" ng-class="{active: i==currentLocale}">'+
                             '<a href="#" data-ng-click="changeLanguage(i)">{{name}}</a>'+

gui/syncthing/core/majorUpgradeModalView.html

@@ -3,8 +3,7 @@
     <div class="modal-content">
       <div class="modal-header alert alert-danger">
         <h4 class="modal-title">
-          <span ng-if="icon" class="glyphicon glyphicon-chevron-up"></span>
-          <span translate>Major Upgrade</span>
+          <span class="fa fa-arrow-circle-up"></span><span translate>Major Upgrade</span>
         </h4>
       </div>
       <div class="modal-body">
@@ -18,8 +17,12 @@
         </p>
       </div>
       <div class="modal-footer">
-        <button type="button" class="btn btn-primary btn-sm" ng-click="upgrade()"><span class="glyphicon glyphicon-ok"></span>&nbsp;<span translate>Upgrade</span></button>
-        <button type="button" class="btn btn-default btn-sm" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span>&nbsp;<span translate>Close</span></button>
+        <button type="button" class="btn btn-primary btn-sm" ng-click="upgrade()">
+          <span class="fa fa-check"></span>&nbsp;<span translate>Upgrade</span>
+        </button>
+        <button type="button" class="btn btn-default btn-sm" data-dismiss="modal">
+          <span class="fa fa-times"></span>&nbsp;<span translate>Close</span>
+        </button>
       </div>
     </div>
   </div>

gui/syncthing/core/networkErrorDialogView.html

@@ -1,4 +1,4 @@
-<modal id="networkError" status="danger" icon="exclamation-sign" title="{{'Connection Error' | translate}}">
+<modal id="networkError" status="danger" icon="exclamation-circle" title="{{'Connection Error' | translate}}">
 	<p translate>
 	  Syncthing seems to be down, or there is a problem with your Internet connection. Retrying&hellip;
 	</p>

gui/syncthing/core/restartingDialogView.html

@@ -1,3 +1,3 @@
-<modal id="restarting" icon="refresh" title="{{'Restarting' | translate}}" status="info">
+<modal id="restarting" status="info" icon="refresh" title="{{'Restarting' | translate}}">
 	<p><span translate>Syncthing is restarting.</span> <span translate>Please wait</span>...</p>
 </modal>

gui/syncthing/core/shutdownDialogView.html

@@ -1,3 +1,3 @@
-<modal id="shutdown" icon="off" status="success" title="{{'Shutdown Complete' | translate}}">
+<modal id="shutdown" status="success" icon="power-off" title="{{'Shutdown Complete' | translate}}">
 	<p translate>Syncthing has been shut down.</p>
 </modal>

gui/syncthing/core/syncthingController.js

@@ -69,9 +69,9 @@ angular.module('syncthing.core')
             'touch': 'Update'
         };
         $scope.needIcons = {
-            'rm': 'remove',
-            'rmdir': 'remove',
-            'sync': 'download',
+            'rm': 'trash-o',
+            'rmdir': 'trash-o',
+            'sync': 'arrow-circle-o-down',
             'touch': 'asterisk'
         };
 

gui/syncthing/core/upgradingDialogView.html

@@ -1,3 +1,3 @@
-<modal id="upgrading" icon="refresh" title="{{'Upgrading' | translate}}" status="info">
+<modal id="upgrading" status="info" icon="arrow-circle-up" title="{{'Upgrading' | translate}}">
 	<p><span translate>Syncthing is upgrading.</span> <span translate>Please wait</span>...</p>
 </modal>