diff options
| author | r <r@freesoftwareextremist.com> | 2019-12-22 04:25:56 +0000 |
|---|---|---|
| committer | r <r@freesoftwareextremist.com> | 2019-12-22 04:25:56 +0000 |
| commit | 2506615f4228de4189202123d414e8f22b2c1c1b (patch) | |
| tree | 29714502bc9a778dd53a4c7e389839177f5309e6 | |
| parent | 4a83c22261e4e35de7366c9b815ef72d3555e5d9 (diff) | |
| download | bloat-2506615f4228de4189202123d414e8f22b2c1c1b.tar.gz bloat-2506615f4228de4189202123d414e8f22b2c1c1b.zip | |
Add nsfw mask for status media
| -rw-r--r-- | static/main.css | 24 | ||||
| -rw-r--r-- | templates/status.tmpl | 16 |
2 files changed, 36 insertions, 4 deletions
diff --git a/static/main.css b/static/main.css index 89bb9cd..2dcb4a6 100644 --- a/static/main.css +++ b/static/main.css @@ -97,6 +97,7 @@ max-height: 180px; max-width: 220px; width: auto; + vertical-align: bottom; } .page-title { @@ -280,4 +281,27 @@ .img-link { display: inline-block; + position: relative; +} + +.status-nsfw-overlay { + height: 100%; + width: 100%; + background: black; + position: absolute; + top: 0; + left: 0; +} + +.img-link:hover .status-nsfw-overlay { + display: none; +} + +.status-video-container { + display: inline-block; + position: relative; +} + +.status-video-container:hover .status-nsfw-overlay { + display: none; } diff --git a/templates/status.tmpl b/templates/status.tmpl index 7ec7d29..e62296d 100644 --- a/templates/status.tmpl +++ b/templates/status.tmpl @@ -61,6 +61,9 @@ {{if eq .Type "image"}} <a class="img-link" href="{{.URL}}" target="_blank"> <img class="status-image" src="{{.URL}}" alt="status-image" /> + {{if $.Sensitive}} + <div class="status-nsfw-overlay"></div> + {{end}} </a> {{else if eq .Type "audio"}} <audio class="status-audio" controls preload="none"> @@ -68,10 +71,15 @@ <p> Your browser doesn't support HTML5 audio </p> </audio> {{else if eq .Type "video"}} - <video class="status-video" controls preload="none"> - <source src="{{.URL}}"> - <p> Your browser doesn't support HTML5 video </p> - </video> + <div class="status-video-container"> + <video class="status-video" controls preload="none"> + <source src="{{.URL}}"> + <p> Your browser doesn't support HTML5 video </p> + </video> + {{if $.Sensitive}} + <div class="status-nsfw-overlay"></div> + {{end}} + </div> {{else}} <a href="{{.URL}}" target="_blank"> attachment </a> {{end}} |