This is an automated email from the git hooks/post-receive script. New commit to branch refonteUI-2017 in repository bow. See https://gitlab.nuiton.org/chorem/bow.git commit b77669f604dcea40d1f489fa26efdd6d61a6a3b2 Author: kaufmann <kaufmann@codelutin.com> Date: Tue Dec 19 17:43:03 2017 +0100 Refonte de l'UI: Modification de l'affichage des bookmarks --- bow-ui/src/main/less/common/_bookmark-list.less | 82 +++++++----------------- bow-ui/src/main/less/common/_bookmark.less | 85 +++++++++++++++---------- 2 files changed, 74 insertions(+), 93 deletions(-) diff --git a/bow-ui/src/main/less/common/_bookmark-list.less b/bow-ui/src/main/less/common/_bookmark-list.less index c2c9d7a..af64c63 100644 --- a/bow-ui/src/main/less/common/_bookmark-list.less +++ b/bow-ui/src/main/less/common/_bookmark-list.less @@ -1,89 +1,51 @@ -@default-screenshot-width: 100px; - @list-line-min-height: 75px; .bookmarks-list { .bookmark { - width:100%; - height:auto; - min-height: @list-line-min-height; - clear: both; - background-color: #f3f6f9; - margin-bottom: @default-marge--small; - margin-top: @default-marge--small; - position: relative; - } + display: flex; + flex-direction: row; + background-color: #FFF; - .bookmark-favicon { - width: 16px; - height: 16px; - float:left; - margin-right: @default-marge--small; + &:nth-child(2n+1) { + background-color: #FAFAFA; + } } - - .bookmark-link { - color: @color-link; + + .bookmark-favicon { } .bookmark-description { - margin:5px 5px; - color:#999999; - font-size:12px; - position: relative; - width: 100%; } - .bookmark-screenshot{ - float: left; - width: @default-screenshot-width; - height: @list-line-min-height; + .bookmark-title { + color: #555; } .bookmark-content { - margin-left: @default-screenshot-width + 15px; - - padding-top: @default-marge--small; - padding-right: 100px; - } - .bookmark-infos { - float: right; - width: 100px; - text-align: right; + color: #333; + padding: @default-marge--small @default-marge--small @default-marge--small @default-marge--medium; + flex: 1; } .bookmark-nb-click { } .bookmark-tags{ - color:#88516c; - font-size:12px; - height:auto; - width:100%; - line-height:28px; - padding-top:10px; - - & > a { - margin: 5px; - border: 1px solid #eee; - } } - + .bookmark-actions { - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - overflow: hidden; - width: 0; - height: 0; - background: rgba(0,0,0,0.2); - transition: all 1s 0s ease; + opacity: 0.4; + a { + float: left; + margin: @default-marge--small / 2 @default-marge--medium / 2; + } } .bookmark:hover { + box-shadow: 0px 1px 2px fade(@color-bookmark-shadow, 30%); .bookmark-actions { - //width: 100%; - //height: 100%; + opacity: 1; } } + } \ No newline at end of file diff --git a/bow-ui/src/main/less/common/_bookmark.less b/bow-ui/src/main/less/common/_bookmark.less index d9ccd10..6be27bb 100644 --- a/bow-ui/src/main/less/common/_bookmark.less +++ b/bow-ui/src/main/less/common/_bookmark.less @@ -1,23 +1,19 @@ #bookmarks-tags { padding-left: @default-marge--large; padding-right: @default-marge--large; + margin-bottom: @default-marge--small; - background: #E9F2F5; - position: relative; + border-bottom: 1px solid @color-separation-border; - .actions { - background: #F3F6F9; - width: 100px; - height: 100%; - position: absolute; - right: 0; - z-index: 99; - padding: 0 2em; - margin-right: 5%; - } + min-height: @default-sidebar-width; + + text-align: center; - .tag { - color: #7DBED2; + background: @color-tag-cloud-background; + color: #FFF; + + a { + color: inherit; } } @@ -31,15 +27,16 @@ color: @color-main; position: relative; text-align: center; + font-size: 130%; } -#bookmarks-display-mode { +#bookmarks-display-settings-mode { position: absolute; bottom: 0; left: @default-marge--small; } -#bookmarks-display-sort { +#bookmarks-display-settings-sort { position: absolute; bottom: 0; right: @default-marge--small; @@ -50,29 +47,51 @@ padding-right: @default-marge--large; } +.bookmark { + margin-bottom: @default-marge--small; + height: auto; + background-color: @color-bookmark-background; + padding: 0; + box-shadow: 0 0 2px 1px fade(@color-bookmark-shadow,2%); + border-radius: @default-bookmark-radius; +} +.bookmark-title { + color: @color-bookmark-title; + font-weight: bold; + font-size: 120%; +} -#bookmarks-tags { - margin-bottom: @default-marge--small; +.bookmark-link { + color: inherit; +} - border-bottom: 1px solid @color-separation-border; +.bookmark-favicon { + width: 16px; + height: 16px; + margin-right: @default-marge--small; +} +.bookmark-content { + color: @color-bookmark-text; +} - .cloud { - padding-bottom: @default-marge--small; - padding-top: @default-marge--small; - margin-right: 250px; - } - - #bookmarks-tags-edition { - padding-top: @default-marge--small; - background-color: rgba(255,255,255,0.3); - position: absolute; - width: 250px; - right: 0; - height: 100%; - } +.bookmark-metadata { + font-weight: lighter; + font-size: 90%; } +.bookmark-description { + padding: @default-marge--small 0; +} + +.bookmark-tags .tag { + border-bottom: 1px solid darken(@color-bookmark-text, 20%); + color: inherit; + padding: @default-marge--small / 3 @default-marge--small / 4; + background: rgba(255,255,255,0.1); +} + + .pagination { text-align: center; } -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.