This commit is contained in:
Sandeep Somavarapu 2016-10-17 18:01:07 +02:00
parent 1db3d3ce91
commit d41857c074
2 changed files with 21 additions and 14 deletions

View file

@ -53,12 +53,13 @@ export class Renderer implements IPagedRenderer<IExtension, ITemplateData> {
const element = append(root, $('.extension'));
const icon = append(element, $<HTMLImageElement>('img.icon'));
const details = append(element, $('.details'));
const header = append(details, $('.header'));
const headerContainer = append(details, $('.header-container'));
const header = append(headerContainer, $('.header'));
const name = append(header, $('span.name'));
const version = append(header, $('span.version'));
const installCount = append(header, $('span.install-count'));
const ratings = append(header, $('span.ratings'));
const status = append(header, $(''));
const status = append(headerContainer, $('span.status'));
const description = append(details, $('.description.ellipsis'));
const footer = append(details, $('.footer'));
const author = append(footer, $('.author.ellipsis'));

View file

@ -63,20 +63,26 @@
overflow: hidden;
}
.extensions-viewlet > .extensions .extension > .details > .header {
display: flex;
align-items: baseline;
flex-wrap: wrap;
.extensions-viewlet > .extensions .extension > .details > .header-container {
height: 19px;
display: flex;
overflow: hidden;
}
.extensions-viewlet > .extensions .extension > .details > .header > .name {
.extensions-viewlet > .extensions .extension > .details > .header-container > .header {
display: flex;
align-items: baseline;
flex-wrap: wrap;
overflow: hidden;
flex: 1;
}
.extensions-viewlet > .extensions .extension > .details > .header-container > .header > .name {
font-weight: bold;
min-width: fit-content;
}
.extensions-viewlet > .extensions .extension > .details > .header > .version {
.extensions-viewlet > .extensions .extension > .details > .header-container > .header > .version {
opacity: 0.6;
font-size: 80%;
padding-left: 6px;
@ -84,26 +90,26 @@
min-width: fit-content;
}
.extensions-viewlet > .extensions .extension > .details > .header > .install-count:not(:empty) {
.extensions-viewlet > .extensions .extension > .details > .header-container > .header > .install-count:not(:empty) {
font-size: 80%;
margin: 0 6px;
}
.extensions-viewlet > .extensions .extension > .details > .header > .install-count > .octicon {
.extensions-viewlet > .extensions .extension > .details > .header-container > .header > .install-count > .octicon {
font-size: 100%;
margin-right: 2px;
}
.extensions-viewlet > .extensions .extension > .details > .header > .ratings {
.extensions-viewlet > .extensions .extension > .details > .header-container > .header > .ratings {
text-align: right;
}
.extensions-viewlet.narrow > .extensions .extension > .details > .header > .ratings,
.extensions-viewlet.narrow > .extensions .extension > .details > .header > .install-count {
.extensions-viewlet.narrow > .extensions .extension > .details > .header-container > .header > .ratings,
.extensions-viewlet.narrow > .extensions .extension > .details > .header-container > .header > .install-count {
display: none;
}
.extensions-viewlet > .extensions .extension > .details > .header .extension-status {
.extensions-viewlet > .extensions .extension > .details > .header-container .extension-status {
width: 7px;
height: 7px;
margin-left: 5px;