xref: /template/writr/css/plugins/disqus.less (revision d3dfa73c67fc0f0c357a9dd724fecbdce114041c) 
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