effect only in the center
This commit is contained in:
parent
912b3c28c9
commit
ad038d6221
@ -24,15 +24,16 @@ layout: none
|
||||
/* padding-right: 50px; */
|
||||
height: 480px;
|
||||
width: 640px;
|
||||
overflow: scroll;
|
||||
overflow-y: auto;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.screen-content::before{
|
||||
z-index: 2;
|
||||
/* z-index: 2;
|
||||
pointer-events: none;
|
||||
background-image: url({{site.baseurl}}/assets/images/scanline.png);
|
||||
background-repeat: repeat;
|
||||
width:200px;
|
||||
height:200px;
|
||||
height:200px;*/
|
||||
|
||||
}
|
@ -143,26 +143,30 @@ http://aleclownes.com/2017/02/01/crt-display.html
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
top: auto;
|
||||
left: auto;
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
background: rgba(18, 16, 16, 0.1);
|
||||
opacity: 0;
|
||||
z-index: 2;
|
||||
pointer-events: none;
|
||||
animation: flicker 3s infinite;
|
||||
width: 640px;
|
||||
height: 480px;
|
||||
}
|
||||
.crt::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
top: auto;
|
||||
left: auto;
|
||||
bottom: auto;
|
||||
right: auto;
|
||||
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%;
|
||||
width: 640px;
|
||||
height: 480px;
|
||||
}
|
||||
.crt {
|
||||
animation: textShadow 5s infinite;
|
||||
|
Loading…
Reference in New Issue
Block a user