diff options
| -rw-r--r-- | module/web/static/css/default/settings.less | 6 | ||||
| -rw-r--r-- | module/web/static/css/default/style.less | 92 | ||||
| -rw-r--r-- | module/web/static/img/default/arrow_refresh.png | bin | 685 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/delete.png | bin | 715 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/folder.png | bin | 537 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/icon_blank_file_black.png | bin | 291 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/icon_clock_small_white.png | bin | 1540 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/icon_folder.png | bin | 222 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/icon_speed_small_white.png | bin | 1654 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/icon_user_small_white.png | bin | 1475 -> 0 bytes | |||
| -rw-r--r-- | module/web/static/img/default/logo.png | bin | 8340 -> 10663 bytes | |||
| -rw-r--r-- | module/web/static/img/default/pencil.png | bin | 450 -> 0 bytes | |||
| -rw-r--r-- | module/web/templates/default/base.html | 52 | 
13 files changed, 79 insertions, 71 deletions
diff --git a/module/web/static/css/default/settings.less b/module/web/static/css/default/settings.less index 8b6662343..fde0b9215 100644 --- a/module/web/static/css/default/settings.less +++ b/module/web/static/css/default/settings.less @@ -4,15 +4,15 @@  	Settings
  */
  .settings-menu {
 -  background-color: @lightestyellow;
 +  background-color: @yellowLightest;
  }
  .setting-box {
    margin-top: 20px;
 -  border-color: @lighterblue;
 -  .gradient(top, @lightergrey, @lighteryellow);
 +  border-color: @blueLighter;
 +  .gradient(top, @greyLighter, @yellowLighter);
    box-shadow: 0 0 5px @blue;
    .page-header {
 diff --git a/module/web/static/css/default/style.less b/module/web/static/css/default/style.less index 157b3feb7..d5ac08b85 100644 --- a/module/web/static/css/default/style.less +++ b/module/web/static/css/default/style.less @@ -3,26 +3,26 @@  */
  @min-width: 1000px;
 -@header-height: 70px;
 +@header-height: 62px; // 62:38 = 100 -> Golden ratio
  @footer-height: 100px;
  @margin-side: 100px;
  @dark: #333333;
  @light: #ffffff;
  @grey: #757575;
 -@lightgrey: #E5E5E5;
 -@lightergrey: #F5F5F5;
 +@greyLight: #E5E5E5;
 +@greyLighter: #F5F5F5;
  @yellow: #fee247;
 -@lighteryellow: lighten(spin(@yellow, 10), 20%);
 -@lightestyellow: lighten(spin(@yellow, 15), 30%);
 +@yellowLighter: lighten(spin(@yellow, 10), 20%);
 +@yellowLightest: lighten(spin(@yellow, 15), 30%);
  @blue: #3a79aa;
 -@lightblue: lighten(spin(@blue, 5), 10%);
 -@lighterblue: lighten(spin(@blue, 10), 20%);
 -@lightestblue: lighten(spin(@blue, 20), 40%);
 -@darkblue: darken(spin(@blue, -5), 10%);
 -@darkerblue: darken(spin(@blue, -10), 20%);
 +@blueLight: lighten(spin(@blue, 5), 10%);
 +@blueLighter: lighten(spin(@blue, 10), 20%);
 +@blueLightest: lighten(spin(@blue, 20), 40%);
 +@blueDark: darken(spin(@blue, -5), 10%);
 +@blueDarker: darken(spin(@blue, -10), 20%);
  @emph: #FF7637;
 @@ -164,59 +164,58 @@ header:before {    z-index: -1;
  }
 -header div.center {
 +header div.left {
    position: relative;
    padding-left: 20px;
 +  width: 32%;
 +  height: @header-height;
 +  float: left;
 +//  border-right: 1px solid;
 +}
 +
 +header div.right {
    padding-right: 20px;
  }
 -header div.center span.title {
 +header span.title {
    color: white;
    float: left;
    font-family: SansationRegular, sans-serif;
    font-size: 40px;
 +  line-height: @header-height;
    cursor: default;
 -  margin-top: 24px;
  }
  header .logo {
    float: left;
    margin-right: 10px;
 -  margin-top: 6px;
 -  width: 120px;
 -  height: 120px;
 +  margin-top: 4px;
 +  width: 105px;
 +  height: 105px;
    background: url("../../img/default/logo.png") no-repeat;
  }
  .header_block {
    float: right;
 -  margin: 12px 12px 0;
    font-family: SansationRegular, sans-serif;
 -}
 +  margin: 5px 8px 0;
 +  line-height: 17px;
 +  font-size: small;
 -.header_icon {
 -  padding-top: 2px;
 -  padding-bottom: 5px;
 -  padding-left: 25px;
 -  height: 20px;
 -}
 +  i {
 +    margin-top: 0;
 +    vertical-align: text-bottom;
 +  }
 -.header_text {
 -  text-align: center;
 -}
 -
 -.icon_info img {
 -  margin-bottom: -4px;
 -  padding-right: 5px;
  }
  #notification_div {
    position: absolute;
    left: 50%;
 -  width: 28%;
 +  width: 26%;
    height: 45px;
 -  margin-left: -14%;
 -  margin-top: 12px;
 +  margin-left: -13%;
 +  margin-top: 8px;
    text-align: center;
  }
 @@ -233,22 +232,9 @@ header .logo {    float: right;
    height: 45px;
    width: 14%;
 -  margin-top: 12px;
 +  margin-top: 8px;
    font-family: sans-serif
  }
 -
 -#header_user {
 -  background: url("../../img/default/icon_user_small_white.png") no-repeat;
 -}
 -
 -#header_speed {
 -  background: url("../../img/default/icon_speed_small_white.png") no-repeat;
 -}
 -
 -#header_qeuue {
 -  background: url("../../img/default/icon_clock_small_white.png") no-repeat;
 -}
 -
  /*
      Login
  */
 @@ -409,14 +395,14 @@ footer h2 {  .package-view > div {
    color: @light;
 -  .gradient(top, @blue, @lightblue); //  background-color: @blue;
 +  .gradient(top, @blue, @blueLight); //  background-color: @blue;
    font-weight: bold;
    border-radius: 5px;
    line-height: 28px;
  }
  .package-view > div:hover {
 -  .gradient(top, @blue, @darkblue);
 +  .gradient(top, @blue, @blueDark);
  }
  .package-row {
 @@ -431,7 +417,7 @@ footer h2 {  .package-row.second {
    width: 30%;
 -  .gradient(top, @darkblue, @darkerblue);
 +  .gradient(top, @blueDark, @blueDarker);
  }
 @@ -459,12 +445,12 @@ footer h2 {  .file-view > div {
    border-radius: 5px;
 -  .gradient(top,  @lighterblue, @lightestblue);
 +  .gradient(top,  @blueLighter, @blueLightest);
    line-height: 26px;
  }
  .file-view > div:hover {
 -  .gradient(top, @blue, @lightblue)
 +  .gradient(top, @blue, @blueLight)
  }
  .file-row {
 diff --git a/module/web/static/img/default/arrow_refresh.png b/module/web/static/img/default/arrow_refresh.png Binary files differdeleted file mode 100644 index 0de26566d..000000000 --- a/module/web/static/img/default/arrow_refresh.png +++ /dev/null diff --git a/module/web/static/img/default/delete.png b/module/web/static/img/default/delete.png Binary files differdeleted file mode 100644 index 08f249365..000000000 --- a/module/web/static/img/default/delete.png +++ /dev/null diff --git a/module/web/static/img/default/folder.png b/module/web/static/img/default/folder.png Binary files differdeleted file mode 100644 index 784e8fa48..000000000 --- a/module/web/static/img/default/folder.png +++ /dev/null diff --git a/module/web/static/img/default/icon_blank_file_black.png b/module/web/static/img/default/icon_blank_file_black.png Binary files differdeleted file mode 100644 index d054a2af7..000000000 --- a/module/web/static/img/default/icon_blank_file_black.png +++ /dev/null diff --git a/module/web/static/img/default/icon_clock_small_white.png b/module/web/static/img/default/icon_clock_small_white.png Binary files differdeleted file mode 100644 index 9e6c9bdd0..000000000 --- a/module/web/static/img/default/icon_clock_small_white.png +++ /dev/null diff --git a/module/web/static/img/default/icon_folder.png b/module/web/static/img/default/icon_folder.png Binary files differdeleted file mode 100644 index 31773520a..000000000 --- a/module/web/static/img/default/icon_folder.png +++ /dev/null diff --git a/module/web/static/img/default/icon_speed_small_white.png b/module/web/static/img/default/icon_speed_small_white.png Binary files differdeleted file mode 100644 index ac86514ca..000000000 --- a/module/web/static/img/default/icon_speed_small_white.png +++ /dev/null diff --git a/module/web/static/img/default/icon_user_small_white.png b/module/web/static/img/default/icon_user_small_white.png Binary files differdeleted file mode 100644 index 6434734fa..000000000 --- a/module/web/static/img/default/icon_user_small_white.png +++ /dev/null diff --git a/module/web/static/img/default/logo.png b/module/web/static/img/default/logo.png Binary files differindex 7cb924d60..a2edc14b0 100644 --- a/module/web/static/img/default/logo.png +++ b/module/web/static/img/default/logo.png diff --git a/module/web/static/img/default/pencil.png b/module/web/static/img/default/pencil.png Binary files differdeleted file mode 100644 index 0bfecd50e..000000000 --- a/module/web/static/img/default/pencil.png +++ /dev/null diff --git a/module/web/templates/default/base.html b/module/web/templates/default/base.html index bda72a00c..d54075110 100644 --- a/module/web/templates/default/base.html +++ b/module/web/templates/default/base.html @@ -30,35 +30,57 @@  </head>
  <body>
  <div id="wrap">
 -    <header>
 -        <div class="center">
 +    <header style="width: 100%;">
 +        <div class="left">
              <div class="logo"></div>
              <span class="title">pyLoad</span>
 -
 +        </div>
 +        <div class="right">
              {% if user %}
 +{#                <div class="btn-group btn-group-vertical">#}
 +{#                    <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}
 +{#                    <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}
 +{#                </div>#}
                  <div id="notification_div">
 +                    <span class="label label-info" style="position: absolute; left: 0;">O Msg.</span>
 +                    <span class="label label-success" style="position: absolute; right: 0;">Started</span>
                      No runnings tasks
                      <div class="progress progress-warning progress-striped" id="globalprogress">
                          <div class="bar" style="width: 60%"></div>
                      </div>
                  </div>
 -                <div class="header_block">
 -                    <div class="header_icon" id="header_user">
 -                        <span>{{ user.name }}</span>
 -                    </div>
 -                    <div class="header_text">
 -                        <a href="/logout" id="header_logout">{{ _("Logout") }}</a>
 +                <div class="header_block" style="margin-top: 16px;">
 +                    <div class="btn-group">
 +                        <a class="btn btn-primary btn-small" href="#"><i class="icon-user icon-white"></i> User</a>
 +                        <a class="btn btn-primary btn-small dropdown-toggle" data-toggle="dropdown" href="#"><span
 +                                class="caret"></span></a>
 +                        <ul class="dropdown-menu">
 +                            <li><a href="#"><i class="icon-pencil"></i> Edit</a></li>
 +                            <li><a href="#"><i class="icon-trash"></i> Delete</a></li>
 +                            <li><a href="#"><i class="icon-ban-circle"></i> Ban</a></li>
 +                            <li class="divider"></li>
 +                            <li><a href="#"><i class="i"></i> Make admin</a></li>
 +                        </ul>
                      </div>
 +{#                    <div class="btn-toolbar">#}
 +{#                        <div class="btn-group">#}
 +{#                            <a class="btn btn-mini" href="#"><i class="icon-align-left"></i></a>#}
 +{#                            <a class="btn btn-mini" href="#"><i class="icon-align-center"></i></a>#}
 +{#                            <a class="btn btn-mini" href="#"><i class="icon-align-right"></i></a>#}
 +{#                        </div>#}
 +{#                    </div>#}
                  </div>
                  <div id="speedgraph"></div>
                  <div class="header_block">
 -                    <div class="header_icon" id="header_speed">
 -                        <span class="header_text">500 kb/s</span>
 -                    </div>
 -                    <div class="header_icon" id="header_qeuue">
 -                        <span class="header_text">5 / 125</span>
 -                    </div>
 +                    <span class="pull-right">500 kb/s</span><br>
 +                    <span class="pull-right">1h 5m</span><br>
 +                    <span class="pull-right">5 / 125</span><br>
 +                </div>
 +                <div class="header_block">
 +                    <i class="icon-download icon-white"></i> Speed:<br>
 +                    <i class="icon-time icon-white"></i> Remaining:<br>
 +                    <i class="icon-hdd icon-white"></i> Queue:<br>
                  </div>
              {% endif %}
          </div>
  | 
