diff --git a/plinth/templates/clients.html b/plinth/templates/clients.html index 83be701ee..069cfc951 100644 --- a/plinth/templates/clients.html +++ b/plinth/templates/clients.html @@ -22,187 +22,187 @@ {% load static %} {% if clients %} -

- -

+

+ +

- +
- {% if clients|has_web_clients %} - {% with clients|of_type:'web' as web_clients %} - - - {% with web_clients|first as client %} - {% for platform in client.platforms %} - {% if platform.type == 'web' %} - - - {% endif %} - {% endfor %} - {% endwith %} - - {% for client in web_clients|slice:"1:" %} - {% for platform in client.platforms %} - {% if platform.type == 'web' %} - - - - - {% endif %} - {% endfor %} + {% if clients|has_web_clients %} + {% with clients|of_type:'web' as web_clients %} + + + {% with web_clients|first as client %} + {% for platform in client.platforms %} + {% if platform.type == 'web' %} + + + {% endif %} + {% endfor %} + {% endwith %} + + {% for client in web_clients|slice:"1:" %} + {% for platform in client.platforms %} + {% if platform.type == 'web' %} + + + + + {% endif %} + {% endfor %} + {% endfor %} + {% endwith %} + {% endif %} + + {% if clients|has_desktop_clients %} + {% with clients|of_type:'desktop' as desktop_clients %} + + + {% with desktop_clients|first as client %} + + - - {% with desktop_clients|first as client %} - - - {% endwith %} - - {% for client in desktop_clients|slice:"1:" %} - - - - + + + {% endwith %} + + {% for client in desktop_clients|slice:"1:" %} + + + + + {% endfor %} + {% endwith %} + {% endif %} - {% if clients|has_mobile_clients %} - {% with clients|of_type:'mobile' as mobile_clients %} - - - {% with mobile_clients|first as client %} - - - {% endwith %} - - {% for client in mobile_clients|slice:"1:" %} - - - - + {% if clients|has_mobile_clients %} + {% with clients|of_type:'mobile' as mobile_clients %} + + + {% with mobile_clients|first as client %} + + - - {% with package_clients|first as client %} - - - {% endwith %} - - {% for client in package_clients|slice:"1:" %} - - - - + + + {% endwith %} + + {% for client in mobile_clients|slice:"1:" %} + + + + + {% endfor %} + {% endwith %} + {% endif %} -
Web {{ client.name }} - - - -
{{ client.name }} - - - -
Web {{ client.name }} + + + +
{{ client.name }} + + + +
Desktop {{ client.name }} +
+ {% for platform in client.platforms %} + {% if platform.type == 'download' %} +
+ + {% with 'theme/icons/'|add:platform.os|add:'.png' as icon %} + + {% endwith %} + +
+ {% endif %} {% endfor %} - {% endwith %} - {% endif %} - - {% if clients|has_desktop_clients %} - {% with clients|of_type:'desktop' as desktop_clients %} -
Desktop {{ client.name }} -
- {% for platform in client.platforms %} - {% if platform.type == 'download' %} -
- - {% with 'theme/icons/'|add:platform.os|add:'.png' as icon %} - - {% endwith %} - -
- {% endif %} - {% endfor %} -
-
{{ client.name }} -
- {% for platform in client.platforms %} - {% if platform.type == 'download' %} -
- - {% with 'theme/icons/'|add:platform.os|add:'.png' as icon %} - - {% endwith %} - -
- {% endif %} - {% endfor %} -
-
{{ client.name }} +
+ {% for platform in client.platforms %} + {% if platform.type == 'download' %} +
+ + {% with 'theme/icons/'|add:platform.os|add:'.png' as icon %} + + {% endwith %} + +
+ {% endif %} {% endfor %} - {% endwith %} - {% endif %} +
+
Mobile {{ client.name }} -
- {% for platform in client.platforms %} - {% if platform.type == 'store' and platform.os == 'android' or platform.os == 'ios' %} -
- - {% with 'theme/icons/'|add:platform.store_name|add:'.png' as icon %} - - {% endwith %} - -
- {% endif %} - {% endfor %} -
-
{{ client.name }} -
- {% for platform in client.platforms %} - {% if platform.type == 'store' and platform.os == 'android' or platform.os == 'ios' %} -
- - {% with 'theme/icons/'|add:platform.store_name|add:'.png' as icon %} - - {% endwith %} - -
- {% endif %} - {% endfor %} -
-
Mobile {{ client.name }} +
+ {% for platform in client.platforms %} + {% if platform.type == 'store' and platform.os == 'android' or platform.os == 'ios' %} +
+ + {% with 'theme/icons/'|add:platform.store_name|add:'.png' as icon %} + + {% endwith %} + +
+ {% endif %} {% endfor %} - {% endwith %} - {% endif %} - - {% if clients|has_package_clients %} - {% with clients|of_type:'package' as package_clients %} -
Package {{ client.name }} -
-
    - {% for platform in client.platforms %} - {% if platform.type == 'package' and platform.format == 'deb' %} -
  • Debian: {{ platform.name }}
    • - {% endif %} - {% if platform.type == 'package' and platform.format == 'brew' %} -
  • HomeBrew: {{ platform.name }}
    • - {% endif %} - {% endfor %} -
