@arup-ri/velcro 0.0.7 → 0.0.8

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.
Files changed (2) hide show
  1. package/dist/velcro.css +1 -1
  2. package/package.json +1 -1
package/dist/velcro.css CHANGED
@@ -1 +1 @@
1
- *,:after,:before{box-sizing:border-box}body,h1,h2,h3,ol,p,ul{margin:0;padding:0}:root{--black-100:#0f0f0f;--grey-100:#7a7a7a;--grey-80:#d9d9dd;--grey-60:#f9fbfc;--white-100:#fff;--red-100:#a12f32;--red-80:#be5f60;--red-60:#d78c90;--red-40:#ecbabe;--red-20:#ffe9ec;--yellow-100:#dca227;--yellow-80:#e3ba5c;--yellow-60:#ebd08b;--yellow-40:#f4e6ba;--yellow-20:#fffbeb;--pink-100:#ff3d84;--pink-80:#ff76a5;--pink-60:#ffa3c4;--pink-40:#ffcbdf;--pink-20:#fff2f7;--blue-100:#1461c8;--blue-80:#6282d6;--blue-60:#93a6e4;--blue-40:#c1cbf2;--blue-20:#eef1ff;--teal-100:#00a79a;--teal-80:#5dbdb3;--teal-60:#8fd3cc;--teal-40:#bee9e4;--teal-20:#ebfffd;--green-100:#007552;--green-80:#509576;--green-60:#85b59c;--green-40:#b8d6c5;--green-20:#ebf7f0;--purple-100:#53099b;--purple-80:#8b47ae;--purple-60:#b77ec3;--purple-40:#ddb8dc;--purple-20:#fbf6fa;--font-sans:"Roboto",sans-serif;--font-size-base:16px}body{color:var(--black-100);font-family:var(--font-sans);font-size:var(--font-size-base);line-height:auto}h1{font-size:24px}h2{font-size:20px}h3{font-size:16px}p{font-size:12px}.velcro-badge{align-items:center;border-radius:50px;cursor:default;display:inline-flex;font-size:14px;gap:.4em;line-height:1;margin:.15em;padding:10px 8px;transition:background .2s ease,color .2s ease}a{color:var(--grey-100);text-decoration:none}.breadcrumbs{align-items:center;display:flex;font-size:12px;gap:5px}.breadcrumb-separator{align-items:center;color:var(--black-100);display:flex}.breadcrumb-copy{align-items:center;background:none;border:none;color:var(--grey-100);cursor:pointer;display:flex;margin-left:5px;padding:0;transition:color .2s ease}.breadcrumb-copy.copied,.breadcrumb-copy:hover{color:var(--black-100)}button{align-items:center;background-color:var(--black-100);border:0;border:1px solid var(--black-100);border-radius:50%;border-radius:50px;color:var(--white-100);cursor:pointer;display:flex;font-family:var(--font-sans);font-size:14px;justify-content:center;padding:10px}.velcro-card{border:1px solid var(--grey-100);border-radius:8px;box-sizing:border-box;color:var(--black-100);display:flex;gap:1rem;padding:1.5rem;position:relative}.velcro-card--vertical{min-height:360px;min-width:360px;padding-top:3.5rem}.velcro-card--horizontal{flex-direction:row;justify-content:space-between;min-height:90px;min-width:-moz-max-content;min-width:max-content;width:-moz-fit-content;width:fit-content}.velcro-card--header{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.velcro-card--horizontal .velcro-card--header{align-items:center;flex-direction:row;gap:3rem;margin-top:0}.velcro-card--tags{display:flex;flex-wrap:wrap;gap:.5rem}.velcro-card--vertical .velcro-card--tags{margin-left:auto;margin-top:auto}.velcro-card--horizontal .velcro-card--tags{margin-left:auto;margin-right:1rem}.velcro-card--actions{align-items:center;display:flex;gap:.5rem}.velcro-card--vertical{display:flex;flex-direction:column;padding-top:3rem;position:relative}.velcro-card--vertical>.velcro-card--actions,.velcro-card--vertical>.velcro-card--checkbox{position:absolute;top:1rem}.velcro-card--vertical>.velcro-card--checkbox{left:1rem}.velcro-card--vertical>.velcro-card--actions{right:1rem}.velcro-card--horizontal{align-items:center;display:flex}.velcro-card--horizontal .velcro-card--actions{display:flex;gap:.5rem}.velcro-dropdown{border-radius:50px;cursor:pointer;font-size:14px;gap:.4em;line-height:1;margin:.15em;padding:10px;position:relative;transition:background .2s ease,color .2s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none}.velcro-dropdown,.velcro-dropdown-icon{align-items:center;display:inline-flex}.velcro-dropdown-menu{border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);display:none;left:0;min-width:100%;padding:4px 0;position:absolute;top:120%;z-index:10}.velcro-dropdown.open .velcro-dropdown-menu{display:block}.velcro-dropdown-option{cursor:pointer;padding:8px 12px;white-space:nowrap}.velcro-dropdown-option:hover{background:rgba(0,0,0,.05)}.velcro-form{display:flex;flex-direction:column;font-family:var(--font-sans);gap:1rem;max-width:400px}.velcro-form label{color:var(--black-100);font-size:16px;margin-bottom:.25rem}.velcro-form input,.velcro-form select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:var(--white-100);border:1px solid var(--grey-100);border-radius:6px;color:var(--black-100);font-size:16px;padding:.5rem .75rem;transition:border-color .2s,box-shadow .2s,background-color .2s;width:100%}.velcro-form select{background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='10' viewBox='0 0 24 24' width='10' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-position:right .75rem center;background-repeat:no-repeat;background-size:.8rem;cursor:pointer;padding-right:2rem}.velcro-form--inline-group{display:flex;gap:1rem}.velcro-form--inline-group>div{display:flex;flex:1;flex-direction:column}.velcro-form input.invalid,.velcro-form select.invalid{border-color:var(--red-100)}.velcro-nav{background:var(--black-100);color:var(--white-100);height:100vh;position:relative;width:80px}.velcro-nav--hamburger{background:none;border:none;color:var(--white-100);cursor:pointer;font-size:32px;left:.5em;position:absolute;top:.5em;z-index:5}.velcro-nav.open .velcro-nav--hamburger{display:none}.velcro-nav--close{background:none;border:none;color:var(--white-100);cursor:pointer;font-size:32px;left:.5em;position:absolute;top:.5em;z-index:20}.velcro-nav:not(.open) .velcro-nav--close{display:none}.velcro-nav--panel{background:var(--black-100);box-sizing:border-box;height:100%;left:0;overflow:hidden;padding:0;position:absolute;top:0;transition:width .35s ease;width:0;z-index:10}.velcro-nav.open .velcro-nav--panel{padding:40px 30px;width:320px}.velcro-nav:not(.open) .velcro-nav--panel-content{opacity:0;pointer-events:none;transition:opacity 0s linear}.velcro-nav.open .velcro-nav--panel-content{opacity:1;transition:opacity .15s ease-in}.velcro-nav--items{list-style:none;margin:0;padding:2em 0 0}.velcro-nav--user{bottom:1em;left:1em;position:absolute}.velcro-table{border-collapse:collapse;font-family:var(--font-sans);font-size:12px;width:100%}.velcro-table thead th{color:var(--grey-100);font-weight:400;text-align:left;white-space:nowrap}.velcro-table tbody td,.velcro-table thead th{border-bottom:1px solid var(--grey-80);padding:12px 16px}.velcro-table tbody td{color:var(--black-100);vertical-align:middle}.velcro-table tbody tr:last-child td{border-bottom:none}.velcro-table tbody tr.selected,.velcro-table tbody tr:hover{background-color:var(--grey-60)}.velcro-table tbody tr{cursor:pointer}.velcro-table td.text-center,.velcro-table th.text-center{text-align:center}.velcro-table td.text-right,.velcro-table th.text-right{text-align:right}.velcro-table .cell-shrink{white-space:nowrap;width:1%}.velcro-table .cell-expand{width:100%}.velcro-table .cell-actions{white-space:nowrap}.velcro-table .cell-actions>*{margin-left:8px}.velcro-table .cell-actions>:first-child{margin-left:0}.velcro-table .cell-icon{color:var(--grey-100);cursor:pointer;padding-right:8px;width:1%}.velcro-table .cell-icon:hover{color:var(--black-100)}.velcro-table .cell-status{white-space:nowrap;width:1%}.velcro-table-link{color:var(--teal-100);cursor:pointer;font-weight:400;text-decoration:none}.velcro-table-link:hover{text-decoration:underline}.velcro-table-link--danger{color:var(--red-100)}.velcro-table-toggle-wrapper{align-items:center;display:inline-flex;gap:8px}.velcro-table-toggle-label{color:var(--black-100);font-size:14px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.velcro-table-toggle-label--danger{color:var(--red-100)}.velcro-table-toggle{display:inline-block;flex-shrink:0;height:20px;position:relative;width:36px}.velcro-table-toggle input{height:0;opacity:0;width:0}.velcro-table-toggle-slider{background-color:var(--teal-40);border-radius:20px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:.3s}.velcro-table-toggle-slider:before{background-color:var(--teal-100);border-radius:50%;bottom:3px;content:"";height:14px;left:3px;position:absolute;transition:.3s;width:14px}.velcro-table-toggle input:checked+.velcro-table-toggle-slider{background-color:var(--teal-100)}.velcro-table-toggle input:checked+.velcro-table-toggle-slider:before{background-color:var(--teal-20);transform:translateX(16px)}.velcro-table-wrapper{overflow-x:auto;width:100%}.text-center{text-align:center!important}.font-bold{font-weight:700!important}.primary{background:var(--black-100)!important;border:1px solid var(--black-100)!important;color:var(--white-100)!important}.secondary{background:var(--grey-80)!important;border:1px solid var(--grey-80)!important}.secondary,.tertiary{color:var(--black-100)!important}.tertiary{background:var(--white-100)!important;border:1px solid var(--black-100)!important}.filled--red4{background:var(--red-100)!important}.filled--red3,.filled--red4{color:var(--red-20)!important}.filled--red3{background:var(--red-80)!important}.filled--red2{background:var(--red-40)!important}.filled--red1,.filled--red2{color:var(--red-100)!important}.filled--red1{background:var(--red-20)!important}.filled--pink4{background:var(--pink-100)!important}.filled--pink3,.filled--pink4{color:var(--pink-20)!important}.filled--pink3{background:var(--pink-80)!important}.filled--pink2{background:var(--pink-40)!important}.filled--pink1,.filled--pink2{color:var(--pink-100)!important}.filled--pink1{background:var(--pink-20)!important}.filled--yellow4{background:var(--yellow-100)!important;color:var(--yellow-20)!important}.filled--yellow3{background:var(--yellow-80)!important;color:var(--yellow-20)!important}.filled--yellow2{background:var(--yellow-40)!important;color:var(--yellow-100)!important}.filled--yellow1{background:var(--yellow-20)!important;color:var(--yellow-100)!important}.filled--green4{background:var(--green-100)!important;color:var(--green-20)!important}.filled--green3{background:var(--green-80)!important;color:var(--green-20)!important}.filled--green2{background:var(--green-40)!important}.filled--green1,.filled--green2{color:var(--green-100)!important}.filled--green1{background:var(--green-20)!important}.filled--teal4{background:var(--teal-100)!important}.filled--teal3,.filled--teal4{color:var(--teal-20)!important}.filled--teal3{background:var(--teal-80)!important}.filled--teal2{background:var(--teal-40)!important}.filled--teal1,.filled--teal2{color:var(--teal-100)!important}.filled--teal1{background:var(--teal-20)!important}.filled--blue4{background:var(--blue-100)!important}.filled--blue3,.filled--blue4{color:var(--blue-20)!important}.filled--blue3{background:var(--blue-80)!important}.filled--blue2{background:var(--blue-40)!important}.filled--blue1,.filled--blue2{color:var(--blue-100)!important}.filled--blue1{background:var(--blue-20)!important}.filled--purple4{background:var(--purple-100)!important;color:var(--purple-20)!important}.filled--purple3{background:var(--purple-80)!important;color:var(--purple-20)!important}.filled--purple2{background:var(--purple-40)!important;color:var(--purple-100)!important}.filled--purple1{background:var(--purple-20)!important;color:var(--purple-100)!important}
1
+ *,:after,:before{box-sizing:border-box}body,h1,h2,h3,ol,p,ul{margin:0;padding:0}:root{--black-100:#0f0f0f;--grey-100:#7a7a7a;--grey-80:#d9d9dd;--grey-60:#f9fbfc;--white-100:#fff;--red-100:#d50000;--red-80:#f86b6b;--red-60:#fc7a7d;--red-40:#ffb6bf;--red-20:#ffdbe2;--yellow-100:#dca227;--yellow-80:#e3ba5c;--yellow-60:#ebd08b;--yellow-40:#f4e6ba;--yellow-20:#fffbeb;--pink-100:#ff3d84;--pink-80:#ff76a5;--pink-60:#ffa3c4;--pink-40:#ffcbdf;--pink-20:#fff2f7;--blue-100:#1461c8;--blue-80:#6282d6;--blue-60:#93a6e4;--blue-40:#c1cbf2;--blue-20:#eef1ff;--teal-100:#00a79a;--teal-80:#5dbdb3;--teal-60:#8fd3cc;--teal-40:#bee9e4;--teal-20:#ebfffd;--green-100:#007552;--green-80:#509576;--green-60:#85b59c;--green-40:#b8d6c5;--green-20:#ebf7f0;--purple-100:#53099b;--purple-80:#8b47ae;--purple-60:#b77ec3;--purple-40:#ddb8dc;--purple-20:#fbf6fa;--font-sans:"Roboto",sans-serif;--font-size-base:12px}body{color:var(--black-100);font-family:var(--font-sans);font-size:var(--font-size-base);line-height:auto}h1{font-size:24px}h2{font-size:20px}h3{font-size:16px}p{font-size:12px}.velcro-badge{align-items:center;border-radius:50px;cursor:default;display:inline-flex;font-size:var(--font-size-base);gap:.25rem;justify-content:center;line-height:1;margin:.15em;padding:8px}a{color:var(--grey-100);text-decoration:none}.breadcrumbs{align-items:center;display:flex;font-size:var(--base-font-size);gap:5px}.breadcrumb-separator{align-items:center;color:var(--black-100);display:flex}.breadcrumb-copy{align-items:center;background:none;border:none;color:var(--grey-100);cursor:pointer;display:flex;margin-left:5px;padding:0;transition:color .2s ease}.breadcrumb-copy.copied,.breadcrumb-copy:hover{color:var(--black-100)}button{background-color:var(--black-100);border:0;border:1px solid var(--black-100);border-radius:50%;border-radius:50px;color:var(--white-100);cursor:pointer;font-family:var(--font-sans);font-size:var(--font-size-base);gap:.25rem;padding:8px}button,button span{align-items:center;display:flex;justify-content:center;line-height:1}.velcro-card{background:var(--white-100);border:1px solid var(--grey-80);border-radius:10px;cursor:pointer;display:flex;flex-direction:column;margin:1rem;min-height:0;overflow:hidden}.velcro-card.selected{background:var(--blue-20);border:1px solid var(--blue-100)}.velcro-card.selected .velcro-card-header{background:var(--blue-20);border-bottom-color:var(--blue-100)}.velcro-card.selected .velcro-card-body{background:var(--blue-20)}.velcro-card-header{align-items:center;border-bottom:1px solid var(--grey-80);display:flex;flex-shrink:0;gap:1rem;justify-content:space-between;padding:1rem}.velcro-card-actions{align-items:center;display:flex;gap:.5rem}.velcro-card-actions button{align-items:center;background:none;border:none;color:var(--grey-100);cursor:pointer;display:inline-flex;gap:.25rem;padding:.5rem}.velcro-card-body{display:flex;flex:1;flex-direction:column;min-height:0;min-width:0;overflow-y:auto;padding:1rem}.velcro-card--scroll .velcro-card-body{overflow-y:auto}.velcro-card--fit .velcro-card-body{overflow:visible}.velcro-card--tags{align-self:flex-end;display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.velcro-card-body--scroll-demo{max-height:300px;overflow:auto}.velcro-form{display:flex;flex-direction:column;font-family:var(--font-sans);gap:1rem;max-width:400px}.velcro-form label{color:var(--black-100);font-size:var(--font-size-base);margin-bottom:.25rem}.velcro-form input,.velcro-form select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:var(--white-100);border:1px solid var(--grey-80);border-radius:6px;color:var(--black-100);font-size:var(--font-size-base);padding:.5rem .75rem;transition:border-color .2s,box-shadow .2s,background-color .2s;width:100%}.velcro-form select{background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='10' viewBox='0 0 24 24' width='10' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-position:right .75rem center;background-repeat:no-repeat;background-size:.8rem;cursor:pointer;padding-right:2rem}.velcro-form--inline-group{display:flex;gap:1rem}.velcro-form--inline-group>div{display:flex;flex:1;flex-direction:column}.velcro-form input.invalid,.velcro-form select.invalid{border-color:var(--red-100)}.velcro-form-inputs-container{display:flex;flex-direction:column;gap:2rem;padding:2rem}.velcro-form-section{margin-bottom:1rem}.velcro-form-section h3{margin-bottom:1rem;margin-top:0}.velcro-form-fields{align-items:center;display:grid;gap:.5rem;grid-template-columns:1fr 1fr auto}.velcro-form-fields-container{display:contents}.velcro-form-container{display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem}.velcro-form-field-group{display:flex;flex-direction:column;gap:.25rem}.velcro-form-field-group label{font-weight:700}.velcro-form-field-group input,.velcro-form-field-group select{background-color:#f9fbfc;border:1px solid #d9d9dd;border-radius:4px;padding:.75rem}.velcro-form-field-group select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='10' viewBox='0 0 24 24' width='10' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");background-position:right .75rem center;background-repeat:no-repeat;background-size:.8rem;cursor:pointer;padding-right:2rem}.velcro-form-tab-grid{display:grid;gap:1rem;grid-template-columns:1fr 1fr}.velcro-form-date-group{display:flex;flex-direction:column;gap:.25rem}.velcro-form-date-group label{font-weight:700}.velcro-form-date-group input{background-color:#f9fbfc;border:1px solid #d9d9dd;border-radius:4px;padding:.75rem}.velcro-form-button-group{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1rem}.velcro-form-button-group button{width:-moz-fit-content;width:fit-content}.velcro-form-tab-box-grid{display:flex;gap:1rem}.velcro-drop-zone{background-color:var(--grey-20);border:2px dashed var(--grey-80);border-radius:8px;cursor:pointer;padding:2rem;text-align:center;transition:all .2s ease}.velcro-drop-zone:hover{background-color:var(--grey-50);border-color:var(--grey-100)}.velcro-drop-zone.dragover{background-color:var(--blue-20);border-color:var(--blue-100)}.velcro-drop-zone p{color:var(--grey-100);margin:0}.velcro-drop-zone input[type=file]{display:none}.velcro-tab-box{align-items:center;display:flex;flex:1;gap:.5rem}.velcro-tab-box input[type=radio]{display:none}.velcro-tab-box label{background-color:var(--white-100);border:1px solid var(--blue-100);border-radius:6px;color:var(--blue-100);cursor:pointer;flex:1;font-weight:400;margin:0;padding:.5rem 1rem;text-align:center;transition:all .2s ease}.velcro-tab-box label:hover{background-color:var(--blue-20)}.velcro-tab-box input[type=radio]:checked+label,.velcro-tab-box.selected label{background-color:var(--blue-100);color:var(--blue-20)}.velcro-nav{background:var(--black-100);color:var(--grey-20);height:100vh;position:relative;width:80px}velcro-nav--items a{background:none;border:none;color:var(--grey-100);cursor:pointer;font-size:var(--font-size-base);padding:0;text-decoration:none}velcro-nav--items a:hover{color:var(--white-100)}velcro-nav--items a:active{color:var(--white-100);text-decoration:underline}.velcro-nav--hamburger{background:none;border:none;color:var(--white-100);cursor:pointer;font-size:32px;left:.5em;position:absolute;top:.5em;z-index:5}.velcro-nav.open .velcro-nav--hamburger{display:none}.velcro-nav--close{background:none;border:none;color:var(--white-100);cursor:pointer;font-size:32px;left:.5em;position:absolute;top:.5em;z-index:20}.velcro-nav:not(.open) .velcro-nav--close{display:none}.velcro-nav--panel{background:var(--black-100);box-sizing:border-box;height:100%;left:0;overflow:hidden;padding:0;position:absolute;top:0;transition:width .35s ease;width:0;z-index:10}.velcro-nav.open .velcro-nav--panel{padding:40px 30px;width:320px}.velcro-nav:not(.open) .velcro-nav--panel-content{opacity:0;pointer-events:none;transition:opacity 0s linear}.velcro-nav.open .velcro-nav--panel-content{opacity:1;transition:opacity .15s ease-in}.velcro-nav--items{list-style:none;margin:0;padding:2em 0 0}.velcro-nav--link{background:none;border:none;cursor:pointer;display:block;font-size:var(--font-size-base);padding:.5rem 0;text-decoration:none;transition:color .2s ease}.velcro-nav--link,.velcro-nav--link:hover{color:var(--white-100)}.velcro-nav--link.active{border-bottom:2px solid var(--white-100);color:var(--white-100)}.velcro-nav--user{bottom:1em;left:1em;position:absolute}.velcro-table{border-collapse:collapse;font-family:var(--font-sans);font-size:12px;width:100%}.velcro-table thead th{color:var(--grey-100);font-weight:400;text-align:left;white-space:nowrap}.velcro-table tbody td,.velcro-table thead th{border-bottom:1px solid var(--grey-80);padding:12px 16px}.velcro-table tbody td{color:var(--black-100);vertical-align:middle}.velcro-table tbody tr:last-child td{border-bottom:none}.velcro-table tbody tr.selected,.velcro-table tbody tr:hover{background-color:var(--grey-60)}.velcro-table td.text-center,.velcro-table th.text-center{text-align:center}.velcro-table td.text-right,.velcro-table th.text-right{text-align:right}.velcro-table .cell-shrink{white-space:nowrap;width:1%}.velcro-table .cell-expand{width:100%}.velcro-table .cell-actions{white-space:nowrap}.velcro-table .cell-actions>*{margin-left:8px}.velcro-table .cell-actions>:first-child{margin-left:0}.velcro-table .cell-icon{color:var(--grey-100);cursor:pointer;padding-right:8px;width:1%}.velcro-table .cell-icon:hover{color:var(--black-100)}.velcro-table .cell-status{white-space:nowrap;width:1%}.velcro-table-link{color:var(--teal-100);cursor:pointer;font-weight:400;text-decoration:none}.velcro-table-link:hover{text-decoration:underline}.velcro-table-link--danger{color:var(--red-100)}.velcro-table-scroll{flex:1;min-height:0;min-width:0;overflow-x:hidden;overflow-y:auto}.velcro-table-wrapper{overflow-x:auto;width:100%}.velcro-header{align-items:center;border-bottom:1px solid var(--grey-80);display:flex;flex-shrink:0;justify-content:space-between;padding:1rem}.velcro-header-left{align-items:center;display:flex;gap:.5rem}.velcro-header nav{align-items:center;display:flex;gap:1em}.velcro-header nav .link-button,.velcro-header nav a{background:none;border:none;color:var(--grey-100);cursor:pointer;font-size:var(--font-size-base);padding:0;text-decoration:none}.velcro-header nav .link-button:hover,.velcro-header nav a:hover{color:var(--black-100)}.velcro-header nav .link-button.active,.velcro-header nav a.active{color:var(--black-100);text-decoration:underline}.velcro-grid{display:grid;flex:1;grid-template-columns:1fr 1fr;min-height:0;position:relative;--divider-pos:0.5}.velcro-grid:before{background:var(--grey-80);bottom:0;content:"";left:calc(100%*var(--divider-pos));pointer-events:none;position:absolute;top:0;width:1px}.velcro-grid--50-50{grid-template-columns:1fr 1fr;--divider-pos:0.5}.velcro-grid--40-60{grid-template-columns:.4fr .6fr;--divider-pos:0.4}.velcro-grid--60-40{grid-template-columns:.6fr .4fr;--divider-pos:0.6}.velcro-grid--30-70{grid-template-columns:.3fr .7fr;--divider-pos:0.3}.velcro-column-fit{display:flex;flex-direction:column;min-height:0;overflow:hidden}.velcro-column-fit>.velcro-card{flex:1 1 0;min-height:0}.velcro-column-fit>.velcro-card .velcro-card-body{overflow-y:auto}.velcro-column-fit>.velcro-card:only-child{flex:1 1 0}.velcro-column-scroll{display:flex;flex-direction:column;min-height:0;overflow-y:auto}.velcro-column-scroll>.velcro-card{flex:0 0 auto}.velcro-column-scroll>.velcro-card .velcro-card-body{overflow:visible}.velcro-modal{align-items:center;display:flex;inset:0;justify-content:center;position:fixed;z-index:2000}.velcro-modal-overlay{background-color:rgba(0,0,0,.5);inset:0;position:absolute}.velcro-modal-content{background-color:var(--white-100);border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,.2);display:flex;flex-direction:column;max-height:70vh;max-width:70vw;position:relative}.velcro-modal-header{gap:1rem;justify-content:space-between;padding:1.5rem}.velcro-modal-close,.velcro-modal-header{align-items:center;display:flex;flex-shrink:0}.velcro-modal-close{background:none;border:none;border-radius:4px;color:var(--grey-100);cursor:pointer;font-size:1.5rem;height:2rem;justify-content:center;padding:0;transition:background-color .2s ease;width:2rem}.velcro-modal-close:hover{background-color:var(--grey-60)}.velcro-modal-body{flex:1;overflow-y:auto;padding:1.5rem}.velcro-modal-header h2{margin:0}.velcro-modal-footer{display:flex;gap:.5rem;justify-content:flex-end;padding:1.5rem}.velcro-search-pill{align-items:center;background:transparent;border:1px solid var(--grey-80);border-radius:9999px;display:flex;padding:.75rem 1.25rem}.velcro-search-pill input{background:transparent;border:none;color:var(--black-100);flex:1;font-size:var(--base-font-size);outline:none;text-align:left}.velcro-search-pill input::-moz-placeholder{color:var(--grey-80)}.velcro-search-pill input::placeholder{color:var(--grey-80)}.velcro-search-icon{margin-left:auto}.caption,.caption-italic,.velcro-search-icon{color:var(--grey-80)}.caption-italic{font-style:italic}.primary{background:var(--black-100)!important;border:1px solid var(--black-100)!important;color:var(--white-100)!important}.secondary{background:var(--grey-80)!important;border:1px solid var(--grey-80)!important}.secondary,.tertiary{color:var(--black-100)!important}.tertiary{background:var(--white-100)!important;border:1px solid var(--black-100)!important}.filled--red4{background:var(--red-100)!important;border:1px solid var(--red-100)!important}.filled--red3,.filled--red4{color:var(--red-20)!important}.filled--red3{background:var(--red-80)!important;border:1px solid var(--red-80)!important}.filled--red2{background:var(--red-40)!important;border:1px solid var(--red-40)!important;color:var(--red-100)!important}.filled--red1{border:1px solid var(--red-20)!important}.filled--red1,.outlined--red{background:var(--red-20)!important;color:var(--red-100)!important}.outlined--red{border:1px solid var(--red-100)!important}.filled--pink4{background:var(--pink-100)!important;border:1px solid var(--pink-100)!important}.filled--pink3,.filled--pink4{color:var(--pink-20)!important}.filled--pink3{background:var(--pink-80)!important;border:1px solid var(--pink-80)!important}.filled--pink2{background:var(--pink-40)!important;border:1px solid var(--pink-40)!important;color:var(--pink-100)!important}.filled--pink1{border:1px solid var(--pink-20)!important}.filled--pink1,.outlined--pink{background:var(--pink-20)!important;color:var(--pink-100)!important}.outlined--pink{border:1px solid var(--pink-100)!important}.filled--yellow4{background:var(--yellow-100)!important;border:1px solid var(--yellow-100)!important;color:var(--yellow-20)!important}.filled--yellow3{background:var(--yellow-80)!important;border:1px solid var(--yellow-80)!important;color:var(--yellow-20)!important}.filled--yellow2{background:var(--yellow-40)!important;border:1px solid var(--yellow-40)!important;color:var(--yellow-100)!important}.filled--yellow1{border:1px solid var(--yellow-20)!important}.filled--yellow1,.outlined--yellow{background:var(--yellow-20)!important;color:var(--yellow-100)!important}.outlined--yellow{border:1px solid var(--yellow-100)!important}.filled--green4{background:var(--green-100)!important;border:1px solid var(--green-100)!important;color:var(--green-20)!important}.filled--green3{background:var(--green-80)!important;border:1px solid var(--green-80)!important;color:var(--green-20)!important}.filled--green2{background:var(--green-40)!important;border:1px solid var(--green-40)!important;color:var(--green-100)!important}.filled--green1{border:1px solid var(--green-20)!important}.filled--green1,.outlined--green{background:var(--green-20)!important;color:var(--green-100)!important}.outlined--green{border:1px solid var(--green-100)!important}.filled--teal4{background:var(--teal-100)!important;border:1px solid var(--teal-100)!important}.filled--teal3,.filled--teal4{color:var(--teal-20)!important}.filled--teal3{background:var(--teal-80)!important;border:1px solid var(--teal-80)!important}.filled--teal2{background:var(--teal-40)!important;border:1px solid var(--teal-40)!important;color:var(--teal-100)!important}.filled--teal1{border:1px solid var(--teal-20)!important}.filled--teal1,.outlined--teal{background:var(--teal-20)!important;color:var(--teal-100)!important}.outlined--teal{border:1px solid var(--teal-100)!important}.filled--blue4{background:var(--blue-100)!important;border:1px solid var(--blue-100)!important}.filled--blue3,.filled--blue4{color:var(--blue-20)!important}.filled--blue3{background:var(--blue-80)!important;border:1px solid var(--blue-80)!important}.filled--blue2{background:var(--blue-40)!important;border:1px solid var(--blue-40)!important;color:var(--blue-100)!important}.filled--blue1{border:1px solid var(--blue-20)!important}.filled--blue1,.outlined--blue{background:var(--blue-20)!important;color:var(--blue-100)!important}.outlined--blue{border:1px solid var(--blue-100)!important}.filled--purple4{background:var(--purple-100)!important;border:1px solid var(--purple-100)!important;color:var(--purple-20)!important}.filled--purple3{background:var(--purple-80)!important;border:1px solid var(--purple-80)!important;color:var(--purple-20)!important}.filled--purple2{background:var(--purple-40)!important;border:1px solid var(--purple-40)!important;color:var(--purple-100)!important}.filled--purple1{border:1px solid var(--purple-20)!important}.filled--purple1,.outlined--purple{background:var(--purple-20)!important;color:var(--purple-100)!important}.outlined--purple{border:1px solid var(--purple-100)!important}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arup-ri/velcro",
3
- "version": "0.0.7",
3
+ "version": "0.0.8",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },