diff options
Diffstat (limited to 'client/css/post-list-view.styl')
| -rw-r--r-- | client/css/post-list-view.styl | 146 |
1 files changed, 115 insertions, 31 deletions
diff --git a/client/css/post-list-view.styl b/client/css/post-list-view.styl index e4f75d5..60679bf 100644 --- a/client/css/post-list-view.styl +++ b/client/css/post-list-view.styl @@ -3,24 +3,24 @@ .post-list ul list-style-type: none - margin: 0 padding: 0 display: flex align-content: flex-end flex-wrap: wrap - margin: 0 -0.25em + margin: 0 -1.5em + @media (max-width: 1000px) + margin: 0 -1em li position: relative flex-grow: 1 - margin: 0 0.25em 0.5em 0.25em display: inline-block text-align: left - min-width: 10em + min-width: 8em width: 12vw &:not(.flexbox-dummy) - min-height: 7.5em - height: 9vw + min-height: 8em + height: 12vw .thumbnail-wrapper display: inline-block @@ -84,6 +84,31 @@ &[data-disabled] background: rgba(200, 200, 200, 0.7) + .relation-flipper + display: inline-block + padding: 0.5em + box-sizing: border-box + border: 0 + &:after + display: inline-block + width: 1em + height: 1em + text-align: center + line-height: 1em + font-size: 1.6em + &.related + background: rgba(0, 230, 0, 0.7) + &:after + color: white + content: '☑' + &:not(.related) + background: rgba(245, 0, 0, 0.7) + &:after + color: white + content: '☐' + &[data-disabled] + background: rgba(200, 200, 200, 0.7) + .safety-flipper a display: inline-block margin: 0.1em @@ -130,8 +155,9 @@ background: rgba(255, 0, 0, 0.7) &:after color: white - font-family: FontAwesome; + font-family: 'Font Awesome 5 Free'; content: "\f1f8"; // fa-trash + font-weight: 900; // not visible at other weights &:not(.delete) background: rgba(200, 200, 200, 0.7) &:after @@ -200,45 +226,93 @@ width: 100% margin-bottom: 0.5em .append + @media (max-width: 500px) + margin-left: 0.8em vertical-align: middle font-size: 0.95em color: $inactive-link-color - .bulk-edit + .bulk-edit-btn-holder, .metrics-btn-holder &:not(.opened) .close display: none &.opened .open display: none + .metrics-block &.hidden display: none - .bulk-edit-tags - &.opened - .hint - @media (max-width: 1000px) - display: block + label + display: inline !important + margin-left: -0.5em + line-height 1.7em + a.append + line-height 1.7em + padding: 0.2em 0 + form, ul + display: flex + flex-wrap: wrap + .metric-list + li + display: inline-block + line-height: 1.7em + margin-right: 0.5em + @media (max-width: 700px) margin-bottom: 0.5em - &:not(.opened) - [type=text], - .start - display: none - .hint - display: none - input[name=tag] - width: 24em - @media (max-width: 1000px) + border-width: 1px + &.selected + border-style: solid + &.tag-default + background-color: $main-color + &:not(.selected) + border-style: dotted + &.tag-default + border-color: $main-color + li a + vertical-align: middle + padding: 0.2em 0.5em + .bulk-edit-block + &.hidden + display: none + form + &:not(.opened) + display: inline-block + &.opened display: block - width: 100% - margin-bottom: 0.5em - .append - &.open, - &.hint - @media (max-width: 1000px) - margin-left: 0 - .hint + input[type=submit] margin-right: 1em - .bulk-edit-safety .append + margin-left: 0 + margin-right: 1em + .bulk-edit + &:not(.opened) + .close + display: none + &.opened + .open + display: none + &.hidden + display: none + .bulk-edit-tags + &.opened + .hint + @media (max-width: 1000px) + display: block + margin-bottom: 0.5em + &:not(.opened) + [type=text], + .start + display: none + .hint + display: none + input[name=tag] + width: 12em + @media (max-width: 1000px) + display: block + width: 100% + margin-bottom: 0.5em + .hint + margin-right: 1em + @media (max-width: 1000px) margin-left: 0 .bulk-edit-delete @@ -271,3 +345,13 @@ border-color: @background-color &.disabled background-color: alpha(@background-color, 0.15) + + .icon-button + padding: 0.2em + margin-right: 0.25em + margin-bottom: 0.25em + i + vertical-align: middle + .icon-inline + vertical-align: baseline + margin-left: 0.3em |