diff options
Diffstat (limited to 'assets/sass')
27 files changed, 333 insertions, 81 deletions
diff --git a/assets/sass/_alert.sass b/assets/sass/_alert.sass index 5a90c825..6de1c2f6 100644 --- a/assets/sass/_alert.sass +++ b/assets/sass/_alert.sass @@ -48,3 +48,11 @@ border-width: 1px 0 0 border-radius: 4px 4px 0 0 z-index: 9999 + opacity: 1 + animation: fadeout 5s linear forwards + +@keyframes fadeout + 0% + opacity: 1 + 100% + opacity: 0 diff --git a/assets/sass/_base.sass b/assets/sass/_base.sass index 064f5149..566e8a94 100644 --- a/assets/sass/_base.sass +++ b/assets/sass/_base.sass @@ -1,3 +1,9 @@ +.margin-top + margin-top: 20px + +.margin-bottom + margin-bottom: 20px + .pull-right text-align: right @@ -5,9 +11,6 @@ ul.no-bullet li list-style-type: none margin-left: 0 -.chosen-select - min-height: 27px - #app-loading-icon position: fixed right: 3px diff --git a/assets/sass/_board.sass b/assets/sass/_board.sass index c94879bc..d7d10d2e 100644 --- a/assets/sass/_board.sass +++ b/assets/sass/_board.sass @@ -65,11 +65,10 @@ td.board-column-task-collapsed .board-add-icon float: left padding: 0 5px - a + i text-decoration: none color: link-color('primary') - font-size: size('xlarge') - line-height: 70% + font-size: size('large') &:focus, &:hover text-decoration: none color: red diff --git a/assets/sass/_comment.sass b/assets/sass/_comment.sass index fdc38eaf..c65ebc25 100644 --- a/assets/sass/_comment.sass +++ b/assets/sass/_comment.sass @@ -15,6 +15,14 @@ &:hover background: #fafafa +.comment-highlighted + background-color: #FFF8DC + border: 2px solid #FFF8DC + border-left: 2px solid #ffeb8e + &:hover + background-color: #FFF8DC + border: 2px solid #ffeb8e + .comment-title border-bottom: 1px dotted #eee margin-left: 55px diff --git a/assets/sass/_dialog_box.sass b/assets/sass/_dialog_box.sass deleted file mode 100644 index 38364230..00000000 --- a/assets/sass/_dialog_box.sass +++ /dev/null @@ -1,4 +0,0 @@ -@import variables - -#main .confirm - max-width: 700px diff --git a/assets/sass/_dropdown.sass b/assets/sass/_dropdown.sass index 8e7eb24b..6141a0ff 100644 --- a/assets/sass/_dropdown.sass +++ b/assets/sass/_dropdown.sass @@ -1,5 +1,10 @@ @import variables +h2 + .dropdown + ul + display: none + .dropdown display: inline position: relative diff --git a/assets/sass/_file_upload.sass b/assets/sass/_file_upload.sass index b258620e..bdd31a62 100644 --- a/assets/sass/_file_upload.sass +++ b/assets/sass/_file_upload.sass @@ -26,6 +26,6 @@ padding-bottom: 8px border-bottom: 1px dotted #ddd width: 95% - &.file-error + .file-error font-weight: bold color: color('error') diff --git a/assets/sass/_form.sass b/assets/sass/_form.sass index 54394c41..00cea65a 100644 --- a/assets/sass/_form.sass +++ b/assets/sass/_form.sass @@ -1,13 +1,19 @@ @import variables @import mixins -form - margin-bottom: 20px +fieldset + border: 1px solid #ccc + margin-top: 20px + +legend + font-weight: 500 + font-size: size('medium') label cursor: pointer display: block margin-top: 10px + font-weight: 400 input &[type="number"], &[type="date"], &[type="email"], &[type="password"], &[type="text"]:not(.input-addon-field) @@ -19,7 +25,6 @@ input height: 25px padding-bottom: 0 font-family: sans-serif - margin-top: 10px +appearance @include placeholder color: color('lighter') @@ -49,11 +54,15 @@ textarea:focus box-shadow: 0 0 8px rgba(82, 168, 236, 0.6) textarea + padding: 3px border: 1px solid #ccc width: 400px max-width: 99% height: 200px font-family: sans-serif + font-size: size('normal') + @include placeholder + color: color('lighter') select font-size: 1.0em @@ -107,10 +116,15 @@ ul.form-errors li border: none label display: inline + padding-right: 3px input, select margin: 0 15px 0 0 .form-required display: none + .form-actions + display: inline-block + .js-submit-buttons-rendered + display: inline-block .form-inline-group display: inline @@ -125,9 +139,12 @@ ul.form-errors li margin-right: 25px flex-grow: 1 + fieldset + margin-top: 0 + .form-login max-width: 350px - margin: 8% auto 0 + margin: 5% auto 0 li margin-left: 25px line-height: 25px @@ -137,5 +154,6 @@ ul.form-errors li .reset-password margin-top: 20px + margin-bottom: 20px a color: color('light') diff --git a/assets/sass/_header.sass b/assets/sass/_header.sass index c2bcb90e..017d4445 100644 --- a/assets/sass/_header.sass +++ b/assets/sass/_header.sass @@ -12,22 +12,20 @@ header @include md-device @include grid_width(15/100) @include sm-device - @include grid_width(65/100) + @include grid_width(30/100) order: 2 .board-selector-container - @include grid_width(15/100) + @include grid_width(25/100) @include md-device @include grid_width(20/100) @include sm-device - @include grid_width(35/100) + @include grid_width(70/100) order: 1 margin-bottom: 5px .title-container - @include grid_width(75/100) - @include md-device - @include grid_width(65/100) + @include grid_width(65/100) @include sm-device @include grid_width(1) order: 3 diff --git a/assets/sass/_icon.sass b/assets/sass/_icon.sass new file mode 100644 index 00000000..e9ccbe43 --- /dev/null +++ b/assets/sass/_icon.sass @@ -0,0 +1,17 @@ +@import variables + +.icon-success + color: icon-color('success') + +.icon-error + color: icon-color('error') + +.icon-fade-out + opacity: 1 + animation: icon-fadeout 5s linear forwards + +@keyframes icon-fadeout + 0% + opacity: 1 + 100% + opacity: 0 diff --git a/assets/sass/_image_slideshow.sass b/assets/sass/_image_slideshow.sass new file mode 100644 index 00000000..22cb5937 --- /dev/null +++ b/assets/sass/_image_slideshow.sass @@ -0,0 +1,45 @@ +.image-slideshow-overlay + position: fixed + top: 0 + left: 0 + width: 100% + height: 100% + background: rgba(0, 0, 0, 0.95) + overflow: auto + z-index: 100 + img + display: block + margin: auto + figcaption + color: #fff + opacity: 0.7 + position: absolute + bottom: 5px + right: 15px + +.slideshow-icon + color: #fff + position: absolute + font-size: 2.5em + opacity: 0.6 + &:hover + opacity: 0.9 + cursor: pointer + +.slideshow-previous-icon + left: 10px + top: 45% + +.slideshow-next-icon + right: 10px + top: 45% + +.slideshow-close-icon + right: 10px + top: 10px + font-size: 1.4em + +.slideshow-download-icon + left: 10px + bottom: 10px + font-size: 1.3em diff --git a/assets/sass/_input_addon.sass b/assets/sass/_input_addon.sass index 6be78fdf..f721deae 100644 --- a/assets/sass/_input_addon.sass +++ b/assets/sass/_input_addon.sass @@ -10,12 +10,24 @@ margin: 0 +appearance + &:first-child + border-radius: 5px 0 0 5px + + &:last-child + border-radius: 0 5px 5px 0 + .input-addon-item background-color: rgba(147, 128, 108, 0.1) color: #666 font: inherit font-weight: normal + &:first-child + border-radius: 5px 0 0 5px + + &:last-child + border-radius: 0 5px 5px 0 + @include xs-device .dropdown .fa-caret-down @@ -27,9 +39,3 @@ &:not(:first-child) border-left: 0 - -.input-addon-field:first-child, .input-addon-item:first-child - border-radius: 5px 0 0 5px - -.input-addon-field:last-child, .input-addon-item:last-child - border-radius: 0 5px 5px 0 diff --git a/assets/sass/_links.sass b/assets/sass/_links.sass index d4544391..e5aa5f31 100644 --- a/assets/sass/_links.sass +++ b/assets/sass/_links.sass @@ -10,3 +10,7 @@ a &:hover color: link-color('hover') text-decoration: none + .fa + padding-right: 3px + text-decoration: none + color: color('primary')
\ No newline at end of file diff --git a/assets/sass/_markdown_editor.sass b/assets/sass/_markdown_editor.sass index 5bf77a99..ac25101e 100644 --- a/assets/sass/_markdown_editor.sass +++ b/assets/sass/_markdown_editor.sass @@ -1,15 +1,22 @@ -.markdown-editor-container - max-width: 400px +@import variables -div - &.CodeMirror, &.CodeMirror-scroll - max-height: 250px - min-height: 200px - -.markdown-editor-small div - &.CodeMirror, &.CodeMirror-scroll - min-height: 100px - max-height: 180px - -.form-column div.CodeMirror - margin-bottom: 10px +.text-editor + margin-top: 10px + a + font-size: size('normal') + color: color('light') + text-decoration: none + margin-right: 10px + &:hover + color: link-color('primary') + .text-editor-preview-area + border: 1px solid color('lighter') + width: 700px + max-width: 99% + height: 250px + overflow: auto + padding: 2px + textarea + width: 700px + max-width: 98% + height: 250px
\ No newline at end of file diff --git a/assets/sass/_mixins.sass b/assets/sass/_mixins.sass index 23301a82..62642d39 100644 --- a/assets/sass/_mixins.sass +++ b/assets/sass/_mixins.sass @@ -31,8 +31,6 @@ @mixin placeholder &::-webkit-input-placeholder @content - &:-moz-placeholder - @content &::-moz-placeholder @content &:-ms-input-placeholder diff --git a/assets/sass/_modal.sass b/assets/sass/_modal.sass new file mode 100644 index 00000000..68b0329b --- /dev/null +++ b/assets/sass/_modal.sass @@ -0,0 +1,34 @@ +@import variables +@import mixins + +#modal-overlay + position: fixed + top: 0 + left: 0 + width: 100% + height: 100% + background: rgba(0, 0, 0, 0.9) + overflow: auto + z-index: 100 + +#modal-box + position: fixed + max-height: calc(100% - 30px) + top: 2% + left: 50% + transform: translateX(-50%) + background: #fff + overflow: auto + border-radius: 5px + +#modal-content + padding: 0 5px 5px + +#modal-header + text-align: right + padding-right: 5px + +#modal-close-button + color: color('primary') + &:hover + color: color('error') diff --git a/assets/sass/_pagination.sass b/assets/sass/_pagination.sass index 792fb945..c4944d06 100644 --- a/assets/sass/_pagination.sass +++ b/assets/sass/_pagination.sass @@ -3,6 +3,11 @@ .pagination text-align: center +.pagination-showing + margin-right: 5px + padding-right: 5px + border-right: 1px solid #999 + .pagination-next margin-left: 5px diff --git a/assets/sass/_listing.sass b/assets/sass/_panel.sass index 64ff4adc..74552292 100644 --- a/assets/sass/_listing.sass +++ b/assets/sass/_panel.sass @@ -1,9 +1,10 @@ @import variables -.listing +.panel border-radius: 4px - padding: 8px 35px 8px 14px - margin-bottom: 20px + padding: 8px 35px 8px 10px + margin-top: 10px + margin-bottom: 15px border: 1px solid #ddd color: color('primary') background-color: bg-color('light') @@ -11,7 +12,4 @@ li list-style-type: square margin-left: 20px - margin-bottom: 3px - ul - margin-top: 15px - margin-bottom: 15px + line-height: 1.35em diff --git a/assets/sass/_popover.sass b/assets/sass/_popover.sass deleted file mode 100644 index 97d3e6e7..00000000 --- a/assets/sass/_popover.sass +++ /dev/null @@ -1,27 +0,0 @@ -@import variables -@import mixins - -#popover-container - position: fixed - top: 0 - left: 0 - width: 100% - height: 100% - background: rgba(0, 0, 0, 0.9) - overflow: auto - z-index: 100 - -#popover-content - position: fixed - width: 950px - max-width: 95% - max-height: calc(100% - 50px) - top: 5% - left: 50% - transform: translateX(-50%) - padding: 15px - background: #fff - overflow: auto - -.popover-form - margin-bottom: 0 diff --git a/assets/sass/_project.sass b/assets/sass/_project.sass index a1eb78bd..528e75aa 100644 --- a/assets/sass/_project.sass +++ b/assets/sass/_project.sass @@ -6,7 +6,7 @@ &:hover, &:focus text-decoration: underline -.project-creation-options +.js-project-creation-options max-width: 500px border-left: 3px dotted #efefef margin-top: 20px diff --git a/assets/sass/_select_dropdown.sass b/assets/sass/_select_dropdown.sass new file mode 100644 index 00000000..f0cef59c --- /dev/null +++ b/assets/sass/_select_dropdown.sass @@ -0,0 +1,52 @@ +@import variables + +#select-dropdown-menu + position: absolute + display: block + z-index: 1000 + min-width: 160px + padding: 5px 0 + background: #fff + list-style: none + border: 1px solid #ccc + border-radius: 3px + box-shadow: 0 6px 12px rgba(0, 0, 0, .175) + overflow: scroll + +.select-dropdown-menu-item + white-space: nowrap + overflow: hidden + padding: 3px 10px + color: color('medium') + cursor: pointer + border-bottom: 1px solid #f8f8f8 + line-height: 1.5em + font-weight: 400 + &.active + color: #fff + background: #428bca + &:last-child + border: none + +.select-dropdown-input-container + position: relative + border: 1px solid #ccc + border-radius: 5px + input.select-dropdown-input + margin: 0 0 0 5px + border: none + height: 23px + &:focus + border: none + box-shadow: none + .select-dropdown-chevron + color: color('medium') + position: absolute + top: 4px + right: 5px + cursor: pointer + .select-loading-icon + color: color('medium') + position: absolute + top: 4px + right: 5px
\ No newline at end of file diff --git a/assets/sass/_suggest_menu.sass b/assets/sass/_suggest_menu.sass new file mode 100644 index 00000000..76580d56 --- /dev/null +++ b/assets/sass/_suggest_menu.sass @@ -0,0 +1,28 @@ +@import variables + +#suggest-menu + position: absolute + display: block + z-index: 1000 + min-width: 160px + padding: 5px 0 + background: #fff + list-style: none + border: 1px solid #ccc + border-radius: 3px + box-shadow: 0 6px 12px rgba(0, 0, 0, .175) + +.suggest-menu-item + white-space: nowrap + padding: 3px 10px + color: color('primary') + font-weight: bold + cursor: pointer + &.active + color: #fff + background: #428bca + small + color: #fff + small + color: color('light') + font-weight: normal diff --git a/assets/sass/_task_form.sass b/assets/sass/_task_form.sass new file mode 100644 index 00000000..b7583981 --- /dev/null +++ b/assets/sass/_task_form.sass @@ -0,0 +1,32 @@ +@import variables + +.task-form-container + @include grid(100) + +.task-form-main-column + @include grid_width(60/100) + @include custom-device(1000px) + @include grid_width(1) + + input[type="text"] + width: 700px + max-width: 99% + +.task-form-secondary-column + max-width: 250px + min-width: 200px + max-height: 600px + padding-left: 10px + overflow: auto + @include grid_width(20/100) + @include custom-device(1000px) + @include grid_width(1) + max-width: 99% + max-height: none + label:first-child + margin-top: 0 + @include custom-device(1000px) + margin-top: 10px + +.task-form-bottom + @include grid_width(1) diff --git a/assets/sass/_task_summary.sass b/assets/sass/_task_summary.sass index 06ff64ec..1135133f 100644 --- a/assets/sass/_task_summary.sass +++ b/assets/sass/_task_summary.sass @@ -31,3 +31,9 @@ color: color('medium') li line-height: 23px + +#external-task-view + padding: 10px + margin-top: 10px + margin-bottom: 10px + border: 1px dotted #ccc diff --git a/assets/sass/_thumbnails.sass b/assets/sass/_thumbnails.sass index 9e130576..b860a607 100644 --- a/assets/sass/_thumbnails.sass +++ b/assets/sass/_thumbnails.sass @@ -15,6 +15,7 @@ box-shadow: 4px 2px 10px -6px rgba(0, 0, 0, 0.55) margin-right: 15px img + cursor: pointer border-top-left-radius: 5px border-top-right-radius: 5px &:hover @@ -28,6 +29,8 @@ font-weight: 700 font-size: size('compact') color: color('medium') + overflow: hidden + text-overflow: ellipsis .file-thumbnail-description font-size: size('small') diff --git a/assets/sass/_variables.sass b/assets/sass/_variables.sass index 49e1b3f5..d710d8c9 100644 --- a/assets/sass/_variables.sass +++ b/assets/sass/_variables.sass @@ -19,6 +19,8 @@ $button-hover-border-colors: ('default': #bbb, 'red': #b0281a, 'blue': #3079ed) $font-sizes: ('normal': 1.0em, 'tiny': 0.7em, 'small': 0.8em, 'compact': 0.9em, 'medium': 1.2em, 'large': 1.4em, 'xlarge': 1.6em, 'title': 1.5em) +$icon-colors: ('success': #468847, 'error': #b94a48) + $text-font: 'Helvetica Neue', Helvetica, Arial, sans-serif $board-task-limit-color: #DF5353 @@ -34,6 +36,9 @@ $board-task-limit-color: #DF5353 @function bg-color($key: 'primary') @return map-get($background-colors, $key) +@function icon-color($key) + @return map-get($icon-colors, $key) + @function alert-color($key) @return map-get($alert-colors, $key) diff --git a/assets/sass/app.sass b/assets/sass/app.sass index 9a93e4ab..475d1536 100644 --- a/assets/sass/app.sass +++ b/assets/sass/app.sass @@ -6,13 +6,15 @@ @import table_drag_and_drop @import form @import input_addon +@import icon @import alert @import button @import tooltip @import dropdown @import accordion -@import dialog_box -@import popover +@import select_dropdown +@import suggest_menu +@import modal @import pagination @import header @import logo @@ -38,6 +40,7 @@ @import task_board_date @import task_tags @import task_summary +@import task_form @import task_listing @import comment @import subtasks @@ -45,7 +48,8 @@ @import markdown_editor @import markdown_rendering @import documentation -@import listing +@import panel @import activity_stream @import gantt_chart @import user_mentions +@import image_slideshow |