Skip to content

Instantly share code, notes, and snippets.

View codepedia-top's full-sized avatar
🏠
Working from home

Mahdi codepedia-top

🏠
Working from home
View GitHub Profile
@codepedia-top
codepedia-top / index.pug
Created January 7, 2024 15:42
interactive chart
.screenshot__wrapper
.project-profitability
.desktop__title
.desktop__title__button
.desktop__title__button
.desktop__title__button
.desktop__title__name
.desktop__body
.graph-dropdown
.graph-dropdown__label Insights
@codepedia-top
codepedia-top / index.html
Created November 7, 2023 15:39
404ErorrPage
<a href="https://codepen.io/ZonFire99/full/njdls/" class="viewFull" target="_parent">View in full it looks way better :)</a>
<div class="error">
<div class="wrap">
<div class="404">
<pre><code>
<span class="green">&lt;!</span><span>DOCTYPE html</span><span class="green">&gt;</span>
<span class="orange">&lt;html&gt;</span>
<span class="orange">&lt;style&gt;</span>
@codepedia-top
codepedia-top / index.html
Created October 31, 2023 09:34
2048 game in html and css
<div class="container">
<div class="heading">
<h1 class="title">2048</h1>
<div class="score-container">0</div>
</div>
<p class="game-intro">Join the numbers and get to the <strong>2048 tile!</strong></p>
<div class="game-container">
<div class="game-message">
<p></p>
@codepedia-top
codepedia-top / index.pug
Created October 27, 2023 08:55
3d keypad and monitor
qwediv.main.flex#m
div.keyboard.flex#k
div.screen.flex#s
div.keyboard__front.face
div.keyboard__back.face
div.keyboard__right.face
div.keyboard__left.face
div.keyboard__top.face
//----------------------
div.keys
@codepedia-top
codepedia-top / index.html
Created October 22, 2023 16:39
check out button
<div class="container">
<div class="left-side">
<div class="card">
<div class="card-line"></div>
<div class="buttons"></div>
</div>
<div class="post">
<div class="post-line"></div>
<div class="screen">
@codepedia-top
codepedia-top / index.html
Created October 17, 2023 13:16
rubic cube code
<!-- PWA: https://bsehovac.github.io/the-cube/ -->
<div class="ui">
<div class="ui__background"></div>
<div class="ui__game"></div>
<div class="ui__texts">
<h1 class="text text--title">
@codepedia-top
codepedia-top / index.html
Created October 14, 2023 15:53
passWord Strong meter
<div id="wrapper">
<div id="box">
<div class="side">
</div>
<div class="pass-wrapper">
<svg id="svg" viewBox="0 0 105.83333 105.83334">
</svg>
<div class="levels-container">
<div data-carac="length" data-level="0" class="level-line">
@codepedia-top
codepedia-top / Script.js
Created October 11, 2023 10:08
snake game with javaScript
/**
* Snake game created with plain JavaScript by Ibrahim fariat.
* Follow me if you like it!
**/
let dom_replay = document.querySelector("#replay");
let dom_score = document.querySelector("#score");
let dom_canvas = document.createElement("canvas");
document.querySelector("#canvas").appendChild(dom_canvas);
let CTX = dom_canvas.getContext("2d");
@codepedia-top
codepedia-top / index.html
Created October 9, 2023 11:05
red hat login
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<title>Red Hat Sign-In</title>
<meta name="description" content="sign-in page for Red Hat employees">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#cc0000">
<meta name="viewport" content="width=device-width, initial-scale=1">
@codepedia-top
codepedia-top / index.html
Created October 9, 2023 11:04
switch to dark mode and light mode
<input type="checkbox" id="toggle" class="toggle--checkbox">
<label for="toggle" class="toggle--label">
<span class="toggle--label-background"></span>
</label>
<div class="background"></div>