diff options
Diffstat (limited to 'demo/components/tiles.html')
| -rw-r--r-- | demo/components/tiles.html | 105 |
1 files changed, 105 insertions, 0 deletions
diff --git a/demo/components/tiles.html b/demo/components/tiles.html new file mode 100644 index 0000000..3519817 --- /dev/null +++ b/demo/components/tiles.html @@ -0,0 +1,105 @@ +<div class='component'>Tiles</div> + +<h3>VSP Tile</h3> +<p> + Example +</p> +<div class="catalog-tile tile software-product-type sdc-code" data-test-id="software-product-type"> + <div class="catalog-tile-top item-details"> + <div class="catalog-tile-type software-product-type">VSP</div> + <div class="catalog-tile-icon software-product-type"> + <div class="icon"> + <div class="svg-icon-wrapper bottom"> + <svg class="svg-icon vsp "> + <use href="./gen/assets/icons/vsp.svg#vsp_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/vsp.svg#vsp_icon"></use> + </svg> + </div> + </div> + </div> + <div class="catalog-tile-entity-details"> + <div> + <div class="catalog-tile-vendor-name">vlm</div> + </div> + <div> + <div class="catalog-tile-item-name">lilach vsp</div> + </div> + <div class="catalog-tile-version-info"> + <div class="catalog-tile-item-version" data-test-id="catalog-item-version">V 0.1</div> + </div> + </div> + <div class="catalog-tile-content software-product-type"> + <div class="catalog-tile-locking-user-name">Checked Out</div> + <div class="catalog-tile-check-in-status"> + <div data-test-id="catalog-item-checked-out" class="svg-icon-wrapper bottom"> + <svg class="svg-icon unlocked "> + <use href="./gen/assets/icons/unlocked.svg#unlocked_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/unlocked.svg#unlocked_icon"></use> + </svg> + </div> + </div> + </div> + </div> +</div> + +<h3>VLM Tile</h3> +<div class="catalog-tile tile license-model-type sdc-code" data-test-id="license-model-type"> + <div class="catalog-tile-top item-details"> + <div class="catalog-tile-type license-model-type">VLM</div> + <div class="catalog-tile-icon license-model-type"> + <div class="icon"> + <div class="svg-icon-wrapper bottom"> + <svg class="svg-icon vlm "> + <use href="./gen/assets/icons/vlm.svg#vlm_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/vlm.svg#vlm_icon"></use> + </svg> + </div> + </div> + </div> + <div class="catalog-tile-entity-details"> + <div> + <div class="catalog-tile-vendor-name"></div> + </div> + <div> + <div class="catalog-tile-item-name">vlm</div> + </div> + <div class="catalog-tile-version-info"> + <div class="catalog-tile-item-version" data-test-id="catalog-item-version">V 0.2</div> + </div> + </div> + <div class="catalog-tile-content license-model-type"> + <div class="catalog-tile-locking-user-name">Checked In</div> + <div class="catalog-tile-check-in-status"> + <div data-test-id="catalog-item-checked-in" class="svg-icon-wrapper bottom"> + <svg class="svg-icon locked "> + <use href="./gen/assets/icons/locked.svg#locked_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/locked.svg#locked_icon"></use> + </svg> + </div> + </div> + </div> + </div> +</div> + +<h3>Vendor Tile</h3> +<div class="catalog-tile tile vendor-type sdc-code" data-test-id="vendor-type"> + <div class="catalog-tile-top"> + <div class="catalog-tile-icon vendor-type"> + <div class="icon"> + <div class="svg-icon-wrapper bottom"> + <svg class="svg-icon vendor "> + <use href="./gen/assets/icons/vendor.svg#vendor_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/vendor.svg#vendor_icon"></use> + </svg> + </div> + </div> + </div> + <div class="catalog-tile-item-name">vlm</div> + <div class="catalog-tile-vsp-count clickable" data-test-id="catalog-vsp-count">1 VSPs</div> + <div class="catalog-tile-content" data-test-id="catalog-create-new-vsp-from-vendor"> + <div class="create-new-vsp-button"> + <div class="svg-icon-wrapper bottom"> + <svg class="svg-icon plus "> + <use href="./gen/assets/icons/plus.svg#plus_icon" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="./assets/icons/plus.svg#plus_icon"></use> + </svg> + </div> + Create new VSP + </div> + </div> + </div> +</div> |