1/* =Disqus Plugin 2----------------------------------------------- */ 3 4.dokuwiki { 5 &.makeFullWidth { 6 #disqus__thread { 7 &::after, 8 &::before { 9 width: ~"calc(100vw - 400px - @{ini_content_border})"; 10 } 11 } 12 } 13 14 #disqus__thread { 15 position: relative; 16 margin: 0px -40px; 17 padding: 16px 0px; 18 background-color: @ini_background; 19 20 &::before, 21 &::after { 22 position: absolute; 23 left: 0; 24 height: 16px; 25 line-height: 16px; 26 width: @ini_content_width; 27 background-color: @ini_background; 28 color: @ini_background; 29 pointer-events: none; 30 content: ""; 31 } 32 33 &::before { 34 top: 16px; 35 border-bottom-left-radius: 16px; 36 border-bottom-right-radius: 16px; 37 } 38 39 &::after { 40 bottom: 16px; 41 border-top-left-radius: 16px; 42 border-top-right-radius: 16px; 43 } 44 45 iframe[id^="dsq-app"]{ 46 display: block; 47 background-color: @ini_text_alt; 48 padding: 40px; 49 box-sizing: border-box; 50 margin: 0; 51 } 52 } 53} 54 55@media only screen and (max-width: 959px) { 56 .dokuwiki { 57 #disqus__thread { 58 &::after, 59 &::before { 60 width: ~"calc(100vw - 100px - 40px)"; 61 } 62 } 63 } 64} 65 66@media only screen and (max-width: 767px) { 67 .dokuwiki { 68 #disqus__thread { 69 &::after, 70 &::before { 71 width: 100vw; 72 } 73 } 74 } 75} 76 77