vue-radio-toggle-buttons
Version:
Radio toggle buttons for Vue.
1 lines • 1.83 kB
Source Map (JSON)
{"version":3,"sources":["../src/stdin","../src/scss/main.scss"],"names":[],"mappings":"AAEA,0BACC,iBAAkB,CAClB,cAAe,CACf,qBAAsB,CACtB,wBAAyB,CACzB,YAAa,CAEZ,iDAAyC,CACzC,uBAAc,CACd,sCAA4B,CAE7B,SCHD,CDRA,4CAcE,YCFF,CDZA,oDAiBE,gBCDF,CDhBA,wCAoBE,yBCAF,CDpBA,uCAuBE,yBCCF,CDxBA,qEA2BE,SCCF,CD5BA,sCA8BE,SCEF","file":"vue-radio-toggle-buttons.min.css","sourcesContent":["$radius: 3px;\r\n\r\nlabel.radio-toggle-button {\r\n\tposition: relative;\r\n\tcursor: pointer;\r\n\tborder: 1px solid #ccc;\r\n\tborder-collapse: collapse;\r\n\tpadding: 10px;\r\n\ttransition: {\r\n\t\tproperty: color, border, background-color;\r\n\t\tduration: 0.3s;\r\n\t\ttiming-function: ease-in-out;\r\n\t}\r\n\tz-index: 0;\r\n\r\n\tinput[type='radio'] {\r\n\t\tdisplay: none;\r\n\t}\r\n\t& + & {\r\n\t\tmargin-left: -1px;\r\n\t}\r\n\t&:first-of-type {\r\n\t\tborder-radius: $radius 0 0 $radius;\r\n\t}\r\n\t&:last-of-type {\r\n\t\tborder-radius: 0 $radius $radius 0;\r\n\t}\r\n\t&:hover,\r\n\t&.is-hovered {\r\n\t\tz-index: 1;\r\n\t}\r\n\t&.is-selected {\r\n\t\tz-index: 2;\r\n\t}\r\n}\r\n","label.radio-toggle-button {\n position: relative;\n cursor: pointer;\n border: 1px solid #ccc;\n border-collapse: collapse;\n padding: 10px;\n transition-property: color, border, background-color;\n transition-duration: 0.3s;\n transition-timing-function: ease-in-out;\n z-index: 0;\n}\n\nlabel.radio-toggle-button input[type='radio'] {\n display: none;\n}\n\nlabel.radio-toggle-button + label.radio-toggle-button {\n margin-left: -1px;\n}\n\nlabel.radio-toggle-button:first-of-type {\n border-radius: 3px 0 0 3px;\n}\n\nlabel.radio-toggle-button:last-of-type {\n border-radius: 0 3px 3px 0;\n}\n\nlabel.radio-toggle-button:hover, label.radio-toggle-button.is-hovered {\n z-index: 1;\n}\n\nlabel.radio-toggle-button.is-selected {\n z-index: 2;\n}"]}