From a18046e78f27b95ebca64c44cf5a640f887b4ba3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jesper=20=C3=96qvist?= <jesper.oqvist@cs.lth.se> Date: Mon, 29 Jan 2018 09:51:38 +0100 Subject: [PATCH] Change package hide/show icons --- src/app/app.component.ts | 2 +- src/assets/eye_24px.svg | 77 ++++++++++++++++++++++++++++++++++ src/assets/eye_off_24px.svg | 82 +++++++++++++++++++++++++++++++++++++ 3 files changed, 160 insertions(+), 1 deletion(-) create mode 100644 src/assets/eye_24px.svg create mode 100644 src/assets/eye_off_24px.svg diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 1b084c3..4280662 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -27,7 +27,7 @@ import { Location } from '@angular/common'; <div class="package"><b>{{package.name}}</b></div> <ng-template ngFor let-group [ngForOf]="package.groups"> <div *ngIf="filteredGroup(group)"> - <div class="group" (click)="group.hidden = !group.hidden">{{typeKindNames[group.kind]}}<img src="assets/vdots_24px.svg" *ngIf="!group.hidden"><img src="assets/hdots_24px.svg" *ngIf="group.hidden"></div> + <div class="group" (click)="group.hidden = !group.hidden">{{typeKindNames[group.kind]}}<img src="assets/eye_24px.svg" *ngIf="!group.hidden"><img src="assets/eye_off_24px.svg" *ngIf="group.hidden"></div> <ul class="types" [hidden]="group.hidden"> <li *ngFor="let type of group.members | nameFilter:filter" class="type" [class.selected]="type.id === selectedType" diff --git a/src/assets/eye_24px.svg b/src/assets/eye_24px.svg new file mode 100644 index 0000000..7f72f51 --- /dev/null +++ b/src/assets/eye_24px.svg @@ -0,0 +1,77 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="24" + height="24" + viewBox="0 0 24 24" + id="svg2" + version="1.1" + inkscape:version="0.91 r" + sodipodi:docname="eye_24px.svg"> + <defs + id="defs4" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="24.527766" + inkscape:cx="11.780135" + inkscape:cy="8.3188377" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="false" + inkscape:snap-global="true" + units="px" + inkscape:window-width="1267" + inkscape:window-height="1349" + inkscape:window-x="134" + inkscape:window-y="811" + inkscape:window-maximized="0" /> + <metadata + id="metadata7"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title /> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(0,-1028.3622)"> + <g + id="g4597" + transform="matrix(0.76805241,0,0,0.76805241,-0.5560555,244.10111)" + style="stroke:#999999;stroke-width:1.87186503;stroke-miterlimit:4;stroke-dasharray:none"> + <ellipse + ry="5.4657755" + rx="5.5792518" + cy="1036.822" + cx="16.122522" + id="path4593" + style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#666666;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.87186503;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" /> + <path + sodipodi:nodetypes="cscsc" + inkscape:connector-curvature="0" + id="path4595" + d="m 2.1079426,1038.3458 c 4.8242173,-5.2199 7.371697,-9.1847 14.5869894,-9.1847 5.808547,0 9.679104,4.5766 13.874059,8.5217 -4.980141,4.242 -8.935255,6.6112 -14.27674,6.6112 -6.3462725,0 -9.3581516,-2.2494 -14.1843084,-5.9482 z" + style="fill:none;fill-rule:evenodd;stroke:#666666;stroke-width:1.87186503;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + </g> + </g> +</svg> diff --git a/src/assets/eye_off_24px.svg b/src/assets/eye_off_24px.svg new file mode 100644 index 0000000..622ab30 --- /dev/null +++ b/src/assets/eye_off_24px.svg @@ -0,0 +1,82 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="24" + height="24" + viewBox="0 0 24 24" + id="svg2" + version="1.1" + inkscape:version="0.91 r" + sodipodi:docname="eye_off_24px.svg"> + <defs + id="defs4" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="24.527766" + inkscape:cx="12.412072" + inkscape:cy="10.765045" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="false" + inkscape:snap-global="true" + units="px" + inkscape:window-width="1267" + inkscape:window-height="1349" + inkscape:window-x="52" + inkscape:window-y="1012" + inkscape:window-maximized="0" /> + <metadata + id="metadata7"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title></dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(0,-1028.3622)"> + <path + style="fill:none;fill-rule:evenodd;stroke:#666666;stroke-width:1.5;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;stroke-miterlimit:4;stroke-dasharray:none" + d="m 4.6477938,1031.6917 14.9626342,17.8981" + id="path5311" + inkscape:connector-curvature="0" /> + <g + id="g4597-0" + transform="matrix(0.76805241,0,0,0.76805241,-0.5560555,244.10111)" + style="stroke:#999999;stroke-width:1.87186503;stroke-miterlimit:4;stroke-dasharray:none"> + <ellipse + ry="5.4657755" + rx="5.5792518" + cy="1036.822" + cx="16.122522" + id="path4593-4" + style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#666666;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1.87186503;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate" /> + <path + sodipodi:nodetypes="cscsc" + inkscape:connector-curvature="0" + id="path4595-8" + d="m 2.1079426,1038.3458 c 4.8242173,-5.2199 7.371697,-9.1847 14.5869894,-9.1847 5.808547,0 9.679104,4.5766 13.874059,8.5217 -4.980141,4.242 -8.935255,6.6112 -14.27674,6.6112 -6.3462725,0 -9.3581516,-2.2494 -14.1843084,-5.9482 z" + style="fill:none;fill-rule:evenodd;stroke:#666666;stroke-width:1.87186503;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> + </g> + </g> +</svg> -- GitLab