[add] First
This commit is contained in:
commit
61fdb6c540
31
index.html
Normal file
31
index.html
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<head>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>JianMiau - LIFF</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<!-- <center>
|
||||||
|
<div class="flex">
|
||||||
|
<a href="line://ti/p/%40iov0354t" class="bttn">Thank You</a>
|
||||||
|
</div>
|
||||||
|
</center> -->
|
||||||
|
<div id="logerror" style="font-size:30px"></div>
|
||||||
|
<center>
|
||||||
|
<h2><button class="button button1" id="textx">Text</button></h2>
|
||||||
|
<h2><button class="button button2" id="imagex">Image</button></h2>
|
||||||
|
<h2><button class="button button3" id="videox">Video</button></h2>
|
||||||
|
<h2><button class="button button4" id="audiox">Audio</button></h2>
|
||||||
|
<h2><button class="button button5" id="stickerx">Big Sticker</button></h2>
|
||||||
|
</center>
|
||||||
|
<!-- <script src="https://d.line-scdn.net/liff/1.0/sdk.js"></script> -->
|
||||||
|
<script charset="utf-8" src="https://static.line-scdn.net/liff/edge/2/sdk.js"></script>
|
||||||
|
<!-- <center>
|
||||||
|
<h2 style="color: #3f3f3f;">Designed by <a href="https://ari-yk.github.io/"
|
||||||
|
style="color: #3f3f3f; text-decoration: none; font-size: 20px;">Ari.</a></h2>
|
||||||
|
<h3><code
|
||||||
|
style="color: #3f3f3f;"><i><a href="https://ari-yk.github.io/" style="color: #3f3f3f; text-decoration: none;">Ari.</a> © 2019</i></code>
|
||||||
|
</h3>
|
||||||
|
</center> -->
|
||||||
|
<script src="liff-starter.js"></script>
|
||||||
|
</body>
|
||||||
2
index.php
Normal file
2
index.php
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
<!-- This file allows you to host this page as a static file on Heroku -->
|
||||||
|
<?php header( 'Location: /index.html' ) ; ?>
|
||||||
203
liff-starter copy.js
Normal file
203
liff-starter copy.js
Normal file
@ -0,0 +1,203 @@
|
|||||||
|
var _0xc92f = ['/IOS/sticker_animation@2x.png', '/IOS/sticker@2x.png', 'template', 'Sticker', 'image_carousel', 'https://stickershop.line-scdn.net/stickershop/v1/sticker/', 'uri', 'line://shop/sticker/detail/', 'statusMessage', '\x20-\x20', 'length', 'Status\x20Message\x20is\x20to\x20long!\x20Max\x2060\x20words', 'Profile\x20', 'buttons', 'cover', 'line://app/1602687308-GXq4Vvk9?type=profile', 'onload', 'init', 'type', 'getElementById', 'textx', 'addEventListener', 'click', 'sendMessages', 'text', 'then', 'closeWindow', 'imagex', 'bGluZTovL2FwcC8xNjAyNjg3MzA4LUdYcTRWdms5P3R5cGU9aW1hZ2UmaW1nPWh0dHBzOi8vd2FsbHBhcGVyc3R1ZGlvMTAuY29tL3N0YXRpYy93cGRiL3dhbGxwYXBlcnMvMTAwMHg1NjMvMTY4ODkxLmpwZwoKdHlwZSA9PiBpbWFnZQppbWcgPT4gTGluayAobXVzdCBiZSBIVFRQUyk=', 'videox', 'bGluZTovL2FwcC8xNjAyNjg3MzA4LUdYcTRWdms5P3R5cGU9dmlkZW8mb2N1PWh0dHBzOi8vdGlueXVybC5jb20veThvZzNvcjUmcGl1PWh0dHBzOi8vaW1hZ2VzNi5hbHBoYWNvZGVycy5jb20vNzEwL3RodW1iLTM1MC03MTAxMzIucG5nCgp0eXBlID0+IHZpZGVvCm9jdSA9PiB2aWRlbyB1cmwKcGl1ID0+IHByZXZpZXcgaW1hZ2U=', 'audiox', 'bGluZTovL2FwcC8xNjAyNjg3MzA4LUdYcTRWdms5P3R5cGU9YXVkaW8mbGluaz1odHRwczovL3BsYXRlbGV0cy5mdW4vcHVibGljL3NvdW5kcy9tdXNpYy5tcDM=', 'V2l0aCBBbmltYXRpb246CmxpbmU6Ly9hcHAvMTYwMjY4NzMwOC1HWHE0VnZrOT90eXBlPXN0aWNrZXImc3RrPWFuaW0mc2lkPTMyMTI4MjMxJnBrZz0zMDk5MzEyCgpObyBBbmltYXRpb246CmxpbmU6Ly9hcHAvMTYwMjY4NzMwOC1HWHE0VnZrOT90eXBlPXN0aWNrZXImc3RrPW5vYW5pbSZzaWQ9MzIxMjgyMzEmcGtnPTMwOTkzMTIKCnR5cGUgPT4gc3RpY2tlcgpzdGsgPT4gYW5pbSAvIG5vYW5pbQpzaWQgPT4gc3RpY2tlciBpZApwa2cgPT4gcGFja2FnZXMgaWQ=', 'location', 'replace', '\x5c$&', '[?&]', '(=([^&#]*)|&|#|$)', 'exec', 'getProfile', 'userid', 'textContent', 'Hai\x20\x20', 'displayName', 'main', 'src', 'pictureUrl', 'image', 'img', 'video', 'ocu', 'audio', 'link', 'sticker', 'stk', 'sid'];
|
||||||
|
(function (_0x2fbeca, _0x302170) {
|
||||||
|
var _0x1ae02f = function (_0x1066ee) {
|
||||||
|
while (--_0x1066ee) {
|
||||||
|
_0x2fbeca['push'](_0x2fbeca['shift']());
|
||||||
|
}
|
||||||
|
};
|
||||||
|
_0x1ae02f(++_0x302170);
|
||||||
|
}(_0xc92f, 0xf4));
|
||||||
|
var _0x5754 = function (_0x2ce21f, _0x3a7c12) {
|
||||||
|
_0x2ce21f = _0x2ce21f - 0x0;
|
||||||
|
var _0x46fe3a = _0xc92f[_0x2ce21f];
|
||||||
|
return _0x46fe3a;
|
||||||
|
};
|
||||||
|
window[_0x5754('0x0')] = function (_0xe315c8) {
|
||||||
|
liff[_0x5754('0x1')](function () {
|
||||||
|
getP();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
;
|
||||||
|
function getP() {
|
||||||
|
var _0x2f580c = getParameterByName(_0x5754('0x2'));
|
||||||
|
if (!_0x2f580c) {
|
||||||
|
document[_0x5754('0x3')](_0x5754('0x4'))[_0x5754('0x5')](_0x5754('0x6'), function () {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x8'),
|
||||||
|
'text': atob('bGluZTovL2FwcC8xNjAyNjg3MzA4LUdYcTRWdms5P3R5cGU9dGV4dCZ0ZXh0PVlvdXIlMjBUZXh0Cgp0eXBlID0+IHRleHQKdGV4dCA9PiB5b3VyIHRleHQ=')
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document['getElementById'](_0x5754('0xb'))[_0x5754('0x5')](_0x5754('0x6'), function () {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': 'text',
|
||||||
|
'text': atob(_0x5754('0xc'))
|
||||||
|
}])['then'](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document[_0x5754('0x3')](_0x5754('0xd'))[_0x5754('0x5')](_0x5754('0x6'), function () {
|
||||||
|
liff['sendMessages']([{
|
||||||
|
'type': 'text',
|
||||||
|
'text': atob(_0x5754('0xe'))
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document[_0x5754('0x3')](_0x5754('0xf'))[_0x5754('0x5')]('click', function () {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x8'),
|
||||||
|
'text': atob(_0x5754('0x10'))
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document[_0x5754('0x3')]('stickerx')[_0x5754('0x5')]('click', function () {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x8'),
|
||||||
|
'text': atob(_0x5754('0x11'))
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
makeText();
|
||||||
|
makeImage();
|
||||||
|
makeVideo();
|
||||||
|
makeAudio();
|
||||||
|
makeSticker();
|
||||||
|
meProfile();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function getParameterByName(_0x3c6660, _0x1bb4a0) {
|
||||||
|
if (!_0x1bb4a0)
|
||||||
|
_0x1bb4a0 = window[_0x5754('0x12')]['href'];
|
||||||
|
_0x3c6660 = _0x3c6660[_0x5754('0x13')](/[\[\]]/g, _0x5754('0x14'));
|
||||||
|
var _0x44dc32 = new RegExp(_0x5754('0x15') + _0x3c6660 + _0x5754('0x16'))
|
||||||
|
, _0xb5b3b2 = _0x44dc32[_0x5754('0x17')](_0x1bb4a0);
|
||||||
|
if (!_0xb5b3b2)
|
||||||
|
return null;
|
||||||
|
if (!_0xb5b3b2[0x2])
|
||||||
|
return '';
|
||||||
|
return decodeURIComponent(_0xb5b3b2[0x2][_0x5754('0x13')](/\+/g, '\x20'));
|
||||||
|
}
|
||||||
|
function getProfile() {
|
||||||
|
liff[_0x5754('0x18')]()[_0x5754('0x9')](function (_0x5d36d7) {
|
||||||
|
document[_0x5754('0x3')](_0x5754('0x19'))[_0x5754('0x1a')] = _0x5754('0x1b') + _0x5d36d7[_0x5754('0x1c')];
|
||||||
|
document[_0x5754('0x3')](_0x5754('0x1d'))[_0x5754('0x1e')] = _0x5d36d7[_0x5754('0x1f')];
|
||||||
|
document[_0x5754('0x3')]('close')[_0x5754('0x5')](_0x5754('0x6'), function () {
|
||||||
|
liff['closeWindow']();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function makeText() {
|
||||||
|
var _0x506b4d = getParameterByName(_0x5754('0x2'));
|
||||||
|
if (_0x506b4d === 'text') {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x8'),
|
||||||
|
'text': getParameterByName('text')
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeImage() {
|
||||||
|
var _0x346b18 = getParameterByName('type');
|
||||||
|
if (_0x346b18 === _0x5754('0x20')) {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x20'),
|
||||||
|
'originalContentUrl': getParameterByName(_0x5754('0x21')),
|
||||||
|
'previewImageUrl': getParameterByName(_0x5754('0x21'))
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeVideo() {
|
||||||
|
var _0x533132 = getParameterByName(_0x5754('0x2'));
|
||||||
|
if (_0x533132 === _0x5754('0x22')) {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x22'),
|
||||||
|
'originalContentUrl': getParameterByName(_0x5754('0x23')),
|
||||||
|
'previewImageUrl': getParameterByName('piu')
|
||||||
|
}])['then'](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeAudio() {
|
||||||
|
var _0x49ab55 = getParameterByName(_0x5754('0x2'));
|
||||||
|
if (_0x49ab55 === _0x5754('0x24')) {
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x24'),
|
||||||
|
'originalContentUrl': getParameterByName(_0x5754('0x25')),
|
||||||
|
'duration': 0xea60
|
||||||
|
}])['then'](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeSticker() {
|
||||||
|
var _0x39f802 = getParameterByName(_0x5754('0x2'));
|
||||||
|
if (_0x39f802 === _0x5754('0x26')) {
|
||||||
|
var _0x515894 = getParameterByName(_0x5754('0x27'));
|
||||||
|
var _0x25e1cd = getParameterByName(_0x5754('0x28'));
|
||||||
|
var _0x2991aa = getParameterByName('pkg');
|
||||||
|
var _0x346ff0 = '';
|
||||||
|
if (_0x515894 === 'anim') {
|
||||||
|
_0x346ff0 = _0x5754('0x29');
|
||||||
|
} else {
|
||||||
|
_0x346ff0 = _0x5754('0x2a');
|
||||||
|
}
|
||||||
|
liff[_0x5754('0x7')]([{
|
||||||
|
'type': _0x5754('0x2b'),
|
||||||
|
'altText': _0x5754('0x2c'),
|
||||||
|
'template': {
|
||||||
|
'type': _0x5754('0x2d'),
|
||||||
|
'columns': [{
|
||||||
|
'imageUrl': _0x5754('0x2e') + _0x25e1cd + _0x346ff0,
|
||||||
|
'action': {
|
||||||
|
'type': _0x5754('0x2f'),
|
||||||
|
'uri': _0x5754('0x30') + _0x2991aa
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}])['then'](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function meProfile() {
|
||||||
|
var _0x273b8d = getParameterByName('type');
|
||||||
|
liff[_0x5754('0x18')]()['then'](function (_0x1711d4) {
|
||||||
|
var _0x3a1529 = _0x1711d4[_0x5754('0x31')];
|
||||||
|
if (_0x3a1529 == null) {
|
||||||
|
var _0x3a1529 = _0x5754('0x32');
|
||||||
|
}
|
||||||
|
if (_0x3a1529[_0x5754('0x33')] > 0x3c) {
|
||||||
|
var _0x3a1529 = _0x5754('0x34');
|
||||||
|
}
|
||||||
|
if (_0x273b8d === 'profile') {
|
||||||
|
liff['sendMessages']([{
|
||||||
|
'type': _0x5754('0x2b'),
|
||||||
|
'altText': _0x5754('0x35') + _0x1711d4[_0x5754('0x1c')],
|
||||||
|
'template': {
|
||||||
|
'type': _0x5754('0x36'),
|
||||||
|
'thumbnailImageUrl': _0x1711d4[_0x5754('0x1f')],
|
||||||
|
'imageAspectRatio': 'square',
|
||||||
|
'imageSize': _0x5754('0x37'),
|
||||||
|
'title': _0x1711d4['displayName'],
|
||||||
|
'text': _0x3a1529,
|
||||||
|
'actions': [{
|
||||||
|
'type': 'uri',
|
||||||
|
'label': 'Me',
|
||||||
|
'uri': _0x5754('0x38')
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}])[_0x5754('0x9')](function () {
|
||||||
|
liff[_0x5754('0xa')]();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
221
liff-starter.js
Normal file
221
liff-starter.js
Normal file
@ -0,0 +1,221 @@
|
|||||||
|
window.onload = function (_0xe315c8) {
|
||||||
|
liff
|
||||||
|
.init({
|
||||||
|
liffId: '1657715144-m4W6lyjL', // Use own liffId
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
if (!liff.isLoggedIn()) {
|
||||||
|
liff.login();
|
||||||
|
} else {
|
||||||
|
getP();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
function getP() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (!type) {
|
||||||
|
document.getElementById("textx").addEventListener("click", function () {
|
||||||
|
const data = [{
|
||||||
|
type: "text",
|
||||||
|
"text": atob("bGluZTovL2FwcC8xNTk5NzA2MzkxLVh3a0JMNzg5P3R5cGU9dGV4dCZ0ZXh0PVlvdXIlMjBUZXh0DQoNCnR5cGUgPT4gdGV4dA0KdGV4dCA9PiB5b3VyIHRleHQ=")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
});
|
||||||
|
document.getElementById("imagex").addEventListener("click", function () {
|
||||||
|
const data = [{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=image&img=https://wallpaperstudio10.com/static/wpdb/wallpapers/1000x563/168891.jpg\n\ntype => image\nimg => Link (must be HTTPS)")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
});
|
||||||
|
document.getElementById("videox").addEventListener("click", function () {
|
||||||
|
const data = [{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=video&ocu=https://tinyurl.com/y8og3or5&piu=https://images6.alphacoders.com/710/thumb-350-710132.png\n\ntype => video\nocu => video url\npiu => preview image")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
});
|
||||||
|
document.getElementById("audiox").addEventListener("click", function () {
|
||||||
|
const data = [{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=audio&link=https://platelets.fun/public/sounds/music.mp3")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
});
|
||||||
|
document.getElementById("stickerx").addEventListener("click", function () {
|
||||||
|
const data = [{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("With Animation:\nline://app/1657715144-m4W6lyjL?type=sticker&stk=anim&sid=32128231&pkg=3099312\n\nNo Animation:\nline://app/1657715144-m4W6lyjL?type=sticker&stk=noanim&sid=32128231&pkg=3099312\n\ntype => sticker\nstk => anim / noanim\nsid => sticker id\npkg => packages id")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
makeText();
|
||||||
|
makeImage();
|
||||||
|
makeVideo();
|
||||||
|
makeAudio();
|
||||||
|
makeSticker();
|
||||||
|
meProfile();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function getParameterByName(stringParam, window_href) {
|
||||||
|
const URLscheme = {};
|
||||||
|
let urlsearch = window.location.search;
|
||||||
|
if (urlsearch.indexOf("?") !== -1) {
|
||||||
|
let str = urlsearch.substring(1);
|
||||||
|
let strs = str.split("&");
|
||||||
|
for (let i = 0; i < strs.length; i++) {
|
||||||
|
URLscheme[strs[i].split("=")[0]] = decodeURIComponent(strs[i].split("=")[1]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return URLscheme[stringParam];
|
||||||
|
}
|
||||||
|
function getProfile() {
|
||||||
|
liff.getProfile().then(function (data) {
|
||||||
|
document.getElementById("userid").textContent = "Hai " + data.displayName;
|
||||||
|
document.getElementById("main").src = data.pictureUrl;
|
||||||
|
document.getElementById("close").addEventListener("click", function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function makeText() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "text") {
|
||||||
|
const data = [{
|
||||||
|
"type": "text",
|
||||||
|
"text": getParameterByName("text")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeImage() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "image") {
|
||||||
|
const data = [{
|
||||||
|
"type": "image",
|
||||||
|
"originalContentUrl": getParameterByName("img"),
|
||||||
|
"previewImageUrl": getParameterByName("img")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeVideo() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "video") {
|
||||||
|
const data = [{
|
||||||
|
"type": "video",
|
||||||
|
"originalContentUrl": getParameterByName("ocu"),
|
||||||
|
"previewImageUrl": getParameterByName("piu")
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeAudio() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "audio") {
|
||||||
|
const data = [{
|
||||||
|
"type": "audio",
|
||||||
|
"originalContentUrl": getParameterByName("link"),
|
||||||
|
"duration": 60000
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeSticker() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "sticker") {
|
||||||
|
var stk = getParameterByName("stk");
|
||||||
|
var sid = getParameterByName("sid");
|
||||||
|
var pkg = getParameterByName("pkg");
|
||||||
|
var pngtype = "";
|
||||||
|
if (stk === "anim") {
|
||||||
|
pngtype = "/IOS/sticker_animation@2x.png";
|
||||||
|
} else {
|
||||||
|
pngtype = "/IOS/sticker@2x.png";
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = [{
|
||||||
|
"type": "template",
|
||||||
|
"altText": "Sticker",
|
||||||
|
"template": {
|
||||||
|
"type": "image_carousel",
|
||||||
|
"columns": [{
|
||||||
|
"imageUrl": "https://stickershop.line-scdn.net/stickershop/v1/sticker/" + sid + pngtype,
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"uri": "line://shop/sticker/detail/" + pkg
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function meProfile() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
liff.getProfile().then(function (data) {
|
||||||
|
var statusMessage = data.statusMessage;
|
||||||
|
if (statusMessage == null) {
|
||||||
|
var statusMessage = "";
|
||||||
|
}
|
||||||
|
if (statusMessage.length > 60) {
|
||||||
|
var statusMessage = "Status Message is to long! Max 60 words";
|
||||||
|
}
|
||||||
|
if (type === "profile") {
|
||||||
|
const data = [{
|
||||||
|
"type": "template",
|
||||||
|
"altText": "Profile " + data.displayName,
|
||||||
|
"template": {
|
||||||
|
"type": "buttons",
|
||||||
|
"thumbnailImageUrl": data.pictureUrl,
|
||||||
|
"imageAspectRatio": "square",
|
||||||
|
"imageSize": "cover",
|
||||||
|
"title": data.displayName,
|
||||||
|
"text": statusMessage,
|
||||||
|
"actions": [{
|
||||||
|
"type": "uri",
|
||||||
|
"label": "Me",
|
||||||
|
"uri": "line://app/1657715144-m4W6lyjL?type=profile"
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}];
|
||||||
|
|
||||||
|
sendMessages(data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function sendMessages(data) {
|
||||||
|
if (liff.isInClient()) {
|
||||||
|
liff.sendMessages(data).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
}).catch(function (error) {
|
||||||
|
console.error(`[Line] textx: ${error}`);
|
||||||
|
document.getElementById("error").innerHTML = `[Line] textx: ${error}`;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
if (liff.isApiAvailable("shareTargetPicker")) {
|
||||||
|
liff.shareTargetPicker(data).then(function (res) {
|
||||||
|
liff.closeWindow();
|
||||||
|
}).catch(function (error) {
|
||||||
|
console.error(`[Line] textx: ${error}`);
|
||||||
|
document.getElementById("error").innerHTML = `[Line] textx: ${error}`;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
document.getElementById("error").innerHTML = `你的 LINE App 暫時不支援 Share Target Picker`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
294
liff-starter1 copy.js
Normal file
294
liff-starter1 copy.js
Normal file
@ -0,0 +1,294 @@
|
|||||||
|
window.onload = function (_0xe315c8) {
|
||||||
|
// liff.init(function () {
|
||||||
|
// getP();
|
||||||
|
// });
|
||||||
|
liff
|
||||||
|
.init({
|
||||||
|
liffId: '1657715144-m4W6lyjL', // Use own liffId
|
||||||
|
})
|
||||||
|
.then(() => {
|
||||||
|
if (!liff.isLoggedIn()) {
|
||||||
|
liff.login();
|
||||||
|
} else {
|
||||||
|
getP();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
function getP() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (!type) {
|
||||||
|
document.getElementById("textx").addEventListener("click", function () {
|
||||||
|
document.getElementById("logerror").innerHTML = `[Line] logerror`;
|
||||||
|
liff.sendMessages([
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
// "text": atob("bGluZTovL2FwcC8xNTk5NzA2MzkxLVh3a0JMNzg5P3R5cGU9dGV4dCZ0ZXh0PVlvdXIlMjBUZXh0DQoNCnR5cGUgPT4gdGV4dA0KdGV4dCA9PiB5b3VyIHRleHQ=")
|
||||||
|
"text": "8787"
|
||||||
|
}
|
||||||
|
]).then(function (res) {
|
||||||
|
liff.closeWindow();
|
||||||
|
}).catch(function (error) {
|
||||||
|
console.error(`[Line] textx: ${error}`);
|
||||||
|
document.getElementById("error").innerHTML = `[Line] textx: ${error}`;
|
||||||
|
// liff.logout();
|
||||||
|
});
|
||||||
|
|
||||||
|
// liff.sendMessages([{
|
||||||
|
// "type": "text",
|
||||||
|
// "text": atob("bGluZTovL2FwcC8xNTk5NzA2MzkxLVh3a0JMNzg5P3R5cGU9dGV4dCZ0ZXh0PVlvdXIlMjBUZXh0DQoNCnR5cGUgPT4gdGV4dA0KdGV4dCA9PiB5b3VyIHRleHQ=")
|
||||||
|
// }]).then(function () {
|
||||||
|
// liff.closeWindow();
|
||||||
|
// });
|
||||||
|
|
||||||
|
// if (liff.isApiAvailable("shareTargetPicker")) {
|
||||||
|
// liff.shareTargetPicker([
|
||||||
|
// {
|
||||||
|
// type: "text",
|
||||||
|
// "text": "8787"
|
||||||
|
// }
|
||||||
|
// ]).then(function (res) {
|
||||||
|
// console.log(`[Line] ShareTargetPicker was launched`);
|
||||||
|
// }).catch(function (error) {
|
||||||
|
// console.error(`[Line] Failed to launch ShareTargetPicker Error: ${error}`);
|
||||||
|
// });
|
||||||
|
// } else {
|
||||||
|
// alert("[Line] 你的 LINE App 暫時不支援 Share Target Picker");
|
||||||
|
// }
|
||||||
|
});
|
||||||
|
document.getElementById("imagex").addEventListener("click", function () {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=image&img=https://wallpaperstudio10.com/static/wpdb/wallpapers/1000x563/168891.jpg\n\ntype => image\nimg => Link (must be HTTPS)")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document.getElementById("videox").addEventListener("click", function () {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=video&ocu=https://tinyurl.com/y8og3or5&piu=https://images6.alphacoders.com/710/thumb-350-710132.png\n\ntype => video\nocu => video url\npiu => preview image")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document.getElementById("audiox").addEventListener("click", function () {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("line://app/1657715144-m4W6lyjL?type=audio&link=https://platelets.fun/public/sounds/music.mp3")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
document.getElementById("stickerx").addEventListener("click", function () {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "text",
|
||||||
|
"text": ("With Animation:\nline://app/1657715144-m4W6lyjL?type=sticker&stk=anim&sid=32128231&pkg=3099312\n\nNo Animation:\nline://app/1657715144-m4W6lyjL?type=sticker&stk=noanim&sid=32128231&pkg=3099312\n\ntype => sticker\nstk => anim / noanim\nsid => sticker id\npkg => packages id")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
makeText();
|
||||||
|
makeImage();
|
||||||
|
makeVideo();
|
||||||
|
makeAudio();
|
||||||
|
makeSticker();
|
||||||
|
meProfile();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function getParameterByName(stringParam, window_href) {
|
||||||
|
// if (!window_href)
|
||||||
|
// window_href = window.location.href;
|
||||||
|
// stringParam = stringParam.replace(/[\[\]]/g, "");
|
||||||
|
// var regExp = new RegExp("null");
|
||||||
|
// var exec = regExp.exec(window_href);
|
||||||
|
// if (!exec)
|
||||||
|
// return null;
|
||||||
|
// if (!exec[2])
|
||||||
|
// return "";
|
||||||
|
// return decodeURIComponent(exec[2].replace(/\+/g, " "));
|
||||||
|
|
||||||
|
const URLscheme = {};
|
||||||
|
let urlsearch = window.location.search;
|
||||||
|
if (urlsearch.indexOf("?") !== -1) {
|
||||||
|
let str = urlsearch.substring(1);
|
||||||
|
let strs = str.split("&");
|
||||||
|
for (let i = 0; i < strs.length; i++) {
|
||||||
|
URLscheme[strs[i].split("=")[0]] = decodeURIComponent(strs[i].split("=")[1]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return URLscheme[stringParam];
|
||||||
|
}
|
||||||
|
function getProfile() {
|
||||||
|
liff.getProfile().then(function (data) {
|
||||||
|
document.getElementById("userid").textContent = "Hai " + data.displayName;
|
||||||
|
document.getElementById("main").src = data.pictureUrl;
|
||||||
|
document.getElementById("close").addEventListener("click", function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function makeText() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "text") {
|
||||||
|
// liff.sendMessages([{
|
||||||
|
// "type": "text",
|
||||||
|
// "text": getParameterByName("text")
|
||||||
|
// }]).then(function () {
|
||||||
|
// liff.closeWindow();
|
||||||
|
// }).catch(function (error) {
|
||||||
|
// console.error(`[Line] textx: ${error}`);
|
||||||
|
// document.getElementById("error").innerHTML = `[Line] textx: ${error}`;
|
||||||
|
// });
|
||||||
|
|
||||||
|
if (liff.isApiAvailable("shareTargetPicker")) {
|
||||||
|
liff.shareTargetPicker([
|
||||||
|
{
|
||||||
|
type: "text",
|
||||||
|
"text": getParameterByName("text")
|
||||||
|
}
|
||||||
|
]).then(function (res) {
|
||||||
|
liff.closeWindow();
|
||||||
|
}).catch(function (error) {
|
||||||
|
console.error(`[Line] textx: ${error}`);
|
||||||
|
document.getElementById("error").innerHTML = `[Line] textx: ${error}`;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
alert("[Line] 你的 LINE App 暫時不支援 Share Target Picker");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeImage() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "image") {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "image",
|
||||||
|
"originalContentUrl": getParameterByName("img"),
|
||||||
|
"previewImageUrl": getParameterByName("img")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeVideo() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "video") {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "video",
|
||||||
|
"originalContentUrl": getParameterByName("ocu"),
|
||||||
|
"previewImageUrl": getParameterByName("piu")
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeAudio() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "audio") {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "audio",
|
||||||
|
"originalContentUrl": getParameterByName("link"),
|
||||||
|
"duration": 60000
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function makeSticker() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
if (type === "sticker") {
|
||||||
|
var stk = getParameterByName("stk");
|
||||||
|
var sid = getParameterByName("sid");
|
||||||
|
var pkg = getParameterByName("pkg");
|
||||||
|
var pngtype = "";
|
||||||
|
if (stk === "anim") {
|
||||||
|
pngtype = "/IOS/sticker_animation@2x.png";
|
||||||
|
} else {
|
||||||
|
pngtype = "/IOS/sticker@2x.png";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (liff.isApiAvailable("sendMessages")) {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "template",
|
||||||
|
"altText": "Sticker",
|
||||||
|
"template": {
|
||||||
|
"type": "image_carousel",
|
||||||
|
"columns": [{
|
||||||
|
"imageUrl": "https://stickershop.line-scdn.net/stickershop/v1/sticker/" + sid + pngtype,
|
||||||
|
"action": {
|
||||||
|
"type": "uri",
|
||||||
|
"uri": "line://shop/sticker/detail/" + pkg
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
}).catch(function (error) {
|
||||||
|
console.error(`[Line] makeSticker: ${error}`);
|
||||||
|
document.getElementById("error").innerHTML = `[Line] makeSticker: ${error}`;
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
alert("[Line] 你的 LINE App 暫時不支援 Send Messages");
|
||||||
|
document.getElementById("error").innerHTML = `[Line] 你的 LINE App 暫時不支援 Send Messages`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// if (liff.isApiAvailable("shareTargetPicker")) {
|
||||||
|
// liff.shareTargetPicker([
|
||||||
|
// {
|
||||||
|
// type: "template",
|
||||||
|
// "altText": "Sticker",
|
||||||
|
// "template": {
|
||||||
|
// "type": "image_carousel",
|
||||||
|
// "columns": [{
|
||||||
|
// "imageUrl": "https://stickershop.line-scdn.net/stickershop/v1/sticker/" + sid + pngtype,
|
||||||
|
// "action": {
|
||||||
|
// "type": "uri",
|
||||||
|
// "uri": "line://shop/sticker/detail/" + pkg
|
||||||
|
// }
|
||||||
|
// }]
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// ]).then(function (res) {
|
||||||
|
// liff.closeWindow();
|
||||||
|
// }).catch(function (error) {
|
||||||
|
// console.error(`[Line] makeSticker: ${error}`);
|
||||||
|
// document.getElementById("error").innerHTML = `[Line] makeSticker: ${error}`;
|
||||||
|
// });
|
||||||
|
// } else {
|
||||||
|
// alert("[Line] 你的 LINE App 暫時不支援 Share Target Picker");
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function meProfile() {
|
||||||
|
var type = getParameterByName("type");
|
||||||
|
liff.getProfile().then(function (data) {
|
||||||
|
var _statusMessage = data.statusMessage;
|
||||||
|
if (_statusMessage == null) {
|
||||||
|
var _statusMessage = "";
|
||||||
|
}
|
||||||
|
if (_statusMessage.length > 60) {
|
||||||
|
var _statusMessage = "Status Message is to long! Max 60 words";
|
||||||
|
}
|
||||||
|
if (type === "profile") {
|
||||||
|
liff.sendMessages([{
|
||||||
|
"type": "template",
|
||||||
|
"altText": "Profile " + data.displayName,
|
||||||
|
"template": {
|
||||||
|
"type": "buttons",
|
||||||
|
"thumbnailImageUrl": data.pictureUrl,
|
||||||
|
"imageAspectRatio": "square",
|
||||||
|
"imageSize": "cover",
|
||||||
|
"title": data.displayName,
|
||||||
|
"text": _statusMessage,
|
||||||
|
"actions": [{
|
||||||
|
"type": "uri",
|
||||||
|
"label": "Me",
|
||||||
|
"uri": "line://app/1657715144-m4W6lyjL?type=profile"
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
}]).then(function () {
|
||||||
|
liff.closeWindow();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
202
style.css
Normal file
202
style.css
Normal file
@ -0,0 +1,202 @@
|
|||||||
|
html{
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: -webkit-linear-gradient(200deg, #00C4FF, #9D1BB2);
|
||||||
|
background: linear-gradient(205deg, #00C4FF, #9D1BB2);
|
||||||
|
height: 100vh;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dark {
|
||||||
|
background: #24252A;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex {
|
||||||
|
min-height: 20vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#imag {
|
||||||
|
max-width: 25%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
background-color: #bababa; /* Green */
|
||||||
|
border: none;
|
||||||
|
color: white;
|
||||||
|
padding: 8px 42px;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
display: inline-block;
|
||||||
|
font-family: "Open Sans", sans-serif;
|
||||||
|
font-size: 16px;
|
||||||
|
margin: 1px 1px;
|
||||||
|
-webkit-transition-duration: 0.4s; /* Safari */
|
||||||
|
transition-duration: 0.4s;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button6 {
|
||||||
|
background-color: #212121;
|
||||||
|
color: white;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #212121;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button6:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: black;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button5 {
|
||||||
|
background-color: #3f3f3f;
|
||||||
|
color: black;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #3f3f3f;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button5:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button4 {
|
||||||
|
background-color: #555555;
|
||||||
|
color: white;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #555555;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button4:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: black;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button3 {
|
||||||
|
background-color: #7c7c7c;
|
||||||
|
color: black;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #7c7c7c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button3:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button2 {
|
||||||
|
background-color: #a5a5a5;
|
||||||
|
color: white;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #a5a5a5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button2:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: black;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.button1 {
|
||||||
|
background-color: #cccccc;
|
||||||
|
color: black;
|
||||||
|
width: 250px;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 2px solid #cccccc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button1:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: white;
|
||||||
|
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
|
||||||
|
}
|
||||||
|
|
||||||
|
.responsive {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.layang {
|
||||||
|
position:fixed;
|
||||||
|
right:5px;
|
||||||
|
top:10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@import "https://fonts.googleapis.com/css?family=Open+Sans:300,400";
|
||||||
|
*,
|
||||||
|
*::before,
|
||||||
|
*::after {
|
||||||
|
-webkit-box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.bttn {
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
-webkit-transition: 0.3s all ease;
|
||||||
|
transition: 0.3s ease all;
|
||||||
|
}
|
||||||
|
a.bttn:hover {
|
||||||
|
color: #2376fc;
|
||||||
|
}
|
||||||
|
a.bttn:focus {
|
||||||
|
color: #2376fc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bttn {
|
||||||
|
font-family: "Open Sans", sans-serif;
|
||||||
|
font-size: 20px;
|
||||||
|
letter-spacing: 3px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
width: 270px;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 5px 0px;
|
||||||
|
border: 3px solid #1bf992;
|
||||||
|
border-radius: 1px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.1);
|
||||||
|
}
|
||||||
|
.bttn:before {
|
||||||
|
-webkit-transition: 0.5s all ease;
|
||||||
|
transition: 0.5s all ease;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 50%;
|
||||||
|
right: 50%;
|
||||||
|
bottom: 0;
|
||||||
|
opacity: 0;
|
||||||
|
content: '';
|
||||||
|
background-color: #1bf992;
|
||||||
|
z-index: -2;
|
||||||
|
}
|
||||||
|
.bttn:hover:before {
|
||||||
|
-webkit-transition: 0.5s all ease;
|
||||||
|
transition: 0.5s all ease;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
.bttn:focus:before {
|
||||||
|
transition: 0.5s all ease;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user