-
-
{{ client.name }} -
-
    - {% for platform in client.platforms %} - {% if platform.type == 'package' %} - {% if platform.type == 'package' and platform.format == 'deb' %} -
  • Debian: {{ platform.name }}
    • - {% endif %} - {% if platform.type == 'package' and platform.format == 'homebrew' %} -
  • HomeBrew: {{ platform.name }}
    • - {% endif %} - {% endif %} - {% endfor %} -
-
-
{{ client.name }} +
+ {% for platform in client.platforms %} + {% if platform.type == 'store' and platform.os == 'android' or platform.os == 'ios' %} +
+ + {% with 'theme/icons/'|add:platform.store_name|add:'.png' as icon %} + + {% endwith %} + +
+ {% endif %} {% endfor %} - {% endwith %} - {% endif %} +
+
+ {% if clients|has_package_clients %} + {% with clients|of_type:'package' as package_clients %} + + Package + {% with package_clients|first as client %} + {{ client.name }} + +
+ +
+ + {% endwith %} + + {% for client in package_clients|slice:"1:" %} + + {{ client.name }} + +
+ +
+ + + {% endfor %} + {% endwith %} + {% endif %} + + {% endif %} diff --git a/static/themes/default/css/plinth.css b/static/themes/default/css/plinth.css index 41a46c29a..37ce770c4 100644 --- a/static/themes/default/css/plinth.css +++ b/static/themes/default/css/plinth.css @@ -43,8 +43,10 @@ body { } .running-status.loading { - border: 4px solid #f3f3f3; /* Light grey */ - border-top: 4px solid #3498db; /* Blue */ + border: 4px solid #f3f3f3; + /* Light grey */ + border-top: 4px solid #3498db; + /* Blue */ border-radius: 50%; width: 16px; height: 16px; @@ -53,8 +55,12 @@ body { } @keyframes spin { - 0% { transform: rotate(0deg); } - 100% { transform: rotate(360deg); } + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } } .form-diagnostics-button { @@ -62,11 +68,13 @@ body { } /* Hide log out button if user dropdown is available */ + .js #logout-nojs { display: none; } /* Hide the dropdown icon when javascript is not available */ + .no-js .nav .dropdown .caret { display: none; } @@ -77,6 +85,7 @@ body { /* Sticky footer styles -------------------------------------------------- */ + footer .license-info { opacity: 0.75; } @@ -86,37 +95,38 @@ footer .license-info { } html { - position: relative; + position: relative; } -body, html { - height: 100%; +body, +html { + height: 100%; } -#wrapper{ +#wrapper { min-height: 100%; position: relative; } -#container-wrapper{ +#container-wrapper { /*covers for footer height */ padding-bottom: 150px; } footer { - text-align: center; - position: absolute; - bottom: 0; - width: 100%; - height: 150px; + text-align: center; + position: absolute; + bottom: 0; + width: 100%; + height: 150px; } -footer license-info p{ +footer license-info p { margin: 20px 0; } .clients-info { - padding-top: 15px; + padding-top: 15px; } .heading { @@ -150,7 +160,7 @@ footer license-info p{ } .shortcut-label { - min-height:50px; + min-height: 50px; } @@ -166,3 +176,18 @@ footer license-info p{ content: "\e080"; } +/* No-JS fallbacks for collapsible content in clients.html */ +.no-js .collapse { + display: block; +} + +.no-js #collapsible-button:after { + font-family: "Glyphicons Halflings"; + content: "\e114"; + margin-left: 5px; +} + +.no-js #collapsible-button.collapsed:after { + content: "\e114"; +} +