A Pen by Matt Popovich

Developer
Size
3,349 Kb
Views
42,504

How do I make an a pen by matt popovich?

What is a a pen by matt popovich? How do you make a a pen by matt popovich? This script and codes were developed by Matt Popovich on 02 August 2022, Tuesday.

A Pen by Matt Popovich Previews

A Pen by Matt Popovich - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Matt Popovich</title> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<body class="noisy"></body>
<div class="frame"> <div class="piece output"> <p>All these worlds</p> <p>are yours except</p> <p>Europa</p> <p>Attempt no</p> <p>landing there</p> <p>Use them together</p> <p>Use them in peace</p> </div> <div class="piece scanlines noclick"> <div class="piece glow noclick"></div>
</div>
</body>
</html>

A Pen by Matt Popovich - Script Codes CSS Codes

@import url(https://fontlibrary.org/face/retroscape);
* { box-sizing: border-box;
}
body { background: rgba(0, 0, 0, 0.9); color: #14fdce; font-family: 'RetroscapeRegular'; font-size: 1em; line-height: 1.5; text-transform: uppercase; letter-spacing: 0.12rem; word-wrap: break-word;
}
h1 { font-size: 1.1rem;
}
p { margin-bottom: 2rem;
}
a, a:visited { border-bottom: 0.2rem solid #14fdce; color: #14fdce; text-decoration: none;
}
a:active, a:focus, a:hover { background-color: #14fdce; color: #031e11;
}
.piece { display: block; height: 100%; left: 0; top: 0; width: 100%;
}
.noclick { pointer-events: none;
}
.frame { background-color: transparent; border-radius: 3rem; border: 1rem solid; border-bottom-color: #121212; border-left-color: #080808; border-right-color: #080808; border-top-color: #020202; box-shadow: inset 0 0 10rem black, inset 0 0 1rem black, 0 0 10rem black; height: 90%; position: absolute; top: 5%; left: 2%; width: 96%; pointer-events: none;
}
.output { background-color: #031e11; overflow: scroll; position: absolute; padding: 2rem 3rem; pointer-events: auto; text-shadow: 0rem 0.2rem 1rem #0c7b46; z-index: -1; overflow-x: hidden;
}
.scanlines { background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.2) 70%, rgba(0, 0, 0, 0.6)); background: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.2) 70%, rgba(0, 0, 0, 0.6)); background-size: 100% 0.3rem; border-radius: 2rem; position: absolute;
}
.glow { -webkit-animation: flicker0 0.1s infinite; animation: flicker 0.1s infinite; background: -webkit-radial-gradient(center circle, #1bd459 0%, rgba(27, 212, 89, 0.88) 58%, rgba(21, 235, 92, 0.57) 80%, rgba(19, 94, 29, 0.27) 93%, rgba(10, 23, 12, 0) 100%); background: radial-gradient(circle at center, #1bd459 0%, rgba(27, 212, 89, 0.88) 58%, rgba(21, 235, 92, 0.57) 80%, rgba(19, 94, 29, 0.27) 93%, rgba(10, 23, 12, 0) 100%); opacity: 0.15; pointer-events: none; position: fixed;
}
@-webkit-keyframes flicker { 0% { opacity: 0.105; } 25% { opacity: 0.1; } 27% { opacity: 0.1; } 30% { opacity: 0.11; } 40% { opacity: 0.1; } 42% { opacity: 0.075; } 45% { opacity: 0.1; } 50% { opacity: 0.105; } 60% { opacity: 0.1; } 70% { opacity: 0.1; } 72% { opacity: 0.075; } 75% { opacity: 0.1; } 78% { opacity: 0.105; } 85% { opacity: 0.11; } 100% { opacity: 0.1; }
}
@keyframes flicker { 0% { opacity: 0.105; } 25% { opacity: 0.1; } 27% { opacity: 0.1; } 30% { opacity: 0.11; } 40% { opacity: 0.1; } 42% { opacity: 0.075; } 45% { opacity: 0.1; } 50% { opacity: 0.105; } 60% { opacity: 0.1; } 70% { opacity: 0.1; } 72% { opacity: 0.075; } 75% { opacity: 0.1; } 78% { opacity: 0.105; } 85% { opacity: 0.11; } 100% { opacity: 0.1; }
}
::-moz-selection { background-color: #14fdce; color: #031e11;
}
::selection { background-color: #14fdce; color: #031e11;
}
A Pen by Matt Popovich - Script Codes
A Pen by Matt Popovich - Script Codes
Home Page Home
Developer Matt Popovich
Username mpopv
Uploaded August 02, 2022
Rating 3
Size 3,349 Kb
Views 42,504
Do you need developer help for A Pen by Matt Popovich?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Matt Popovich (mpopv) Script Codes
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!