diff --git a/app/locales/taiga/locale-en.json b/app/locales/taiga/locale-en.json index 687c484a..649b5508 100644 --- a/app/locales/taiga/locale-en.json +++ b/app/locales/taiga/locale-en.json @@ -1459,6 +1459,7 @@ "DELETE_LIGHTBOX_TITLE": "Delete Wiki Page", "DELETE_LINK_TITLE": "Delete Wiki link", "NAVIGATION": { + "HOME": "Main Page", "SECTION_NAME": "Links", "ACTION_ADD_LINK": "Add link", "ALL_PAGES": "All pages" diff --git a/app/partials/wiki/wiki-list.jade b/app/partials/wiki/wiki-list.jade index cc5e71c0..284b57e9 100644 --- a/app/partials/wiki/wiki-list.jade +++ b/app/partials/wiki/wiki-list.jade @@ -1,10 +1,15 @@ doctype html -div.wrapper(ng-controller="WikiPagesListController as ctrl", - ng-init="section='wiki'") +div.wrapper( + ng-controller="WikiPagesListController as ctrl" + ng-init="section='wiki'" +) tg-project-menu sidebar.menu-secondary.extrabar(ng-if="linksVisible") - section.wiki-nav(tg-wiki-nav, ng-model="wikiLinks") + section.wiki-nav( + tg-wiki-nav + ng-model="wikiLinks" + ) section.main.wiki header h1 @@ -33,12 +38,20 @@ div.wrapper(ng-controller="WikiPagesListController as ctrl", translate="WIKI.PAGES_LIST_COLUMNS.MODIFIED" ) - div.row.table-main(ng-repeat="wikipage in wikipages track by wikipage.slug") - div.title-field - a(href="", tg-nav="project-wiki-page:project=project.slug,slug=wikipage.slug") - | {{wikipage.slug}} - div.editions-field {{wikipage.editions}} - div.creator-field(tg-user-display, tg-user-id="{{wikipage.owner}}") - div.created-field(tg-bo-bind="wikipage.created_date|momentFormat:'DD MMM YYYY HH:mm'") - div.last-modifier-field(tg-user-display, tg-user-id="{{wikipage.last_modifier}}") - div.modified-field(tg-bo-bind="wikipage.modified_date|momentFormat:'DD MMM YYYY HH:mm'") + .row.table-main(ng-repeat="wikipage in wikipages track by wikipage.slug") + .title-field + a( + href="" + tg-nav="project-wiki-page:project=project.slug,slug=wikipage.slug" + ) {{wikipage.slug}} + .editions-field {{wikipage.editions}} + .creator-field( + tg-user-display + tg-user-id="{{wikipage.owner}}" + ) + .created-field(tg-bo-bind="wikipage.created_date|momentFormat:'DD MMM YYYY HH:mm'") + .last-modifier-field( + tg-user-display + tg-user-id="{{wikipage.last_modifier}}" + ) + .modified-field(tg-bo-bind="wikipage.modified_date|momentFormat:'DD MMM YYYY HH:mm'") diff --git a/app/partials/wiki/wiki-nav.jade b/app/partials/wiki/wiki-nav.jade index 7137e16f..afa7fb8f 100644 --- a/app/partials/wiki/wiki-nav.jade +++ b/app/partials/wiki/wiki-nav.jade @@ -1,29 +1,45 @@ header - h1(translate="WIKI.NAVIGATION.SECTION_NAME") - a(href="", tg-nav="project-wiki-list:project=project.slug", translate="WIKI.NAVIGATION.ALL_PAGES") + h1(translate="WIKI.NAVIGATION.SECTION_NAME") nav - ul.sortable - li.wiki-link(ng-repeat="link in wikiLinks", data-id!="{{ $index }}", tg-bind-scope) - tg-svg.dragger(svg-icon="icon-drag") - a.link-title(title!="{{ link.title }}", href!="{{ link.url }}") {{ link.title }} + ul + li.wiki-link + a.link-title( + href="" + tg-nav="project-wiki-list:project=project.slug" + translate="WIKI.NAVIGATION.ALL_PAGES" + ) - <% if (deleteWikiLinkPermission) { %> - a.js-delete-link.remove-wiki-page(title!="{{'WIKI.DELETE_LINK_TITLE' | translate}}") - tg-svg(svg-icon="icon-trash") - <% } %> + li.wiki-link + a.link-title( + href="" + tg-nav="project-wiki:project=project.slug" + translate="WIKI.NAVIGATION.HOME" + ) - input.hidden( - type="text" - placeholder="{{'COMMON.FIELDS.NAME' | translate}}" - value!="{{ link.title }}" - ) + ul.sortable + li.wiki-link(ng-repeat="link in wikiLinks", data-id!="{{ $index }}", tg-bind-scope) + <% if (addWikiLinkPermission) { %> + tg-svg.dragger(svg-icon="icon-drag") + <% } %> + a.link-title(title!="{{ link.title }}", href!="{{ link.url }}") {{ link.title }} - li.new.hidden - input( - type="text" - placeholder="{{'COMMON.FIELDS.NAME' | translate}}" - ) + <% if (deleteWikiLinkPermission) { %> + a.js-delete-link.remove-wiki-page(title!="{{'WIKI.DELETE_LINK_TITLE' | translate}}") + tg-svg(svg-icon="icon-trash") + <% } %> + + input.hidden( + type="text" + placeholder="{{'COMMON.FIELDS.NAME' | translate}}" + value!="{{ link.title }}" + ) + + li.new.hidden + input( + type="text" + placeholder="{{'COMMON.FIELDS.NAME' | translate}}" + ) <% if (addWikiLinkPermission) { %> a( diff --git a/app/partials/wiki/wiki-summary.jade b/app/partials/wiki/wiki-summary.jade index f2855cba..d10e398f 100644 --- a/app/partials/wiki/wiki-summary.jade +++ b/app/partials/wiki/wiki-summary.jade @@ -1,14 +1,14 @@ -div.wiki-times-edited - span.number <%- totalEditions %> - span.description(translate="WIKI.SUMMARY.TIMES_EDITED") - -div.wiki-last-modified - span.number <%- lastModifiedDate %> - span.description(translate="WIKI.SUMMARY.LAST_EDIT") - -div.wiki-username-edition - figure.avatar +.wiki-username-edition + .avatar img(src!="<%- user.imgUrl %>" alt!="<%- user.name %>") - div.wiki-user-modification + .wiki-user-modification span.description(translate="WIKI.SUMMARY.LAST_MODIFICATION") span.username <%- user.name %> + +.wiki-last-modified + span.number <%- lastModifiedDate %> + span.description(translate="WIKI.SUMMARY.LAST_EDIT") + +.wiki-times-edited + span.number <%- totalEditions %> + span.description(translate="WIKI.SUMMARY.TIMES_EDITED") diff --git a/app/partials/wiki/wiki.jade b/app/partials/wiki/wiki.jade index a7e59bd5..4435b495 100644 --- a/app/partials/wiki/wiki.jade +++ b/app/partials/wiki/wiki.jade @@ -4,7 +4,10 @@ div.wrapper(ng-controller="WikiDetailController as ctrl", ng-init="section='wiki'") tg-project-menu sidebar.menu-secondary.extrabar(ng-if="linksVisible") - section.wiki-nav(tg-wiki-nav, ng-model="wikiLinks") + section.wiki-nav( + tg-wiki-nav + ng-model="wikiLinks" + ) section.main.wiki header h1 @@ -12,13 +15,18 @@ div.wrapper(ng-controller="WikiDetailController as ctrl", span.green(translate="PROJECT.SECTION.WIKI") - div.summary.wiki-summary(tg-wiki-summary, ng-model="wiki", ng-if="wiki.id") h2.wiki-title(ng-bind='wikiTitle') section.wiki-content( tg-editable-wysiwyg, tg-editable-wiki-content, ng-model="wiki" ) + + div.summary.wiki-summary( + tg-wiki-summary + ng-model="wiki" + ng-if="wiki.id" + ) tg-attachments-full( ng-if="wiki.id" diff --git a/app/styles/components/basic-table.scss b/app/styles/components/basic-table.scss index 3e710ed1..09df2464 100644 --- a/app/styles/components/basic-table.scss +++ b/app/styles/components/basic-table.scss @@ -11,6 +11,9 @@ padding: .3rem 0; text-align: left; width: 100%; + @include breakpoint(tablet) { + flex-direction: column; + } @for $i from 1 through 8 { .width-#{$i} { flex-basis: 50px; diff --git a/app/styles/layout/wiki.scss b/app/styles/layout/wiki.scss index 36b3b20f..5b5c8874 100644 --- a/app/styles/layout/wiki.scss +++ b/app/styles/layout/wiki.scss @@ -1,11 +1,17 @@ .wiki { + .wysiwyg { + margin-bottom: 0; + } .wiki-title { @include font-type(light); - @include font-size(larger); + @include font-size(xxlarge); + margin-bottom: 0; + padding: 1rem; } .remove { @include font-size(small); color: $gray-light; + cursor: pointer; &:hover { color: $red-light; transition: color .1s linear; @@ -22,8 +28,8 @@ } .wiki-content { - @include cursor-progress; - margin-bottom: 2rem; + @include font-size(large); + max-width: 1024px; position: relative; &.editable { &:hover { @@ -91,93 +97,3 @@ top: .4rem; } } - -.wiki-pages-table { - display: flex; - margin-bottom: 2rem; - &.empty { - display: none; - } - .row { - &:hover { - background: lighten($primary, 65%); - transition: background .2s ease-in; - } - .icon { - display: inline; - } - } - .title { - @include font-size(medium); - @include font-type(bold); - border-bottom: 1px solid $gray-light; - &:hover { - background: transparent; - } - div { - cursor: pointer; - } - .votes { - color: $gray; - } - } - .table-main { - @include font-size(small); - border-bottom: 1px solid darken($whitish, 4%); - } - .avatar { - align-items: center; - display: flex; - img { - width: 35px; - } - figcaption { - flex-basis: 60%; - flex-grow: 1; - margin-left: .5rem; - } - } - .title-field { - overflow: hidden; - padding-right: 1rem; - width: 100%; - a { - @include ellipsis(100%); - display: block; - } - span { - vertical-align: middle; - &:first-child { - margin-right: .5rem; - } - } - } - .editions-field, - .created-field, - .modified-field, - .creator-field , - .last-modifier-field { - flex-basis: 140px; - flex-grow: 1; - flex-shrink: 0; - padding: 0 1rem; - position: relative; - text-align: left; - } - .creator-field , - .last-modifier-field { - display: flex; - flex-basis: 180px; - flex-direction: row; - .user-avatar { - flex-grow: 0; - img { - height: 48px; - } - } - .user-full-name { - flex-grow: 1; - padding: .5rem; - } - } -} diff --git a/app/styles/modules/wiki/wiki-nav.scss b/app/styles/modules/wiki/wiki-nav.scss index c19ee691..93245a85 100644 --- a/app/styles/modules/wiki/wiki-nav.scss +++ b/app/styles/modules/wiki/wiki-nav.scss @@ -47,9 +47,6 @@ } .wiki-nav { - ul { - border-top: 1px solid $gray-light; - } .add-button { color: $white; display: block; diff --git a/app/styles/modules/wiki/wiki-pages-table.scss b/app/styles/modules/wiki/wiki-pages-table.scss new file mode 100644 index 00000000..15991f3c --- /dev/null +++ b/app/styles/modules/wiki/wiki-pages-table.scss @@ -0,0 +1,48 @@ +.wiki-pages-table { + display: flex; + .row { + padding: .5rem; + } + .title { + @include font-size(medium); + @include font-type(bold); + } + .table-main { + @include font-size(small); + } + .title-field { + flex-basis: 180px; + flex-grow: 1; + flex-shrink: 0; + } + .created-field, + .created-field, + .modified-field { + flex-basis: 10vw; + flex-grow: 0; + flex-shrink: 0; + margin-right: .5rem; + } + .editions-field { + flex-basis: 80px; + flex-grow: 0; + flex-shrink: 0; + margin-right: .5rem; + } + .creator-field, + .last-modifier-field { + align-items: center; + display: flex; + flex-basis: 200px; + .user-avatar { + flex-grow: 0; + img { + height: 2rem; + } + } + .user-full-name { + flex-grow: 1; + padding: .5rem; + } + } +} diff --git a/app/styles/modules/wiki/wiki-summary.scss b/app/styles/modules/wiki/wiki-summary.scss index 21189166..1c400d20 100644 --- a/app/styles/modules/wiki/wiki-summary.scss +++ b/app/styles/modules/wiki/wiki-summary.scss @@ -1,28 +1,30 @@ .wiki-summary { align-items: center; - flex-wrap: wrap; justify-content: flex-start; + margin-top: 1rem; + &.summary { + background: $whitish; + color: $gray; + } div { display: flex; - justify-content: space-between; - margin-right: 1rem; - } - .number { - line-height: 2rem; - top: 0; + margin-right: 1.25rem; } .wiki-user-modification { display: flex; flex-direction: column; justify-content: flex-start; } - figure { - margin-right: .3rem; - width: 32px; + .avatar { + margin-right: .5rem; + width: 2.25rem; + } + img { + height: 100%; + width: 100%; } .username { @include font-size(large); - color: $primary-light; white-space: nowrap; } }