×

İletişim Formu


AMP HTML Blogger Siteleri İçin Disqus Son Yorumlar Widget Tasarımı

5/07/2018
Etiketler : 
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<title>amp-iframe</title>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-lightbox" src="https://cdn.ampproject.org/v0/amp-lightbox-0.1.js"></script>
<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
<link rel="canonical" href="https://ampbyexample.com/components/amp-iframe/">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style amp-boilerplate>
body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}
@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}
</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}
</style></noscript>
<style amp-custom>
body{font-family:-apple-system,BlinkMacSystemFont,"Roboto","Segoe UI","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;padding:10px}
.top-comments-box-fixed{background:#fff;position:fixed;top:0;right:0;height:100vh;width:300px;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;z-index:999;-webkit-animation-name:slideInRight;animation-name:slideInRight;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}
.top-comments-box-fixed h3{font-size:18px;margin:0;padding:0 0 0 10px;color:#fff;height:50px;line-height:50px;background:#2e9fff;position:relative;-webkit-box-shadow:0 1px 8px rgba(0,0,0,.3);box-shadow:0 1px 8px rgba(0,0,0,.3)}
.top-comments-box-fixed h3 span{position:relative;z-index:2}
.top-comments-box-fixed h3:after{content:"";background:url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PScwIDAgNDM4IDgwJyB3aWR0aD0nMTYwJyBoZWlnaHQ9JzQwJyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHhtbG5zOnhsaW5rPSdodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rJz48Zz48cGF0aCBzdHlsZT0nZmlsbDojZmZmZmZmJyBkPSdNMzAuMjA4IDEuNjAySC44Nzh2NzYuMDM5aDI4Ljg5NWMyNy4zNzYgMCA0My4zNDItMTYuMjkzIDQzLjM0Mi0zOC4yMzV2LS4yMTljLjAwMi0yMS45NDMtMTUuNzUtMzcuNTg1LTQyLjkwNy0zNy41ODV6TTUxLjQ5OSAzOS43M2MwIDEyLjI3Mi04LjM2NCAxOS4yMjctMjAuOTY0IDE5LjIyN2gtOC41ODJWMjAuMjg2aDguNTgyYzEyLjYgMCAyMC45NjQgNy4wNiAyMC45NjQgMTkuMjI2di4yMTh6bTM1LjYyOSAzNy45MDdoMjEuMTgyVjEuNjAySDg3LjEyOHY3Ni4wMzV6bTcwLjA2NS00Ny4zNThjLTEwLjUzOC0yLjM5MS0xMy4xNDUtMy45MTEtMTMuMTQ1LTcuMzg1di0uMjJjMC0yLjcxNiAyLjUtNC44ODggNy42MDQtNC44ODggNi43MzMgMCAxNC4zMzggMi42MDUgMjEuMjkyIDcuNDk2bDEwLjUzNi0xNC44ODVDMTc1LjIyMyAzLjc3MiAxNjUuMTIyLjI5NCAxNTIuMTk2LjI5NGMtMTguMjUgMC0yOS40MzggMTAuMjEtMjkuNDM4IDI0LjMzMnYuMjE4YzAgMTUuNjQ0IDEyLjQ5MiAyMC4yMDcgMjguNjc2IDIzLjg5NiAxMC4zMiAyLjM4OSAxMi44MTggNC4xMjcgMTIuODE4IDcuMjc5di4yMTdjMCAzLjI1OC0zLjA0MiA1LjIxMy04LjY5IDUuMjEzLTguNzk4IDAtMTcuMTYzLTMuMTQ4LTI0LjY1Ny05LjEyM0wxMTkuMTczIDY2LjM0YzkuMzQyIDguMzY1IDIyLjE2IDEyLjYwNCAzNS42MyAxMi42MDQgMTguNDY2IDAgMzAuNzQyLTkuMjMyIDMwLjc0Mi0yNC43Njh2LS4yMTdjLS4wMDEtMTQuMjI5LTEwLjg2NS0xOS44NzctMjguMzUyLTIzLjY4em0xMjAuNTczIDkuMzQzdi0uMjE4QzI3Ny43NjYgMTcuNTcgMjYwLjM4Ny4wOCAyMzYuOTIyLjA4Yy0yMy40NjIgMC00MS4wNiAxNy43MDgtNDEuMDYgMzkuNTQydi4yMTZjMCAyMS44MzQgMTcuMzggMzkuMzI0IDQwLjg0NSAzOS4zMjQgOC42ODkgMCAxNi42MTktMi41IDIzLjEzNy02LjczNmw4LjM2MyA3LjQ5NCAxMC42NDUtMTEuODQtNy44MTgtNi42MjNjNC4zNDEtNi4xOTMgNi43MzItMTMuNzk5IDYuNzMyLTIxLjgzNXptLTIxLjM5OC40MzNjMCAyLjYwNy0uNDM1IDUuMTA1LTEuMzA0IDcuMzg0bC0xMC4zMTktOS4zNDFMMjM0LjEgNTAuMDQ3bDEwLjUzNyA5LjAxOGEyMS42NTUgMjEuNjU1IDAgMCAxLTcuNzExIDEuNDEyYy0xMS42MjEgMC0xOS40NDMtOS42NjYtMTkuNDQzLTIwLjYzOXYtLjIxNmMwLTEwLjk3MiA3LjcxMi0yMC41MzIgMTkuMjI1LTIwLjUzMiAxMS43MzMgMCAxOS42NjQgOS42NjggMTkuNjY0IDIwLjc0OHYuMjE2bC0uMDA0LjAwMXptODMuNTM0IDQuMzQ1YzAgMTAuNjQzLTUuNTQzIDE1LjYzOS0xNC4wMTYgMTUuNjM5LTguNDcyIDAtMTQuMDEzLTUuMjExLTE0LjAxMy0xNi4xODRWMS42MDJoLTIxLjM5N3Y0Mi42OWMwIDIzLjc4OSAxMy41NzggMzQuNzYzIDM1LjE5NCAzNC43NjMgMjEuNjE3IDAgMzUuNjI5LTEwLjc1NCAzNS42MjktMzUuMzA1VjEuNjAyaC0yMS4zOTdWNDQuNHptNjguODY4LTE0LjEyMWMtMTAuNTM3LTIuMzkxLTEzLjE0NS0zLjkxMS0xMy4xNDUtNy4zODV2LS4yMmMwLTIuNzE2IDIuNS00Ljg4OCA3LjYwNy00Ljg4OCA2LjczIDAgMTQuMzM4IDIuNjA1IDIxLjI4OSA3LjQ5Nkw0MzUuMDU5IDEwLjRDNDI2LjgwNSAzLjc3NSA0MTYuNzA1LjI5NyA0MDMuNzc4LjI5N2MtMTguMjUgMC0yOS40MzggMTAuMjEtMjkuNDM4IDI0LjMzMnYuMjE4YzAgMTUuNjQ0IDEyLjQ5MiAyMC4yMDUgMjguNjc3IDIzLjg5NiAxMC4zMTkgMi4zOTEgMTIuODE3IDQuMTI5IDEyLjgxNyA3LjI4di4yMTZjMCAzLjI1OC0zLjA0MyA1LjIxNS04LjY5IDUuMjE1LTguOCAwLTE3LjE2NC0zLjE1Mi0yNC42NTgtOS4xMjVsLTExLjcyOSAxNC4wMTJjOS4zNDMgOC4zNjcgMjIuMTYgMTIuNjAzIDM1LjYyNyAxMi42MDMgMTguNDY4IDAgMzAuNzQyLTkuMjMzIDMwLjc0Mi0yNC43Njd2LS4yMTljLS4wMDQtMTQuMjI4LTEwLjg2OC0xOS44NzYtMjguMzU2LTIzLjY3OXonPjwvcGF0aD48L2c+PC9zdmc+") no-repeat 10px 0;background-size:70%;opacity:0.3;top:0;left:0;bottom:0;right:0;position:absolute;z-index:1}
.open-recent{cursor:pointer;position:fixed;top:0;right:0;z-index:998}
.open-recent:focus,.open-recent:active,.close-recent:focus,.close-recent:active{outline:0}
.close-recent{position:absolute;top:0;right:0;width:50px;height:50px;line-height:45px;text-align:center;font-size:40px;font-weight:300;color:#fff;cursor:pointer;z-index:2}
.top-comments-box-fixed amp-iframe{height:calc(100vh - 50px);width:300px;position:absolute;top:50px;left:0;animation:myframe 1s;-moz-animation:myframe 1s;-webkit-animation:myframe 1s}
 
YENİ YAYIN
ÖNCEKİ YAYIN

"AMP HTML Blogger Siteleri İçin Disqus Son Yorumlar Widget Tasarımı" 0 Yorum yapıldı.

Yorum Gönder

Kaydol: Kayıt Yorumları (Atom)
×