Update bower dependencies, and migrate from old package versions.

angular-bootstrap: Add attribute dropdown directives (C => A).
bootstrap: Add fixed modal backdrop workaround. Use new glyphicons.

omega-web/bower.json

@@ -22,21 +22,21 @@
   ],
   "dependencies": {
     "angular": "~1.2.16",
-    "angular-bootstrap": "~0.11.0",
+    "angular-bootstrap": "~0.12.0",
     "angular-animate": "~1.2.16",
     "angular-ui-router": "~0.2.10",
     "angular-loader": "~1.2.16",
     "angular-i18n": "~1.2.16",
-    "bootstrap": "~3.1.1",
+    "bootstrap": "~3.3.2",
     "script.js": "~2.5.3",
     "ngprogress": "~1.0.4",
-    "angular-ui-sortable": "~0.12.6",
+    "angular-ui-sortable": "~0.13.3",
     "jsondiffpatch": "~0.1.7",
-    "angular-spectrum-colorpicker": "~1.0.13",
+    "angular-spectrum-colorpicker": "~1.3.5",
     "blob": "*",
     "FileSaver": "*",
     "angular-ui-utils": "bower-validate",
-    "angular-ladda": "~0.1.6",
+    "angular-ladda": "~0.2.1",
     "angular-sanitize": "~1.2.26",
     "shepherd.js": "~0.5.1"
   },

omega-web/src/less/options.less

@@ -206,6 +206,19 @@ ul.list-style-none, li.list-style-none {
 
 /* body */
 
+html {
+  height: 100%;
+}
+
+body {
+  min-height: 100%;
+}
+
+.modal-backdrop {
+  position: fixed;
+  bottom: 0;
+}
+
 h1 {
   color: #5c6166;
   font-size: 1.7em;
@@ -353,6 +366,16 @@ main {
   }
 }
 
+@media (min-width: 768px) {
+  // Try to workaround the issue where dropdown menus in the table are clipped.
+  // .table-responsive sets overflow-x, which causes the issue. Just setting
+  // overflow-y: visible will NOT work. Scrolling must be disabled for X & Y.
+  // See: http://stackoverflow.com/a/6433475
+  .table-responsive {
+    overflow: visible;
+  }
+}
+
 .fixed-servers,
 .switch-rules {
   td {

omega-web/src/partials/omega_profile_select.jade

@@ -1,5 +1,5 @@
 .btn-group.omega-profile-select(dropdown on-toggle="toggled(open)")
-  button.btn.btn-default.dropdown-toggle(type='button' aria-expanded='false'
+  button.btn.btn-default.dropdown-toggle(dropdown-toggle type='button' aria-expanded='false'
     role='listbox' aria-haspopup='true')
     span(omega-profile-icon='selectedProfile' options='options' icon='selectedProfile ? undefined : "glyphicon-time"')
     = ' '

omega-web/src/partials/profile_switch.jade

@@ -78,7 +78,7 @@ div(ng-controller='SwitchProfileCtrl')
                 span.glyphicon.glyphicon-trash
               = ' '
               button.btn.btn-default.btn-sm(title="{{'options_cloneRule' | tr}}" ng-click='cloneRule($index)')
-                span.glyphicon.glyphicon-tags
+                span.glyphicon.glyphicon-duplicate
         tbody
           tr
             td(style='border-right: none;')

omega-web/src/popup.jade

@@ -46,7 +46,7 @@ html(lang='en' ng-app='omegaPopup' ng-controller='PopupCtrl' ng-csp)
           span(omega-profile-inline='profile' icon='getIcon(profile)' options='availableProfiles' disp-name='dispNameFilter')
           = ' '
           | [{{profile.defaultProfileName}}]
-          button.dropdown-toggle.btn.btn-default(href='#' role='button' ng-click='$event.stopPropagation()')
+          button.dropdown-toggle.btn.btn-default(role='button' dropdown-toggle href='#' ng-click='$event.stopPropagation()')
             span.glyphicon.glyphicon-chevron-down
         ul.dropdown-menu(ng-if='!!profile.validResultProfiles')
           li(ng-repeat='p in profile.validResultProfiles' ng-class='{active: p.name == profile.defaultProfileName}')
@@ -59,7 +59,7 @@ html(lang='en' ng-app='omegaPopup' ng-controller='PopupCtrl' ng-csp)
           = ' '
           span {{'popup_addCondition' | tr}}
       li(ng-show='!!currentDomain && validResultProfiles.length' dropdown is-open="tempRuleMenu.open")
-        a.dropdown-toggle(href='#' role='button' data-shortcut='tempRule')
+        a.dropdown-toggle(href='#' role='button' dropdown-toggle data-shortcut='tempRule')
           span.glyphicon.glyphicon-filter
           = ' '
           span.current-domain {{currentDomain}}