angular-techs-logos 0.1.19 → 0.1.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/angular-techs-logos.mjs +1 -2
- package/esm2022/lib/angular-techs-logos.component.mjs +1 -90
- package/esm2022/lib/angular-techs-logos.module.mjs +1 -440
- package/esm2022/lib/techs/amd/amd.component.mjs +1 -11
- package/esm2022/lib/techs/android/android.component.mjs +1 -11
- package/esm2022/lib/techs/androidstudio/androidstudio.component.mjs +1 -11
- package/esm2022/lib/techs/angular/angular.component.mjs +1 -11
- package/esm2022/lib/techs/apache/apache.component.mjs +1 -11
- package/esm2022/lib/techs/apple/apple.component.mjs +1 -11
- package/esm2022/lib/techs/archlinux/archlinux.component.mjs +1 -11
- package/esm2022/lib/techs/astro/astro.component.mjs +1 -11
- package/esm2022/lib/techs/aws/aws.component.mjs +1 -11
- package/esm2022/lib/techs/backbone/backbone.component.mjs +1 -11
- package/esm2022/lib/techs/baidu/baidu.component.mjs +1 -11
- package/esm2022/lib/techs/bitbucket/bitbucket.component.mjs +1 -11
- package/esm2022/lib/techs/centos/centos.component.mjs +1 -11
- package/esm2022/lib/techs/chatgpt/chatgpt.component.mjs +1 -11
- package/esm2022/lib/techs/chrome/chrome.component.mjs +1 -11
- package/esm2022/lib/techs/cisco/cisco.component.mjs +1 -11
- package/esm2022/lib/techs/cobol/cobol.component.mjs +1 -11
- package/esm2022/lib/techs/codepen/codepen.component.mjs +1 -11
- package/esm2022/lib/techs/copilot/copilot.component.mjs +1 -11
- package/esm2022/lib/techs/cpp/cpp.component.mjs +1 -11
- package/esm2022/lib/techs/csharp/csharp.component.mjs +1 -11
- package/esm2022/lib/techs/css/css.component.mjs +1 -11
- package/esm2022/lib/techs/cypress/cypress.component.mjs +1 -11
- package/esm2022/lib/techs/debian/debian.component.mjs +1 -11
- package/esm2022/lib/techs/deepin/deepin.component.mjs +1 -11
- package/esm2022/lib/techs/deezer/deezer.component.mjs +1 -11
- package/esm2022/lib/techs/digitalocean/digitalocean.component.mjs +1 -11
- package/esm2022/lib/techs/discord/discord.component.mjs +1 -11
- package/esm2022/lib/techs/docker/docker.component.mjs +1 -11
- package/esm2022/lib/techs/dribbble/dribbble.component.mjs +1 -11
- package/esm2022/lib/techs/dropbox/dropbox.component.mjs +1 -11
- package/esm2022/lib/techs/drupal/drupal.component.mjs +1 -11
- package/esm2022/lib/techs/duckduckgo/duckduckgo.component.mjs +1 -11
- package/esm2022/lib/techs/eclipse/eclipse.component.mjs +1 -11
- package/esm2022/lib/techs/edge/edge.component.mjs +1 -11
- package/esm2022/lib/techs/elementaryos/elementaryos.component.mjs +1 -11
- package/esm2022/lib/techs/ember/ember.component.mjs +1 -11
- package/esm2022/lib/techs/evernote/evernote.component.mjs +1 -11
- package/esm2022/lib/techs/expo/expo.component.mjs +1 -11
- package/esm2022/lib/techs/facebook/facebook.component.mjs +1 -11
- package/esm2022/lib/techs/fedora/fedora.component.mjs +1 -11
- package/esm2022/lib/techs/firebase/firebase.component.mjs +1 -11
- package/esm2022/lib/techs/firefox/firefox.component.mjs +1 -11
- package/esm2022/lib/techs/fortran/fortran.component.mjs +1 -11
- package/esm2022/lib/techs/gemini/gemini.component.mjs +1 -11
- package/esm2022/lib/techs/git/git.component.mjs +1 -11
- package/esm2022/lib/techs/github/github.component.mjs +1 -11
- package/esm2022/lib/techs/gitlab/gitlab.component.mjs +1 -11
- package/esm2022/lib/techs/go/go.component.mjs +1 -11
- package/esm2022/lib/techs/google/google.component.mjs +1 -11
- package/esm2022/lib/techs/gulp/gulp.component.mjs +1 -11
- package/esm2022/lib/techs/hp/hp.component.mjs +1 -11
- package/esm2022/lib/techs/html/html.component.mjs +1 -11
- package/esm2022/lib/techs/ibm/ibm.component.mjs +1 -11
- package/esm2022/lib/techs/instagram/instagram.component.mjs +1 -11
- package/esm2022/lib/techs/intellij/intellij.component.mjs +1 -11
- package/esm2022/lib/techs/java/java.component.mjs +1 -11
- package/esm2022/lib/techs/javascript/javascript.component.mjs +1 -11
- package/esm2022/lib/techs/jest/jest.component.mjs +1 -11
- package/esm2022/lib/techs/jetbrains/jetbrains.component.mjs +1 -11
- package/esm2022/lib/techs/kalilinux/kalilinux.component.mjs +1 -11
- package/esm2022/lib/techs/karma/karma.component.mjs +1 -11
- package/esm2022/lib/techs/kotlin/kotlin.component.mjs +1 -11
- package/esm2022/lib/techs/kubernets/kubernets.component.mjs +1 -11
- package/esm2022/lib/techs/less/less.component.mjs +1 -11
- package/esm2022/lib/techs/linkedin/linkedin.component.mjs +1 -11
- package/esm2022/lib/techs/linux/linux.component.mjs +1 -11
- package/esm2022/lib/techs/lua/lua.component.mjs +1 -11
- package/esm2022/lib/techs/macos/macos.component.mjs +1 -11
- package/esm2022/lib/techs/manjaro/manjaro.component.mjs +1 -11
- package/esm2022/lib/techs/mariadb/mariadb.component.mjs +1 -11
- package/esm2022/lib/techs/max/max.component.mjs +1 -11
- package/esm2022/lib/techs/microsoft/microsoft.component.mjs +1 -11
- package/esm2022/lib/techs/mint/mint.component.mjs +1 -11
- package/esm2022/lib/techs/mongodb/mongodb.component.mjs +1 -11
- package/esm2022/lib/techs/mozilla/mozilla.component.mjs +1 -11
- package/esm2022/lib/techs/mysql/mysql.component.mjs +1 -11
- package/esm2022/lib/techs/netflix/netflix.component.mjs +1 -11
- package/esm2022/lib/techs/nextjs/nextjs.component.mjs +1 -11
- package/esm2022/lib/techs/node/node.component.mjs +1 -11
- package/esm2022/lib/techs/npm/npm.component.mjs +1 -11
- package/esm2022/lib/techs/nuxt/nuxt.component.mjs +1 -11
- package/esm2022/lib/techs/nvidia/nvidia.component.mjs +1 -11
- package/esm2022/lib/techs/opensuse/opensuse.component.mjs +1 -11
- package/esm2022/lib/techs/opera/opera.component.mjs +1 -11
- package/esm2022/lib/techs/oracle/oracle.component.mjs +1 -11
- package/esm2022/lib/techs/pandas/pandas.component.mjs +1 -11
- package/esm2022/lib/techs/php/php.component.mjs +1 -11
- package/esm2022/lib/techs/pinterest/pinterest.component.mjs +1 -11
- package/esm2022/lib/techs/playstore/playstore.component.mjs +1 -11
- package/esm2022/lib/techs/postgresql/postgresql.component.mjs +1 -11
- package/esm2022/lib/techs/primevideo/primevideo.component.mjs +1 -11
- package/esm2022/lib/techs/pwa/pwa.component.mjs +1 -11
- package/esm2022/lib/techs/python/python.component.mjs +1 -11
- package/esm2022/lib/techs/qwik/qwik.component.mjs +1 -11
- package/esm2022/lib/techs/raspberry/raspberry.component.mjs +1 -11
- package/esm2022/lib/techs/react/react.component.mjs +1 -11
- package/esm2022/lib/techs/redhat/redhat.component.mjs +1 -11
- package/esm2022/lib/techs/redis/redis.component.mjs +1 -11
- package/esm2022/lib/techs/ruby/ruby.component.mjs +1 -11
- package/esm2022/lib/techs/rust/rust.component.mjs +1 -11
- package/esm2022/lib/techs/safari/safari.component.mjs +1 -11
- package/esm2022/lib/techs/sass/sass.component.mjs +1 -11
- package/esm2022/lib/techs/shopify/shopify.component.mjs +1 -11
- package/esm2022/lib/techs/slackware/slackware.component.mjs +1 -11
- package/esm2022/lib/techs/snapdragon/snapdragon.component.mjs +1 -11
- package/esm2022/lib/techs/soundcloud/soundcloud.component.mjs +1 -11
- package/esm2022/lib/techs/spacex/spacex.component.mjs +1 -11
- package/esm2022/lib/techs/spotify/spotify.component.mjs +1 -11
- package/esm2022/lib/techs/springboot/springboot.component.mjs +1 -11
- package/esm2022/lib/techs/stackoverflow/stackoverflow.component.mjs +1 -11
- package/esm2022/lib/techs/steam/steam.component.mjs +1 -11
- package/esm2022/lib/techs/stylus/stylus.component.mjs +1 -11
- package/esm2022/lib/techs/supabase/supabase.component.mjs +1 -11
- package/esm2022/lib/techs/svelte/svelte.component.mjs +1 -11
- package/esm2022/lib/techs/swift/swift.component.mjs +1 -11
- package/esm2022/lib/techs/tailwind/tailwind.component.mjs +1 -11
- package/esm2022/lib/techs/techs-data.mjs +1 -283
- package/esm2022/lib/techs/telegram/telegram.component.mjs +1 -11
- package/esm2022/lib/techs/tensorflow/tensorflow.component.mjs +1 -11
- package/esm2022/lib/techs/tiktok/tiktok.component.mjs +1 -11
- package/esm2022/lib/techs/tomcat/tomcat.component.mjs +1 -11
- package/esm2022/lib/techs/tor/tor.component.mjs +1 -11
- package/esm2022/lib/techs/torrent/torrent.component.mjs +1 -11
- package/esm2022/lib/techs/tumblr/tumblr.component.mjs +1 -11
- package/esm2022/lib/techs/turbo/turbo.component.mjs +1 -11
- package/esm2022/lib/techs/typescript/typescript.component.mjs +1 -11
- package/esm2022/lib/techs/ubuntu/ubuntu.component.mjs +1 -11
- package/esm2022/lib/techs/vercel/vercel.component.mjs +1 -11
- package/esm2022/lib/techs/visualcode/visualcode.component.mjs +1 -11
- package/esm2022/lib/techs/vite/vite.component.mjs +1 -11
- package/esm2022/lib/techs/vitest/vitest.component.mjs +1 -11
- package/esm2022/lib/techs/vk/vk.component.mjs +1 -11
- package/esm2022/lib/techs/vue/vue.component.mjs +1 -11
- package/esm2022/lib/techs/webpack/webpack.component.mjs +1 -11
- package/esm2022/lib/techs/whatsapp/whatsapp.component.mjs +1 -11
- package/esm2022/lib/techs/wordpress/wordpress.component.mjs +1 -11
- package/esm2022/lib/techs/x/x.component.mjs +1 -11
- package/esm2022/lib/techs/xcode/xcode.component.mjs +1 -11
- package/esm2022/lib/techs/yandex/yandex.component.mjs +1 -11
- package/esm2022/lib/techs/youtube/youtube.component.mjs +1 -11
- package/esm2022/public-api.mjs +1 -4
- package/fesm2022/angular-techs-logos.mjs +1 -1792
- package/package.json +1 -1
- package/fesm2022/angular-techs-logos.mjs.map +0 -1
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export
|
|
2
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5ndWxhci10ZWNocy1sb2dvcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItdGVjaHMtbG9nb3Mvc3JjL2FuZ3VsYXItdGVjaHMtbG9nb3MudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSUEsY0FBYyxjQUFjLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XG4iXX0=
|
|
1
|
+
export*from"./public-api";
|
|
@@ -1,90 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { techs } from './techs/techs-data';
|
|
3
|
-
import * as i0 from "@angular/core";
|
|
4
|
-
import * as i1 from "@angular/common";
|
|
5
|
-
export class AngularTechsLogosComponent {
|
|
6
|
-
constructor() {
|
|
7
|
-
this.techs = techs;
|
|
8
|
-
this.listSignal = signal([]);
|
|
9
|
-
this.hiddenLogosSignal = signal([]);
|
|
10
|
-
this.techsList = signal(this.techs);
|
|
11
|
-
}
|
|
12
|
-
ngOnInit() {
|
|
13
|
-
if (!this.name) {
|
|
14
|
-
this.updateTechs();
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
ngOnChanges(changes) {
|
|
18
|
-
if (changes['list']) {
|
|
19
|
-
this.listSignal.set(this.list);
|
|
20
|
-
}
|
|
21
|
-
if (changes['hiddenLogos']) {
|
|
22
|
-
this.hiddenLogosSignal.set(this.hiddenLogos);
|
|
23
|
-
}
|
|
24
|
-
if (!this.name) {
|
|
25
|
-
this.updateTechs();
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
|
-
updateTechs() {
|
|
29
|
-
const currentList = this.listSignal();
|
|
30
|
-
const currentHiddenLogos = this.hiddenLogosSignal();
|
|
31
|
-
if (currentList && this.list) {
|
|
32
|
-
this.techsList.set(this.getTechs(currentList));
|
|
33
|
-
}
|
|
34
|
-
else if (currentHiddenLogos && this.hiddenLogos) {
|
|
35
|
-
this.techsList.set(this.hiddenTechs(currentHiddenLogos));
|
|
36
|
-
}
|
|
37
|
-
else {
|
|
38
|
-
this.techsList.set(this.techs);
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
techClass(name) {
|
|
42
|
-
const className = name?.toLowerCase() || '';
|
|
43
|
-
return [this.class || '', className];
|
|
44
|
-
}
|
|
45
|
-
getTech(name) {
|
|
46
|
-
return this.techs.find((item) => item.name.toLowerCase() === name.toLowerCase());
|
|
47
|
-
}
|
|
48
|
-
getTechs(items) {
|
|
49
|
-
return this.techs.filter((tech) => {
|
|
50
|
-
if (typeof tech.name !== 'string')
|
|
51
|
-
return false;
|
|
52
|
-
return items.some((item) => {
|
|
53
|
-
if (typeof item !== 'string')
|
|
54
|
-
return false;
|
|
55
|
-
return tech.name.toLowerCase() === item.toLowerCase();
|
|
56
|
-
});
|
|
57
|
-
});
|
|
58
|
-
}
|
|
59
|
-
hiddenTechs(items) {
|
|
60
|
-
return this.techs.filter((tech) => !items.includes(tech.name.toLowerCase()));
|
|
61
|
-
}
|
|
62
|
-
getIcon(name) {
|
|
63
|
-
const tech = this.getTech(name);
|
|
64
|
-
return tech ? tech.icon : null;
|
|
65
|
-
}
|
|
66
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AngularTechsLogosComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
67
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: AngularTechsLogosComponent, selector: "angular-techs-logos", inputs: { list: "list", name: "name", size: "size", label: "label", hiddenLabel: "hiddenLabel", class: "class", hiddenLogos: "hiddenLogos" }, viewQueries: [{ propertyName: "iconContainer", first: true, predicate: ["iconContainer"], descendants: true, read: ViewContainerRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"techs\" [ngClass]=\"class\">\n @if (name && getTech(name) && !list) {\n <figure\n class=\"tech-container\"\n [ngClass]=\"techClass(name)\"\n [style.width]=\"size ? size : '100px'\"\n >\n <ng-container *ngComponentOutlet=\"getIcon(name)\" />\n <figcaption [ngClass]=\"{ tooltip: hiddenLabel }\">\n {{ label ? label : getTech(name)?.name }}\n </figcaption>\n </figure>\n } @else if (!name && (list || hiddenLogos || techsList())) {\n @for (tech of techsList(); track tech.name;) {\n <figure\n class=\"tech-container\"\n [ngClass]=\"[tech.name.toLowerCase()]\"\n [style.width]=\"size ? size : '100px'\"\n [attr.key]=\"tech.name\"\n >\n <ng-container *ngComponentOutlet=\"getIcon(tech.name)\" />\n <figcaption [ngClass]=\"{ tooltip: hiddenLabel }\">\n {{ tech.name }}\n </figcaption>\n </figure>\n }\n }\n</div>\n", styles: [".techs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.techs .title{width:100%;text-align:center;margin-top:2rem}figure.tech-container{background:transparent;border:1px solid var(--vtl-background);border-radius:100px;width:120px!important;height:120px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:.3s all}figure.tech-container:hover{background:var(--vtl-background);border-color:var(--vtl-background);transform:scale(1.1)}figure.tech-container svg{height:50px;margin-bottom:.2rem}figure{position:relative;text-align:center;margin:.2rem}figure figcaption{font-size:.7rem}figure figcaption.tooltip{position:absolute;bottom:2%;background:var(--vtl-background-tooltip);box-shadow:0 4px 10px var(--vtl-shadow-tooltip);padding:.2rem .5rem;border-radius:5px;pointer-events:none;opacity:0;transition:.3s all;color:#fff}figure:hover figcaption.tooltip{opacity:1;pointer-events:all}body{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}body.darkmode{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}@media (prefers-color-scheme: light){:root{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}}@media (prefers-color-scheme: dark){:root{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
68
|
-
}
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: AngularTechsLogosComponent, decorators: [{
|
|
70
|
-
type: Component,
|
|
71
|
-
args: [{ selector: 'angular-techs-logos', encapsulation: ViewEncapsulation.None, template: "<div class=\"techs\" [ngClass]=\"class\">\n @if (name && getTech(name) && !list) {\n <figure\n class=\"tech-container\"\n [ngClass]=\"techClass(name)\"\n [style.width]=\"size ? size : '100px'\"\n >\n <ng-container *ngComponentOutlet=\"getIcon(name)\" />\n <figcaption [ngClass]=\"{ tooltip: hiddenLabel }\">\n {{ label ? label : getTech(name)?.name }}\n </figcaption>\n </figure>\n } @else if (!name && (list || hiddenLogos || techsList())) {\n @for (tech of techsList(); track tech.name;) {\n <figure\n class=\"tech-container\"\n [ngClass]=\"[tech.name.toLowerCase()]\"\n [style.width]=\"size ? size : '100px'\"\n [attr.key]=\"tech.name\"\n >\n <ng-container *ngComponentOutlet=\"getIcon(tech.name)\" />\n <figcaption [ngClass]=\"{ tooltip: hiddenLabel }\">\n {{ tech.name }}\n </figcaption>\n </figure>\n }\n }\n</div>\n", styles: [".techs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.techs .title{width:100%;text-align:center;margin-top:2rem}figure.tech-container{background:transparent;border:1px solid var(--vtl-background);border-radius:100px;width:120px!important;height:120px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:.3s all}figure.tech-container:hover{background:var(--vtl-background);border-color:var(--vtl-background);transform:scale(1.1)}figure.tech-container svg{height:50px;margin-bottom:.2rem}figure{position:relative;text-align:center;margin:.2rem}figure figcaption{font-size:.7rem}figure figcaption.tooltip{position:absolute;bottom:2%;background:var(--vtl-background-tooltip);box-shadow:0 4px 10px var(--vtl-shadow-tooltip);padding:.2rem .5rem;border-radius:5px;pointer-events:none;opacity:0;transition:.3s all;color:#fff}figure:hover figcaption.tooltip{opacity:1;pointer-events:all}body{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}body.darkmode{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}@media (prefers-color-scheme: light){:root{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}}@media (prefers-color-scheme: dark){:root{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}}\n"] }]
|
|
72
|
-
}], propDecorators: { list: [{
|
|
73
|
-
type: Input
|
|
74
|
-
}], name: [{
|
|
75
|
-
type: Input
|
|
76
|
-
}], size: [{
|
|
77
|
-
type: Input
|
|
78
|
-
}], label: [{
|
|
79
|
-
type: Input
|
|
80
|
-
}], hiddenLabel: [{
|
|
81
|
-
type: Input
|
|
82
|
-
}], class: [{
|
|
83
|
-
type: Input
|
|
84
|
-
}], hiddenLogos: [{
|
|
85
|
-
type: Input
|
|
86
|
-
}], iconContainer: [{
|
|
87
|
-
type: ViewChild,
|
|
88
|
-
args: ['iconContainer', { read: ViewContainerRef }]
|
|
89
|
-
}] } });
|
|
90
|
-
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW5ndWxhci10ZWNocy1sb2dvcy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLXRlY2hzLWxvZ29zL3NyYy9saWIvYW5ndWxhci10ZWNocy1sb2dvcy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLXRlY2hzLWxvZ29zL3NyYy9saWIvYW5ndWxhci10ZWNocy1sb2dvcy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULEtBQUssRUFJTCxTQUFTLEVBQ1QsZ0JBQWdCLEVBRWhCLGlCQUFpQixFQUNqQixNQUFNLEVBQ1AsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLEtBQUssRUFBUSxNQUFNLG9CQUFvQixDQUFDOzs7QUFRakQsTUFBTSxPQUFPLDBCQUEwQjtJQU52QztRQWtCRSxVQUFLLEdBQVcsS0FBSyxDQUFDO1FBQ3RCLGVBQVUsR0FBRyxNQUFNLENBQXVCLEVBQUUsQ0FBQyxDQUFDO1FBQzlDLHNCQUFpQixHQUFHLE1BQU0sQ0FBdUIsRUFBRSxDQUFDLENBQUM7UUFDckQsY0FBUyxHQUFHLE1BQU0sQ0FBUyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7S0FpRXhDO0lBL0RDLFFBQVE7UUFDTixJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO1lBQ2YsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ3JCLENBQUM7SUFDSCxDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLE1BQU0sQ0FBQyxFQUFFLENBQUM7WUFDcEIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQ2pDLENBQUM7UUFDRCxJQUFJLE9BQU8sQ0FBQyxhQUFhLENBQUMsRUFBRSxDQUFDO1lBQzNCLElB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LElBQUk7c0JBQVosS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFHTixhQUFhO3NCQURaLFNBQVM7dUJBQUMsZUFBZSxFQUFFLEVBQUUsSUFBSSxFQUFFLGdCQUFnQixFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBJbnB1dCxcbiAgT25Jbml0LFxuICBPbkNoYW5nZXMsXG4gIFNpbXBsZUNoYW5nZXMsXG4gIFZpZXdDaGlsZCxcbiAgVmlld0NvbnRhaW5lclJlZixcbiAgVHlwZSxcbiAgVmlld0VuY2Fwc3VsYXRpb24sXG4gIHNpZ25hbFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHsgdGVjaHMsIFRlY2ggfSBmcm9tICcuL3RlY2hzL3RlY2hzLWRhdGEnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdhbmd1bGFyLXRlY2hzLWxvZ29zJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2FuZ3VsYXItdGVjaHMtbG9nb3MuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hbmd1bGFyLXRlY2hzLWxvZ29zLmNvbXBvbmVudC5zY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG59KVxuZXhwb3J0IGNsYXNzIEFuZ3VsYXJUZWNoc0xvZ29zQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMge1xuICBASW5wdXQoKSBsaXN0OiBzdHJpbmdbXSB8IHVuZGVmaW5lZDtcbiAgQElucHV0KCkgbmFtZTogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBASW5wdXQoKSBzaXplOiBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIGhpZGRlbkxhYmVsOiBib29sZWFuIHwgdW5kZWZpbmVkO1xuICBASW5wdXQoKSBjbGFzczogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBASW5wdXQoKSBoaWRkZW5Mb2dvczogc3RyaW5nW10gfCB1bmRlZmluZWQ7XG5cbiAgQFZpZXdDaGlsZCgnaWNvbkNvbnRhaW5lcicsIHsgcmVhZDogVmlld0NvbnRhaW5lclJlZiB9KVxuICBpY29uQ29udGFpbmVyITogVmlld0NvbnRhaW5lclJlZjtcblxuICB0ZWNoczogVGVjaFtdID0gdGVjaHM7XG4gIGxpc3RTaWduYWwgPSBzaWduYWw8c3RyaW5nW10gfCB1bmRlZmluZWQ+KFtdKTtcbiAgaGlkZGVuTG9nb3NTaWduYWwgPSBzaWduYWw8c3RyaW5nW10gfCB1bmRlZmluZWQ+KFtdKTtcbiAgdGVjaHNMaXN0ID0gc2lnbmFsPFRlY2hbXT4odGhpcy50ZWNocyk7XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgaWYgKCF0aGlzLm5hbWUpIHtcbiAgICAgIHRoaXMudXBkYXRlVGVjaHMoKTtcbiAgICB9XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgaWYgKGNoYW5nZXNbJ2xpc3QnXSkge1xuICAgICAgdGhpcy5saXN0U2lnbmFsLnNldCh0aGlzLmxpc3QpO1xuICAgIH1cbiAgICBpZiAoY2hhbmdlc1snaGlkZGVuTG9nb3MnXSkge1xuICAgICAgdGhpcy5oaWRkZW5Mb2dvc1NpZ25hbC5zZXQodGhpcy5oaWRkZW5Mb2dvcyk7XG4gICAgfVxuXG4gICAgaWYgKCF0aGlzLm5hbWUpIHtcbiAgICAgIHRoaXMudXBkYXRlVGVjaHMoKTtcbiAgICB9XG4gIH1cblxuICBwcml2YXRlIHVwZGF0ZVRlY2hzKCk6IHZvaWQge1xuICAgIGNvbnN0IGN1cnJlbnRMaXN0ID0gdGhpcy5saXN0U2lnbmFsKCk7XG4gICAgY29uc3QgY3VycmVudEhpZGRlbkxvZ29zID0gdGhpcy5oaWRkZW5Mb2dvc1NpZ25hbCgpO1xuXG4gICAgaWYgKGN1cnJlbnRMaXN0ICYmIHRoaXMubGlzdCkge1xuICAgICAgdGhpcy50ZWNoc0xpc3Quc2V0KHRoaXMuZ2V0VGVjaHMoY3VycmVudExpc3QpKTtcbiAgICB9IGVsc2UgaWYgKGN1cnJlbnRIaWRkZW5Mb2dvcyAmJiB0aGlzLmhpZGRlbkxvZ29zKSB7XG4gICAgICB0aGlzLnRlY2hzTGlzdC5zZXQodGhpcy5oaWRkZW5UZWNocyhjdXJyZW50SGlkZGVuTG9nb3MpKTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy50ZWNoc0xpc3Quc2V0KHRoaXMudGVjaHMpO1xuICAgIH1cbiAgfVxuXG4gIHB1YmxpYyB0ZWNoQ2xhc3MobmFtZTogc3RyaW5nKTogc3RyaW5nW10ge1xuICAgIGNvbnN0IGNsYXNzTmFtZSA9IG5hbWU/LnRvTG93ZXJDYXNlKCkgfHwgJyc7XG4gICAgcmV0dXJuIFt0aGlzLmNsYXNzIHx8ICcnLCBjbGFzc05hbWVdO1xuICB9XG5cbiAgcHVibGljIGdldFRlY2gobmFtZTogc3RyaW5nKTogVGVjaCB8IHVuZGVmaW5lZCB7XG4gICAgcmV0dXJuIHRoaXMudGVjaHMuZmluZChcbiAgICAgIChpdGVtKSA9PiBpdGVtLm5hbWUudG9Mb3dlckNhc2UoKSA9PT0gbmFtZS50b0xvd2VyQ2FzZSgpXG4gICAgKTtcbiAgfVxuXG4gIHByaXZhdGUgZ2V0VGVjaHMoaXRlbXM6IHN0cmluZ1tdKTogVGVjaFtdIHtcbiAgICByZXR1cm4gdGhpcy50ZWNocy5maWx0ZXIoKHRlY2gpID0+IHtcbiAgICAgIGlmICh0eXBlb2YgdGVjaC5uYW1lICE9PSAnc3RyaW5nJykgcmV0dXJuIGZhbHNlO1xuICAgICAgcmV0dXJuIGl0ZW1zLnNvbWUoKGl0ZW0pID0+IHtcbiAgICAgICAgaWYgKHR5cGVvZiBpdGVtICE9PSAnc3RyaW5nJykgcmV0dXJuIGZhbHNlO1xuICAgICAgICByZXR1cm4gdGVjaC5uYW1lLnRvTG93ZXJDYXNlKCkgPT09IGl0ZW0udG9Mb3dlckNhc2UoKTtcbiAgICAgIH0pO1xuICAgIH0pO1xuICB9XG5cbiAgcHJpdmF0ZSBoaWRkZW5UZWNocyhpdGVtczogc3RyaW5nW10pOiBUZWNoW10ge1xuICAgIHJldHVybiB0aGlzLnRlY2hzLmZpbHRlcihcbiAgICAgICh0ZWNoKSA9PiAhaXRlbXMuaW5jbHVkZXModGVjaC5uYW1lLnRvTG93ZXJDYXNlKCkpXG4gICAgKTtcbiAgfVxuXG4gIHB1YmxpYyBnZXRJY29uKG5hbWU6IHN0cmluZyk6IFR5cGU8YW55PiB8IG51bGwge1xuICAgIGNvbnN0IHRlY2ggPSB0aGlzLmdldFRlY2gobmFtZSk7XG4gICAgcmV0dXJuIHRlY2ggPyB0ZWNoLmljb24gOiBudWxsO1xuICB9XG59XG4iLCI8ZGl2IGNsYXNzPVwidGVjaHNcIiBbbmdDbGFzc109XCJjbGFzc1wiPlxuICBAaWYgKG5hbWUgJiYgZ2V0VGVjaChuYW1lKSAmJiAhbGlzdCkge1xuICAgIDxmaWd1cmVcbiAgICAgIGNsYXNzPVwidGVjaC1jb250YWluZXJcIlxuICAgICAgW25nQ2xhc3NdPVwidGVjaENsYXNzKG5hbWUpXCJcbiAgICAgIFtzdHlsZS53aWR0aF09XCJzaXplID8gc2l6ZSA6ICcxMDBweCdcIlxuICAgID5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nQ29tcG9uZW50T3V0bGV0PVwiZ2V0SWNvbihuYW1lKVwiIC8+XG4gICAgICA8ZmlnY2FwdGlvbiBbbmdDbGFzc109XCJ7IHRvb2x0aXA6IGhpZGRlbkxhYmVsIH1cIj5cbiAgICAgICAge3sgbGFiZWwgPyBsYWJlbCA6IGdldFRlY2gobmFtZSk/Lm5hbWUgfX1cbiAgICAgIDwvZmlnY2FwdGlvbj5cbiAgICA8L2ZpZ3VyZT5cbiAgfSBAZWxzZSBpZiAoIW5hbWUgJiYgKGxpc3QgfHwgaGlkZGVuTG9nb3MgfHwgdGVjaHNMaXN0KCkpKSB7XG4gICAgQGZvciAodGVjaCBvZiB0ZWNoc0xpc3QoKTsgdHJhY2sgdGVjaC5uYW1lOykge1xuICAgICAgPGZpZ3VyZVxuICAgICAgICBjbGFzcz1cInRlY2gtY29udGFpbmVyXCJcbiAgICAgICAgW25nQ2xhc3NdPVwiW3RlY2gubmFtZS50b0xvd2VyQ2FzZSgpXVwiXG4gICAgICAgIFtzdHlsZS53aWR0aF09XCJzaXplID8gc2l6ZSA6ICcxMDBweCdcIlxuICAgICAgICBbYXR0ci5rZXldPVwidGVjaC5uYW1lXCJcbiAgICAgID5cbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdDb21wb25lbnRPdXRsZXQ9XCJnZXRJY29uKHRlY2gubmFtZSlcIiAvPlxuICAgICAgICA8ZmlnY2FwdGlvbiBbbmdDbGFzc109XCJ7IHRvb2x0aXA6IGhpZGRlbkxhYmVsIH1cIj5cbiAgICAgICAgICB7eyB0ZWNoLm5hbWUgfX1cbiAgICAgICAgPC9maWdjYXB0aW9uPlxuICAgICAgPC9maWd1cmU+XG4gICAgfVxuICB9XG48L2Rpdj5cbiJdfQ==
|
|
1
|
+
import{Component,Input,ViewChild,ViewContainerRef,ViewEncapsulation,signal}from"@angular/core";import{techs}from"./techs/techs-data";import*as i0 from"@angular/core";import*as i1 from"@angular/common";export class AngularTechsLogosComponent{constructor(){this.techs=techs,this.listSignal=signal([]),this.hiddenLogosSignal=signal([]),this.techsList=signal(this.techs)}ngOnInit(){this.name||this.updateTechs()}ngOnChanges(t){t.list&&this.listSignal.set(this.list),t.hiddenLogos&&this.hiddenLogosSignal.set(this.hiddenLogos),this.name||this.updateTechs()}updateTechs(){const t=this.listSignal(),e=this.hiddenLogosSignal();t&&this.list?this.techsList.set(this.getTechs(t)):e&&this.hiddenLogos?this.techsList.set(this.hiddenTechs(e)):this.techsList.set(this.techs)}techClass(t){const e=t?.toLowerCase()||"";return[this.class||"",e]}getTech(t){return this.techs.find((e=>e.name.toLowerCase()===t.toLowerCase()))}getTechs(t){return this.techs.filter((e=>"string"==typeof e.name&&t.some((t=>"string"==typeof t&&e.name.toLowerCase()===t.toLowerCase()))))}hiddenTechs(t){return this.techs.filter((e=>!t.includes(e.name.toLowerCase())))}getIcon(t){const e=this.getTech(t);return e?e.icon:null}static{this.ɵfac=i0.ɵɵngDeclareFactory({minVersion:"12.0.0",version:"18.2.0",ngImport:i0,type:AngularTechsLogosComponent,deps:[],target:i0.ɵɵFactoryTarget.Component})}static{this.ɵcmp=i0.ɵɵngDeclareComponent({minVersion:"17.0.0",version:"18.2.0",type:AngularTechsLogosComponent,selector:"angular-techs-logos",inputs:{list:"list",name:"name",size:"size",label:"label",hiddenLabel:"hiddenLabel",class:"class",hiddenLogos:"hiddenLogos"},viewQueries:[{propertyName:"iconContainer",first:!0,predicate:["iconContainer"],descendants:!0,read:ViewContainerRef}],usesOnChanges:!0,ngImport:i0,template:'<div class="techs" [ngClass]="class">\n @if (name && getTech(name) && !list) {\n <figure\n class="tech-container"\n [ngClass]="techClass(name)"\n [style.width]="size ? size : \'100px\'"\n >\n <ng-container *ngComponentOutlet="getIcon(name)" />\n <figcaption [ngClass]="{ tooltip: hiddenLabel }">\n {{ label ? label : getTech(name)?.name }}\n </figcaption>\n </figure>\n } @else if (!name && (list || hiddenLogos || techsList())) {\n @for (tech of techsList(); track tech.name;) {\n <figure\n class="tech-container"\n [ngClass]="[tech.name.toLowerCase()]"\n [style.width]="size ? size : \'100px\'"\n [attr.key]="tech.name"\n >\n <ng-container *ngComponentOutlet="getIcon(tech.name)" />\n <figcaption [ngClass]="{ tooltip: hiddenLabel }">\n {{ tech.name }}\n </figcaption>\n </figure>\n }\n }\n</div>\n',styles:[".techs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.techs .title{width:100%;text-align:center;margin-top:2rem}figure.tech-container{background:transparent;border:1px solid var(--vtl-background);border-radius:100px;width:120px!important;height:120px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:.3s all}figure.tech-container:hover{background:var(--vtl-background);border-color:var(--vtl-background);transform:scale(1.1)}figure.tech-container svg{height:50px;margin-bottom:.2rem}figure{position:relative;text-align:center;margin:.2rem}figure figcaption{font-size:.7rem}figure figcaption.tooltip{position:absolute;bottom:2%;background:var(--vtl-background-tooltip);box-shadow:0 4px 10px var(--vtl-shadow-tooltip);padding:.2rem .5rem;border-radius:5px;pointer-events:none;opacity:0;transition:.3s all;color:#fff}figure:hover figcaption.tooltip{opacity:1;pointer-events:all}body{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}body.darkmode{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}@media (prefers-color-scheme: light){:root{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}}@media (prefers-color-scheme: dark){:root{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}}\n"],dependencies:[{kind:"directive",type:i1.NgClass,selector:"[ngClass]",inputs:["class","ngClass"]},{kind:"directive",type:i1.NgComponentOutlet,selector:"[ngComponentOutlet]",inputs:["ngComponentOutlet","ngComponentOutletInputs","ngComponentOutletInjector","ngComponentOutletContent","ngComponentOutletNgModule","ngComponentOutletNgModuleFactory"]}],encapsulation:i0.ViewEncapsulation.None})}}i0.ɵɵngDeclareClassMetadata({minVersion:"12.0.0",version:"18.2.0",ngImport:i0,type:AngularTechsLogosComponent,decorators:[{type:Component,args:[{selector:"angular-techs-logos",encapsulation:ViewEncapsulation.None,template:'<div class="techs" [ngClass]="class">\n @if (name && getTech(name) && !list) {\n <figure\n class="tech-container"\n [ngClass]="techClass(name)"\n [style.width]="size ? size : \'100px\'"\n >\n <ng-container *ngComponentOutlet="getIcon(name)" />\n <figcaption [ngClass]="{ tooltip: hiddenLabel }">\n {{ label ? label : getTech(name)?.name }}\n </figcaption>\n </figure>\n } @else if (!name && (list || hiddenLogos || techsList())) {\n @for (tech of techsList(); track tech.name;) {\n <figure\n class="tech-container"\n [ngClass]="[tech.name.toLowerCase()]"\n [style.width]="size ? size : \'100px\'"\n [attr.key]="tech.name"\n >\n <ng-container *ngComponentOutlet="getIcon(tech.name)" />\n <figcaption [ngClass]="{ tooltip: hiddenLabel }">\n {{ tech.name }}\n </figcaption>\n </figure>\n }\n }\n</div>\n',styles:[".techs{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.techs .title{width:100%;text-align:center;margin-top:2rem}figure.tech-container{background:transparent;border:1px solid var(--vtl-background);border-radius:100px;width:120px!important;height:120px;text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:.3s all}figure.tech-container:hover{background:var(--vtl-background);border-color:var(--vtl-background);transform:scale(1.1)}figure.tech-container svg{height:50px;margin-bottom:.2rem}figure{position:relative;text-align:center;margin:.2rem}figure figcaption{font-size:.7rem}figure figcaption.tooltip{position:absolute;bottom:2%;background:var(--vtl-background-tooltip);box-shadow:0 4px 10px var(--vtl-shadow-tooltip);padding:.2rem .5rem;border-radius:5px;pointer-events:none;opacity:0;transition:.3s all;color:#fff}figure:hover figcaption.tooltip{opacity:1;pointer-events:all}body{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}body.darkmode{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}@media (prefers-color-scheme: light){:root{--vtl-background: rgba(0,0,0, .05);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #000;--vtl-background-svg: #000;--vtl-background-svg-invert: #fff;--vtl-background-gradient: linear-gradient(228deg, rgba(238,238,238,1) 0%, rgba(255,255,255,1) 60%)}}@media (prefers-color-scheme: dark){:root{--vtl-background: rgba(0,0,0, .5);--vtl-background-tooltip: #444;--vtl-shadow-tooltip: rgba(0,0,0,.2);--vtl-text: #fff;--vtl-background-svg: #fff;--vtl-background-svg-invert: #000;--vtl-background-gradient: linear-gradient(228deg, rgb(24, 24, 24) 0%, rgb(38, 38, 38) 60%)}}\n"]}]}],propDecorators:{list:[{type:Input}],name:[{type:Input}],size:[{type:Input}],label:[{type:Input}],hiddenLabel:[{type:Input}],class:[{type:Input}],hiddenLogos:[{type:Input}],iconContainer:[{type:ViewChild,args:["iconContainer",{read:ViewContainerRef}]}]}});
|