react-customize-token-input/dist/react-customize-token-input.css.map

A react token (tag) input component. Allow customize data structure and Look & Feel

{"version":3,"file":"../dist/react-customize-token-input.css","mappings":"sHAAA,uBAME,qBAAsB,CACtB,qBAAsB,CACtB,iBAAkB,CAPlB,qBAAsB,CAItB,WAAY,CAHZ,YAAa,CAOb,SAAU,CALV,eAAgB,CADhB,WAOF,CAEA,sFAGE,kBACF,CAEA,sDACE,oBACF,CAEA,qDACE,oBACF,CAEA,sDACE,UAAW,CACX,gBAAiB,CACjB,eACF,CAEA,4DAME,eAAgB,CAChB,QAAS,CAET,eAAgB,CALhB,UAAW,CACX,WAAY,CAJZ,WAAY,CAEZ,QAAS,CAKT,SAAU,CANV,SAQF,CAEA,kEAGE,oBAA4B,CAC5B,kBAAmB,CAUnB,wBAAyB,CACzB,QAAS,CACT,iBAAkB,CALlB,aAAc,CAEd,cAAe,CAZf,YAAa,CACb,oBAAqB,CAGrB,UAAW,CAEX,WAAY,CAJZ,sBAA4B,CAO5B,eAAgB,CADhB,kBAAmB,CAHnB,cAAe,CAEf,SAAU,CALV,2BAA4B,CAS5B,kBAKF,CAEA,wEACE,wBACF,CAEA,2FAEE,wBAAyB,CADzB,aAEF,CAEA,iGACE,wBACF,CAEA,qGACE,wBACF,CAEA,8HACE,wBACF,CAEA,oGACE,cACF,CAEA,2HAEE,oBAA4B,CAC5B,kBAAmB,CAFnB,YAAa,CAGb,WAAY,CAFZ,sBAA4B,CAG5B,cAAe,CAHf,2BAIF,CAEA,iIAEE,4BAA6B,CAD7B,WAEF,CAEA,oGACE,UAAW,CACX,YAAa,CACb,eAAgB,CAChB,sBACF,CAEA,oGAGE,oBAA4B,CAC5B,kBAAmB,CAInB,0BAA2B,CAC3B,yBAA0B,CAF1B,cAAe,CANf,YAAa,CACb,UAAW,CAGX,WAAY,CAFZ,sBAA4B,CAO5B,UAAY,CAJZ,eAAgB,CAHhB,2BAQF,CAEA,2IAGE,WAAY,CAFZ,iBAAkB,CAClB,UAEF,CAEA,mSAKE,0BAA2B,CAD3B,UAAW,CADX,WAAY,CADZ,QAAS,CADT,iBAKF,CAEA,kJACE,wBACF,CAEA,iJACE,uBACF,CAEA,0GACE,qBAAsB,CACtB,SACF,CAEA,+SACE,iBACF","sources":["webpack://TokenInput/./src/styles.scss"],"sourcesContent":[".container {\n  box-sizing: border-box;\n  height: 200px;\n  padding: 4px;\n  overflow-y: auto;\n  cursor: text;\n  background-color: #fff;\n  border: 1px solid #ccc;\n  border-radius: 4px;\n  outline: 0;\n}\n\n.container *,\n.container *::before,\n.container *::after {\n  box-sizing: inherit;\n}\n\n.container.container--focused {\n  border-color: #0096cc;\n}\n\n.container.container--errors {\n  border-color: #db3d44;\n}\n\n.container .autosized-wrapper {\n  float: left;\n  margin-right: 4px;\n  overflow: hidden;\n}\n\n.container .autosized-wrapper input {\n  height: 32px;\n  padding: 0;\n  margin: 0;\n  color: #222;\n  cursor: text;\n  background: none;\n  border: 0;\n  outline: 0;\n  box-shadow: none;\n}\n\n.container .token-list .token {\n  display: flex;\n  flex-flow: row nowrap;\n  place-content: center center;\n  align-items: center;\n  float: left;\n  max-width: 100%;\n  height: 32px;\n  padding: 0;\n  margin: 0 4px 4px 0;\n  line-height: 1.5;\n  color: #0096cc;\n  white-space: nowrap;\n  cursor: default;\n  background-color: #cceaf5;\n  border: 0;\n  border-radius: 4px;\n}\n\n.container .token-list .token:hover {\n  background-color: #e6f4fc;\n}\n\n.container .token-list .token.token--error {\n  color: #db3d44;\n  background-color: #f9b5b5;\n}\n\n.container .token-list .token.token--error:hover {\n  background-color: #ffdada;\n}\n\n.container .token-list .token.token--read-only:hover {\n  background-color: #cceaf5;\n}\n\n.container .token-list .token.token--read-only.token--error:hover {\n  background-color: #f9b5b5;\n}\n\n.container .token-list .token.token--editable:hover {\n  cursor: pointer;\n}\n\n.container .token-list .token.token--active .autosized-wrapper {\n  display: flex;\n  place-content: center center;\n  align-items: center;\n  height: 32px;\n  margin: 4px 8px;\n}\n\n.container .token-list .token.token--active .autosized-wrapper input {\n  height: auto;\n  border-bottom: 1px solid #aaa;\n}\n\n.container .token-list .token .token__label-wrapper {\n  flex: 1 0 0;\n  margin: 0 8px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.container .token-list .token .token__delete-button {\n  display: flex;\n  flex: 0 0 0;\n  place-content: center center;\n  align-items: center;\n  height: 100%;\n  padding: 2px 8px;\n  cursor: pointer;\n  border-left: 1px solid #aaa;\n  border-radius: 0 4px 4px 0;\n  opacity: 0.3;\n}\n\n.container .token-list .token .token__delete-button .delete-button__close-icon {\n  position: relative;\n  width: 14px;\n  height: 14px;\n}\n\n.container .token-list .token .token__delete-button .delete-button__close-icon::before, .container .token-list .token .token__delete-button .delete-button__close-icon::after {\n  position: absolute;\n  left: 6px;\n  height: 14px;\n  content: '';\n  border-left: 2px solid #222;\n}\n\n.container .token-list .token .token__delete-button .delete-button__close-icon::before {\n  transform: rotate(-45deg);\n}\n\n.container .token-list .token .token__delete-button .delete-button__close-icon::after {\n  transform: rotate(45deg);\n}\n\n.container .token-list .token .token__delete-button:hover {\n  background-color: #aaa;\n  opacity: 1;\n}\n\n.container .token-list .token .token__delete-button:hover .delete-button__close-icon::before, .container .token-list .token .token__delete-button:hover .delete-button__close-icon::after {\n  border-color: #fff;\n}\n"],"names":[],"sourceRoot":""}