newlogo

ilike.html

@@ -0,0 +1,390 @@
+{{template "base/head" .}}
+
+<style>
+
+:root{
+
+--bg:#020304;
+--green:#4af030;
+--dark:#0a0f0a;
+
+}
+
+
+body{
+
+background:black!important;
+color:var(--green);
+font-family:Courier New,monospace;
+overflow:hidden;
+
+}
+
+
+
+/* GRID */
+
+body::before{
+
+content:"";
+position:fixed;
+width:100%;
+height:100%;
+
+background-image:
+
+linear-gradient(rgba(0,255,0,0.06) 1px, transparent 1px),
+linear-gradient(90deg, rgba(0,255,0,0.06) 1px, transparent 1px);
+
+background-size:40px 40px;
+
+pointer-events:none;
+
+}
+
+
+
+/* CRT */
+
+body::after{
+
+content:"";
+position:fixed;
+width:100%;
+height:100%;
+
+background:
+
+linear-gradient(
+rgba(0,255,0,0.03),
+rgba(0,255,0,0.03)
+);
+
+animation:flicker 0.15s infinite;
+
+pointer-events:none;
+
+}
+
+
+@keyframes flicker{
+
+0%{opacity:0.9}
+50%{opacity:1}
+100%{opacity:0.9}
+
+}
+
+
+
+/* CENTER */
+
+.center{
+
+position:absolute;
+
+top:50%;
+left:50%;
+
+transform:translate(-50%,-50%);
+
+text-align:center;
+
+}
+
+
+
+/* LOGO */
+
+#logo3d{
+
+width:260px;
+height:260px;
+margin:auto;
+
+filter:
+
+drop-shadow(0 0 20px #4af030)
+drop-shadow(0 0 60px #4af030);
+
+}
+
+
+
+
+/* TEXT */
+
+.title{
+
+font-size:38px;
+
+margin-top:20px;
+
+text-shadow:0 0 20px #4af030;
+
+animation:flickerText 3s infinite;
+
+}
+
+
+
+@keyframes flickerText{
+
+0%,18%,22%,25%,53%,57%,100%{opacity:1}
+
+20%,24%,55%{opacity:0.4}
+
+}
+
+
+
+
+/* STATUS */
+
+.status{
+
+margin-top:20px;
+
+font-size:18px;
+
+opacity:0.8;
+
+}
+
+
+
+/* SCANNER */
+
+.scan{
+
+position:fixed;
+
+width:100%;
+height:3px;
+
+background:#4af030;
+
+box-shadow:0 0 20px #4af030;
+
+animation:scan 4s linear infinite;
+
+}
+
+
+@keyframes scan{
+
+0%{top:0}
+
+100%{top:100%}
+
+}
+
+
+
+</style>
+
+
+
+
+<div class="scan"></div>
+
+
+
+<div class="center">
+
+
+<div id="logo3d"></div>
+
+
+<div class="title">
+
+THIRD ECHELON
+
+</div>
+
+
+<div class="status" id="status">
+
+INITIALIZING SYSTEM...
+
+</div>
+
+
+</div>
+
+
+
+
+
+<script type="importmap">
+{
+"imports":{
+"three":
+"https://unpkg.com/three@0.128.0/build/three.module.js"
+}
+}
+</script>
+
+
+
+<script type="module">
+
+import * as THREE from "three";
+
+
+
+const container =
+document.getElementById("logo3d");
+
+
+
+const scene =
+new THREE.Scene();
+
+
+
+const camera =
+new THREE.PerspectiveCamera(
+45,
+1,
+0.1,
+1000
+);
+
+
+camera.position.z=3;
+
+
+
+const renderer =
+new THREE.WebGLRenderer({
+alpha:true,
+antialias:true
+});
+
+
+renderer.setSize(260,260);
+
+renderer.setClearColor(0x000000,0);
+
+
+container.appendChild(
+renderer.domElement
+);
+
+
+
+
+/* LOGO TEXTURE */
+
+const texture =
+new THREE.TextureLoader().load(
+
+"https://git.grenu4.ru/y0zhyck/templates-for-gitea/media/branch/main/assets/third-echelon-logo.png"
+
+);
+
+
+
+
+/* LOGO */
+
+const mesh =
+new THREE.Mesh(
+
+new THREE.CircleGeometry(1,64),
+
+new THREE.MeshBasicMaterial({
+
+map:texture,
+transparent:true
+
+})
+
+);
+
+
+scene.add(mesh);
+
+
+
+
+/* GLOW */
+
+const glow =
+new THREE.Mesh(
+
+new THREE.CircleGeometry(1.2,64),
+
+new THREE.MeshBasicMaterial({
+
+color:0x4af030,
+transparent:true,
+opacity:0.15
+
+})
+
+);
+
+
+scene.add(glow);
+
+
+
+
+
+function animate(){
+
+requestAnimationFrame(animate);
+
+mesh.rotation.y+=0.01;
+
+glow.rotation.y-=0.005;
+
+renderer.render(scene,camera);
+
+}
+
+
+animate();
+
+
+
+
+/* STATUS TEXT */
+
+const status =
+document.getElementById("status");
+
+
+setTimeout(()=>{
+
+status.innerHTML="CONNECTING TO NSA...";
+
+},2000);
+
+
+
+setTimeout(()=>{
+
+status.innerHTML="AUTHENTICATING OPERATIVE...";
+
+},4000);
+
+
+
+setTimeout(()=>{
+
+status.innerHTML="ACCESS GRANTED";
+
+status.style.color="#7CFF00";
+
+},6000);
+
+
+
+</script>
+
+
+
+{{template "base/footer" .}}