twitter-like-button/build/static/css/main.4e20ff3d.css.map

This is the functional twitter like button which you can integrate to your project. To give extra ordinary look

{"version":3,"file":"static/css/main.4e20ff3d.css","mappings":"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","sources":["button.css"],"sourcesContent":["svg {\n  cursor: pointer;\n  overflow: visible;\n  width: 60px;\n}\nsvg #heart {\n  transform-origin: center;\n  animation: animateHeartOut 0.3s linear forwards;\n}\nsvg #main-circ {\n  transform-origin: 29.5px 29.5px;\n}\n\n#checkbox {\n  display: none;\n}\n\n#checkbox:checked + label svg #heart {\n  transform: scale(0.2);\n  fill: #e2264d;\n  animation: animateHeart 0.3s linear forwards 0.25s;\n}\n#checkbox:checked + label svg #main-circ {\n  transition: all 2s;\n  animation: animateCircle 0.3s linear forwards;\n  opacity: 1;\n}\n#checkbox:checked + label svg #grp1 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp1 #oval1 {\n  transform: scale(0) translate(0, -30px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp1 #oval2 {\n  transform: scale(0) translate(10px, -50px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp2 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp2 #oval1 {\n  transform: scale(0) translate(30px, -15px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp2 #oval2 {\n  transform: scale(0) translate(60px, -15px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp3 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp3 #oval1 {\n  transform: scale(0) translate(30px, 0px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp3 #oval2 {\n  transform: scale(0) translate(60px, 10px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp4 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp4 #oval1 {\n  transform: scale(0) translate(30px, 15px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp4 #oval2 {\n  transform: scale(0) translate(40px, 50px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp5 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp5 #oval1 {\n  transform: scale(0) translate(-10px, 20px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp5 #oval2 {\n  transform: scale(0) translate(-60px, 30px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp6 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp6 #oval1 {\n  transform: scale(0) translate(-30px, 0px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp6 #oval2 {\n  transform: scale(0) translate(-60px, -5px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp7 {\n  opacity: 1;\n  transition: 0.1s all 0.3s;\n}\n#checkbox:checked + label svg #grp7 #oval1 {\n  transform: scale(0) translate(-30px, -15px);\n  transform-origin: 0 0 0;\n  transition: 0.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp7 #oval2 {\n  transform: scale(0) translate(-55px, -30px);\n  transform-origin: 0 0 0;\n  transition: 1.5s transform 0.3s;\n}\n#checkbox:checked + label svg #grp2 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n#checkbox:checked + label svg #grp3 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n#checkbox:checked + label svg #grp4 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n#checkbox:checked + label svg #grp5 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n#checkbox:checked + label svg #grp6 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n#checkbox:checked + label svg #grp7 {\n  opacity: 1;\n  transition: 0.1s opacity 0.3s;\n}\n\n@keyframes animateCircle {\n  40% {\n    transform: scale(10);\n    opacity: 1;\n    fill: #dd4688;\n  }\n  55% {\n    transform: scale(11);\n    opacity: 1;\n    fill: #d46abf;\n  }\n  65% {\n    transform: scale(12);\n    opacity: 1;\n    fill: #cc8ef5;\n  }\n  75% {\n    transform: scale(13);\n    opacity: 1;\n    fill: transparent;\n    stroke: #cc8ef5;\n    stroke-width: 0.5;\n  }\n  85% {\n    transform: scale(17);\n    opacity: 1;\n    fill: transparent;\n    stroke: #cc8ef5;\n    stroke-width: 0.2;\n  }\n  95% {\n    transform: scale(18);\n    opacity: 1;\n    fill: transparent;\n    stroke: #cc8ef5;\n    stroke-width: 0.1;\n  }\n  100% {\n    transform: scale(19);\n    opacity: 1;\n    fill: transparent;\n    stroke: #cc8ef5;\n    stroke-width: 0;\n  }\n}\n@keyframes animateHeart {\n  0% {\n    transform: scale(0.2);\n  }\n  40% {\n    transform: scale(1.2);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n@keyframes animateHeartOut {\n  0% {\n    transform: scale(1.4);\n  }\n  100% {\n    transform: scale(1);\n  }\n}"],"names":[],"sourceRoot":""}