1
0
Fork 0
mirror of https://github.com/documize/community.git synced 2025-07-19 13:19:43 +02:00

Allow for clickable links in space description

Closes #361
This commit is contained in:
HarveyKandola 2020-02-04 12:28:57 +00:00
parent 8ac35a6b74
commit d1774b42bd
2 changed files with 163 additions and 152 deletions

View file

@ -3,122 +3,129 @@
margin: 0; margin: 0;
padding: 0; padding: 0;
> a { > .item {
> .item { @include card();
@include card(); list-style-type: none;
list-style-type: none; margin: 0 0 2rem 0;
margin: 0 0 2rem 0; padding: 15px 20px;
padding: 15px 20px; width: 100%;
width: 100%; display: grid;
display: grid; grid-template-columns: 1fr;
grid-template-columns: 1fr; grid-template-rows: 2fr;
grid-template-rows: 2fr; @include border-radius(16px);
@include border-radius(16px);
> .info { > .info {
grid-column-start: 1; grid-column-start: 1;
grid-row-start: 1; grid-row-start: 1;
padding: 0; padding: 0;
align-self: self-start; align-self: self-start;
justify-self: self-start; justify-self: self-start;
width: 100%;
> .name { > a {
font-size: 1.4rem; > .name {
font-weight: 700; font-size: 1.4rem;
color: map-get($gray-shades, 800); font-weight: 700;
color: map-get($gray-shades, 800);
> .icon { > .icon {
color: map-get($gray-shades, 700); color: map-get($gray-shades, 700);
font-size: 26px; font-size: 26px;
vertical-align: middle; vertical-align: middle;
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
} }
} }
}
> .desc { > .desc {
font-size: 1.1rem; font-size: 1.1rem;
font-weight: 400; font-weight: 400;
margin-top: 0.4rem; margin-top: 0.4rem;
color: $color-black-light-3; color: $color-black-light-3;
} }
> .meta { > a {
padding: 15px 0 0 0; > .meta {
padding: 15px 0 0 0;
> .dicon { > .dicon {
color: map-get($gray-shades, 600); color: map-get($gray-shades, 600);
font-size: 20px; font-size: 20px;
margin-right: 20px; margin-right: 20px;
vertical-align: middle; vertical-align: middle;
} }
> .space-label { > .space-label {
@include border-radius(3px); @include border-radius(3px);
@extend .no-select; @extend .no-select;
display: inline-block; display: inline-block;
margin: 10px 0 13px 0; margin: 10px 0 13px 0;
padding: 0.3rem 0.7rem; padding: 0.3rem 0.7rem;
font-size: 1.1rem; font-size: 1.1rem;
font-weight: 400; font-weight: 400;
color: map-get($gray-shades, 100); color: map-get($gray-shades, 100);
} }
} }
} }
}
> .stats { > a {
grid-column-start: 1; > .stats {
grid-row-start: 2; grid-column-start: 1;
padding: 0; grid-row-start: 2;
align-self: self-start; padding: 0;
justify-self: self-start; align-self: self-start;
justify-self: self-start;
> .stat { > .stat {
text-align: center; text-align: center;
display: inline-block; display: inline-block;
margin: 5px 30px 5px 0; margin: 5px 30px 5px 0;
> .number { > .number {
font-size: 1.7rem; font-size: 1.7rem;
font-weight: 700; font-weight: 700;
color: map-get($gray-shades, 600); color: map-get($gray-shades, 600);
} }
> .label { > .label {
font-size: 0.9rem; font-size: 0.9rem;
font-weight: 500; font-weight: 500;
color: map-get($gray-shades, 600); color: map-get($gray-shades, 600);
text-transform: uppercase; text-transform: uppercase;
} }
} }
} }
}
@media (min-width: $display-break-2) { @media (min-width: $display-break-2) {
grid-template-columns: 8fr 2fr; grid-template-columns: 8fr 2fr;
grid-template-rows: 1fr; grid-template-rows: 1fr;
> .info { > .info {
grid-column-start: 1; grid-column-start: 1;
grid-row-start: 1; grid-row-start: 1;
padding: 0; padding: 0;
} }
> .stats { > a {
grid-column-start: 2; > .stats {
grid-row-start: 1; grid-column-start: 2;
padding: 0; grid-row-start: 1;
justify-self: self-end; padding: 0;
justify-self: self-end;
> .stat, > .number, > .label { > .stat, > .number, > .label {
display: block; display: block;
} }
> .stat { > .stat {
margin: 5px 0; margin: 5px 0;
} }
} }
} }
} }
} }
} }
} }

