diff options
author | Raimund Schlüßler <raimund.schluessler@googlemail.com> | 2016-08-31 00:42:19 +0300 |
---|---|---|
committer | Raimund Schlüßler <raimund.schluessler@googlemail.com> | 2016-09-03 00:07:30 +0300 |
commit | df50d3a8eb4a0b01039f9eac16a3cd410b760d38 (patch) | |
tree | f36a66dc3fdefe303f0ea4e618c6f89af96a46e2 /css | |
parent | 35574fb9e5d64c1c755d9b0735c35180df262023 (diff) |
Implement custom sorting
Diffstat (limited to 'css')
-rw-r--r-- | css/style.css | 70 |
1 files changed, 63 insertions, 7 deletions
diff --git a/css/style.css b/css/style.css index 1e87806b..6a62458b 100644 --- a/css/style.css +++ b/css/style.css @@ -44,15 +44,20 @@ #app-navigation .app-navigation-entry-utils li { font-size: 100%; } -#app-navigation .app-navigation-entry-menu li { +#app-navigation .app-navigation-entry-menu li, +.sortorder-dropdown li { float: inherit; width: auto !important; opacity: 0.5; cursor: pointer; height: 38px; } +.sortorder-dropdown li.active { + opacity: 1; +} #app-navigation .app-navigation-entry-menu li>a, -#app-navigation .app-navigation-entry-menu li>span { +#app-navigation .app-navigation-entry-menu li>span, +.sortorder-dropdown li>span { width: 100%; padding: 10px; display: inline-block; @@ -63,13 +68,17 @@ } #app-navigation .app-navigation-entry-menu li img, -#app-navigation .app-navigation-entry-menu li span{ +#app-navigation .app-navigation-entry-menu li span, +.sortorder-dropdown li img, +.sortorder-dropdown li span { cursor: pointer; } -#app-navigation .app-navigation-entry-menu li:hover { +#app-navigation .app-navigation-entry-menu li:hover, +.sortorder-dropdown li:hover { opacity: 1 !important; } -#app-navigation .app-navigation-entry-menu li img{ +#app-navigation .app-navigation-entry-menu li img, +.sortorder-dropdown li img { margin-right: 5px; vertical-align: text-bottom; } @@ -503,6 +512,7 @@ } #app-content div.content-wrapper .task-list { height: 100%; + width: 100%; overflow-y: auto; } #app-content.details-visible { @@ -532,6 +542,9 @@ position: relative; border: 1px solid #CCCCCC; background: none repeat scroll 0 0 #EEEEEE; + width: calc(100% - 46px); + float: left; + height: 34px; } #app-content #add-task.focus { background-color: #FFFFFF; @@ -555,6 +568,43 @@ cursor: text; outline: none; } +#app-content .sortorder-dropdown-button { + background-color: rgba(240, 240, 240, .9); + border: 1px solid #CCCCCC; + width: 34px; + height: 34px; + margin: 12px 0px 12px 12px; + float: right; + cursor: pointer; +} +.sortorder-dropdown { + display: none; + top: 68px; + right: 3px; +} +.sortorder-dropdown.open { + display: block; +} +.sortorder-dropdown .icon { + margin-top: -2px; + margin-right: 3px; +} +.sort-indicator { + width: 10px; + height: 8px; + margin-left: 5px; + display: inline-block; + vertical-align: text-bottom; + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; + filter: alpha(opacity=80); + opacity: 0.8; + float: right; + margin-top: 2px; + visibility: hidden; +} +.active .sort-indicator { + visibility: visible; +} #app-content div.task-list .loadmore { font-size: 11px; margin-top: 10px; @@ -934,10 +984,16 @@ left: auto; right: 40px; } -#app-sidebar div.content-wrapper .body .section .icon.detail-date, -#app-sidebar div.content-wrapper .body .section .icon.detail-start { +.icon.detail-start, +.icon.detail-date { background-position: -220px -80px; } +.icon.sort-manual { + background-position: -20px -140px; +} +.icon.sort-alphabetically { + background-position: -20px -160px; +} #app-sidebar div.content-wrapper .body .section .icon.detail-remindertype { display: none; left: 38px; |