diff options
| -rw-r--r-- | client/components/boards/boardList.styl | 38 | ||||
| -rw-r--r-- | client/components/main/editor.jade | 9 | ||||
| -rw-r--r-- | client/components/main/layouts.styl (renamed from client/styles/main.styl) | 150 | ||||
| -rw-r--r-- | client/styles/cheat.styl | 79 | ||||
| -rw-r--r-- | client/styles/icons.styl | 30 |
5 files changed, 157 insertions, 149 deletions
diff --git a/client/components/boards/boardList.styl b/client/components/boards/boardList.styl index 61095d5b..c4fa41be 100644 --- a/client/components/boards/boardList.styl +++ b/client/components/boards/boardList.styl @@ -72,3 +72,41 @@ color: #ffd91a font-size: 16px opacity: 1 + + +.board-backgrounds-list + + .board-background-select + box-sizing: border-box + display: block + float: left + width: 50% + padding-top: 12px + position: relative + z-index: 1 + + &:nth-child(-n + 2) + padding-top: 0 + + &:nth-child(2n) + padding-left: 6px + + &:nth-child(2n+1) + padding-right: 6px + + .background-box + border-radius: 3px + background-size: cover + display: block + height: 74px + position: relative + width: 100% + cursor: pointer + display: flex + align-items: center + justify-content: center + + i.fa-check + font-size: 25px + color: white + diff --git a/client/components/main/editor.jade b/client/components/main/editor.jade index c910b052..f10d64a1 100644 --- a/client/components/main/editor.jade +++ b/client/components/main/editor.jade @@ -7,7 +7,8 @@ template(name="editor") +Template.contentBlock template(name="viewer") - +mentions - +emoji - +markdown - {{> UI.contentBlock }} + .viewer + +mentions + +emoji + +markdown + {{> UI.contentBlock }} diff --git a/client/styles/main.styl b/client/components/main/layouts.styl index c5d169d3..105709cf 100644 --- a/client/styles/main.styl +++ b/client/components/main/layouts.styl @@ -140,45 +140,118 @@ dl, dt dd margin: 0 0 16px 24px +.clear + clear: both + +.clearfix + clearfix() + +.hide + display: none + +.show + display: block + +.bold + font-weight: 700 + +.center + text-align: center + +.left + float: left + +.right + float: right + +.first + margin-left: 0 + padding-left: 0 + +.last + margin-right: 0 + padding-right: 0 + +.top + margin-top: 0 + padding-top: 0 + +.bottom + margin-bottom: 0 + padding-bottom: 0 + +.relative + position: relative + +.block + display: block + +.inline + display: inline + +.inline-block + display: inline-block + +.pointer + cursor: pointer + +.ellip + overflow: hidden + text-overflow: ellipsis + white-space: nowrap + +.underline + text-decoration: underline + +.lowercase + text-transform: lowercase + +.invisible + visibility: hidden + +.wrapword + word-wrap: break-word + +.grab + cursor: grab + +.grabbing + cursor: grabbing + +.emoji + height: 18px + width: 18px + vertical-align: text-bottom + +// Implement a thiner close icon as suggested in +// https://github.com/FortAwesome/Font-Awesome/issues/1540#issuecomment-68689950 +.fa.fa-times-thin:before + content: '\00d7'; + +.fa.fa-globe.colorful + color: #4caf50 + +.fa.fa-lock.colorful + color: #f44336 + +.pop-over .pop-over-list li a:hover + .fa, .fa.colorful + color: white + + &:hover + color: white + +a + &.fa, i.fa + color: darken(white, 35%) + + &:hover, &.is-active + &.fa, i.fa + color: darken(white, 60%) + .ui-draggable-dragging z-index: 200 -.board-backgrounds-list - - .board-background-select - box-sizing: border-box - display: block - float: left - width: 50% - padding-top: 12px - position: relative - z-index: 1 - - &:nth-child(-n + 2) - padding-top: 0 - - &:nth-child(2n) - padding-left: 6px - - &:nth-child(2n+1) - padding-right: 6px - - .background-box - border-radius: 3px - background-size: cover - display: block - height: 74px - position: relative - width: 100% - cursor: pointer - display: flex - align-items: center - justify-content: center - - i.fa-check - font-size: 25px - color: white - .atMention background: #dbdbdb border-radius: 3px @@ -206,6 +279,11 @@ dd .gutter margin-left: 38px +.viewer + ul + list-style-type: initial + padding-left: 20px + @keyframes fadeIn from opacity: 0 diff --git a/client/styles/cheat.styl b/client/styles/cheat.styl deleted file mode 100644 index 9d881b44..00000000 --- a/client/styles/cheat.styl +++ /dev/null @@ -1,79 +0,0 @@ -@import 'nib' - -.clear - clear: both - -.clearfix - clearfix() - -.hide - display: none - -.show - display: block - -.bold - font-weight: 700 - -.center - text-align: center - -.left - float: left - -.right - float: right - -.first - margin-left: 0 - padding-left: 0 - -.last - margin-right: 0 - padding-right: 0 - -.top - margin-top: 0 - padding-top: 0 - -.bottom - margin-bottom: 0 - padding-bottom: 0 - -.relative - position: relative - -.block - display: block - -.inline - display: inline - -.inline-block - display: inline-block - -.pointer - cursor: pointer - -.ellip - overflow: hidden - text-overflow: ellipsis - white-space: nowrap - -.underline - text-decoration: underline - -.lowercase - text-transform: lowercase - -.invisible - visibility: hidden - -.wrapword - word-wrap: break-word - -.grab - cursor: grab - -.grabbing - cursor: grabbing diff --git a/client/styles/icons.styl b/client/styles/icons.styl deleted file mode 100644 index a8e21bb7..00000000 --- a/client/styles/icons.styl +++ /dev/null @@ -1,30 +0,0 @@ -.emoji - height: 18px - width: 18px - vertical-align: text-bottom - -// Implement a thiner close icon as suggested in -// https://github.com/FortAwesome/Font-Awesome/issues/1540#issuecomment-68689950 -.fa.fa-times-thin:before - content: '\00d7'; - -.fa.fa-globe.colorful - color: #4caf50 - -.fa.fa-lock.colorful - color: #f44336 - -.pop-over .pop-over-list li a:hover - .fa, .fa.colorful - color: white - - &:hover - color: white - -a - &.fa, i.fa - color: darken(white, 35%) - - &:hover, &.is-active - &.fa, i.fa - color: darken(white, 60%) |