View file

@ -15,57 +15,61 @@
<ul class="list"> <ul class="list">
{{#each spaces as |space|}} {{#each spaces as |space|}}
{{#link-to "folder.index" space.id space.slug}} <li class="item">
<li class="item"> <div class="info">
<div class="info"> {{#link-to "folder.index" space.id space.slug}}
<div class="name"> <div class="name">
{{#if space.icon}} {{#if space.icon}}
<div class="icon"> <div class="icon">
{{ui/ui-icon-meta icon=space.icon}} {{ui/ui-icon-meta icon=space.icon}}
</div> </div>
{{/if}} {{/if}}
{{space.name}} {{space.name}}
</div> </div>
{{#if (not-eq viewDensity "3")}} {{/link-to}}
<div class="desc">{{{space.desc}}}</div> {{#if (not-eq viewDensity "3")}}
{{/if}} <div class="desc">{{{space.desc}}}</div>
{{#if (eq viewDensity "1")}} {{/if}}
<div class="meta"> {{#if (eq viewDensity "1")}}
{{!-- {{#if (eq space.spaceType constants.SpaceType.Public)}} {{#link-to "folder.index" space.id space.slug}}
<i class={{concat "dicon " constants.Icon.World}}> <div class="meta">
{{#attach-tooltip showDelay=1000}}Public space{{/attach-tooltip}} {{!-- {{#if (eq space.spaceType constants.SpaceType.Public)}}
</i> <i class={{concat "dicon " constants.Icon.World}}>
{{/if}} {{#attach-tooltip showDelay=1000}}Public space{{/attach-tooltip}}
{{#if (eq space.spaceType constants.SpaceType.Protected)}} </i>
<i class={{concat "dicon " constants.Icon.People}}> {{/if}}
{{#attach-tooltip showDelay=1000}}Protected space{{/attach-tooltip}} {{#if (eq space.spaceType constants.SpaceType.Protected)}}
</i> <i class={{concat "dicon " constants.Icon.People}}>
{{/if}} {{#attach-tooltip showDelay=1000}}Protected space{{/attach-tooltip}}
{{#if (eq space.spaceType constants.SpaceType.Private)}} </i>
<i class={{concat "dicon " constants.Icon.Person}}> {{/if}}
{{#attach-tooltip showDelay=1000}}Personal space{{/attach-tooltip}} {{#if (eq space.spaceType constants.SpaceType.Private)}}
</i> <i class={{concat "dicon " constants.Icon.Person}}>
{{/if}} --}} {{#attach-tooltip showDelay=1000}}Personal space{{/attach-tooltip}}
{{#if space.labelId}} </i>
{{spaces/space-label labels=labels labelId=space.labelId}} {{/if}} --}}
{{/if}} {{#if space.labelId}}
</div> {{spaces/space-label labels=labels labelId=space.labelId}}
{{/if}} {{/if}}
</div> </div>
{{#if (eq viewDensity "1")}} {{/link-to}}
<div class="stats"> {{/if}}
<div class="stat"> </div>
<div class="number">{{space.countContent}}</div> {{#if (eq viewDensity "1")}}
<div class="label">items</div> {{#link-to "folder.index" space.id space.slug}}
</div> <div class="stats">
<div class="stat"> <div class="stat">
<div class="number">{{space.countCategory}}</div> <div class="number">{{space.countContent}}</div>
<div class="label">categories</div> <div class="label">items</div>
</div> </div>
</div> <div class="stat">
{{/if}} <div class="number">{{space.countCategory}}</div>
</li> <div class="label">categories</div>
{{/link-to}} </div>
</div>
{{/link-to}}
{{/if}}
</li>
{{/each}} {{/each}}
</ul> </ul>