Fix duplicating list on extension pack (#9992) (#10003)

* makes the preview button hover state stay active when hovering over tooltip

* fixes the duplicating list on the extension pack when a 2nd welcome page tab is opened
This commit is contained in:
v-bbrady
2020-04-15 16:36:48 -07:00
committed by GitHub
parent 5089b5c8bd
commit 3566da328a
2 changed files with 39 additions and 33 deletions

View File

@@ -278,7 +278,6 @@
visibility: hidden;
padding: 10px 15px;
z-index: 1;
top: 150%;
right: -72px;
text-align: center;
border-radius: 6px;

View File

@@ -294,7 +294,7 @@ class WelcomePage extends Disposable {
}
private createWidePreviewToolTip() {
const previewLink = document.querySelector('#preview_link_wide');
const previewLink = document.querySelector('#tool_tip_container_wide');
const tooltip = document.querySelector('#tooltip_text_wide');
const previewModalBody = document.querySelector('.preview_tooltip_body') as HTMLElement;
const previewModalHeader = document.querySelector('.preview_tooltip_header') as HTMLElement;
@@ -625,41 +625,48 @@ class WelcomePage extends Disposable {
description.innerHTML = extension.description;
header.innerHTML = extension.name;
const extensionListContainer = document.querySelector('.extension_pack_extension_list');
extensionPackExtensions.forEach((j) => {
const outerContainerElem = document.createElement('div');
const flexContainerElem = document.createElement('div');
const iconContainerElem = document.createElement('img');
const descriptionContainerElem = document.createElement('div');
const pElem = document.createElement('p');
const anchorElem = document.createElement('a');
const outerContainerClasses = ['extension_pack_extension_container', 'flex', 'flex_j_center'];
const flexContainerClasses = ['flex', 'flex_a_center'];
anchorElem.href = j.link;
outerContainerElem.classList.add(...outerContainerClasses);
flexContainerElem.classList.add(...flexContainerClasses);
iconContainerElem.classList.add('icon');
pElem.classList.add('extension_pack_extension_list_header');
descriptionContainerElem.classList.add('description');
outerContainerElem.appendChild(flexContainerElem);
flexContainerElem.appendChild(iconContainerElem);
flexContainerElem.appendChild(descriptionContainerElem);
descriptionContainerElem.appendChild(anchorElem);
anchorElem.appendChild(pElem);
pElem.innerText = j.name;
iconContainerElem.src = j.icon;
extensionListContainer.appendChild(outerContainerElem);
});
this.addExtensionPackList(container, '.extension_pack_extension_list');
});
}
}
private addExtensionPackList(container: HTMLElement, listSelector: string) {
const list = container.querySelector(listSelector);
if (list) {
extensionPackExtensions.forEach((j) => {
const outerContainerElem = document.createElement('div');
const flexContainerElem = document.createElement('div');
const iconContainerElem = document.createElement('img');
const descriptionContainerElem = document.createElement('div');
const pElem = document.createElement('p');
const anchorElem = document.createElement('a');
const outerContainerClasses = ['extension_pack_extension_container', 'flex', 'flex_j_center'];
const flexContainerClasses = ['flex', 'flex_a_center'];
anchorElem.href = j.link;
outerContainerElem.classList.add(...outerContainerClasses);
flexContainerElem.classList.add(...flexContainerClasses);
iconContainerElem.classList.add('icon');
pElem.classList.add('extension_pack_extension_list_header');
descriptionContainerElem.classList.add('description');
outerContainerElem.appendChild(flexContainerElem);
flexContainerElem.appendChild(iconContainerElem);
flexContainerElem.appendChild(descriptionContainerElem);
descriptionContainerElem.appendChild(anchorElem);
anchorElem.appendChild(pElem);
pElem.innerText = j.name;
iconContainerElem.src = j.icon;
list.appendChild(outerContainerElem);
});
}
}
private installExtension(extensionSuggestion: ExtensionSuggestion): void {
/* __GDPR__FRAGMENT__
"WelcomePageInstall-1" : {