1
0
Fork 0
mirror of https://github.com/seejohnrun/haste-server.git synced 2024-11-22 20:51:21 +00:00

Responsive design for mobile devices.

Signed-off-by: Haocen Xu <haocen.xu@gmail.com>
This commit is contained in:
Haocen Xu 2018-06-03 22:43:11 -04:00
parent d922667f56
commit 524afe9c6e

View file

@ -4,6 +4,7 @@
<title>hastebin</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="solarized_dark.css"/>
<link rel="stylesheet" type="text/css" href="application.css"/>
@ -33,7 +34,38 @@
$(function() {
app = new haste('hastebin', { twitter: true });
handlePop({ target: window });
responsive();
});
function responsive() {
// apply touch device specific style
if ("ontouchstart" in document.documentElement) {
var mTextAreaStyle = document.createElement('style');
mTextAreaStyle.setAttribute('rel', 'stylesheet')
mTextAreaStyle.setAttribute('type', 'text/css');
document.head.appendChild(mTextAreaStyle);
mTextAreaStyle.sheet.insertRule('textarea{ padding-bottom: 95px; }', 0);
var key = document.getElementById('key');
key.style.top = 'auto';
key.style.bottom = '0px';
var box1 = document.getElementById('box1');
box1.style.transition = 'opacity 1s';
setTimeout(() => {
box1.style.opacity = 0;
box1.addEventListener('transitionend', function(event) {
box1.parentElement.removeChild(box1)
}, {
capture: false,
once: true
});
var tArea = document.querySelector('textarea');
tArea.style.paddingBottom = '95px';
}, 1000);
}
}
</script>
</head>