diff --git a/assets/css/crt-screen.css b/assets/css/crt-screen.css index 10ffe8a..d284da7 100644 --- a/assets/css/crt-screen.css +++ b/assets/css/crt-screen.css @@ -25,4 +25,14 @@ layout: none height: 480px; width: 640px; overflow: scroll; +} + +.screen-content::before{ + z-index: 2; + pointer-events: none; + background-image: url({{site.baseurl}}/assets/images/scanline.png); + background-repeat: repeat; + width:200px; + height:200px; + } \ No newline at end of file diff --git a/assets/css/crt.css b/assets/css/crt.css index c9f3eb1..a13254f 100644 --- a/assets/css/crt.css +++ b/assets/css/crt.css @@ -151,26 +151,19 @@ http://aleclownes.com/2017/02/01/crt-display.html opacity: 0; z-index: 2; pointer-events: none; - /*animation: flicker 3s infinite;*/ + animation: flicker 3s infinite; } .crt::before { - /*content: " "; + content: " "; display: block; position: absolute; top: 0; left: 0; bottom: 0; - right: 0;*/ - /*background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));*/ - z-index: 2; - /*background-size: 100% 2px, 3px 100%;*/ - pointer-events: none; - background-image: url({{site.baseurl}}/assets/images/scanline.png); - background-repeat: repeat; - width:200px; - height:200px; - + right: 0; + background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06)); + background-size: 100% 2px, 3px 100%; } .crt { - /*animation: textShadow 5s infinite;*/ + animation: textShadow 5s infinite; } \ No newline at end of file