I was really inspired by an old button from Aaron which had a glowing edge, using an SVG effect. I wanted to see if I can create something similar with CSS only.
I really love this.
A Pen by Kevin Marville on CodePen.
#!/bin/sh | |
# References | |
# https://www.pythonguis.com/tutorials/packaging-pyqt5-applications-pyinstaller-macos-dmg/ | |
# https://medium.com/@jackhuang.wz/in-just-two-steps-you-can-turn-a-python-script-into-a-macos-application-installer-6e21bce2ee71 | |
# --------------------------------------- | |
# Clean up previous builds | |
# --------------------------------------- |
animated login form with 2 rings - tried to make it as minimal as possible
A Pen by Kevin Marville on CodePen.
<nav> | |
<ul> | |
<li><a href="#" id="homeLink">Home</a></li> | |
<li><a href="#" id="tourLink">Virtual Tour</a></li> | |
<li><a href="#" id="mapLink">Map</a></li> | |
<li><a href="#" id="profileLink">Profile</a></li> | |
</ul> | |
</nav> | |
<div class="container" id="content"> |
# Step 1: Uninstall old versions of Docker, if any | |
# This ensures there are no conflicts with existing installations. | |
for pkg in docker.io docker-doc docker-compose docker-compose-v2 podman-docker containerd runc; do sudo apt-get remove -y $pkg; done | |
# Step 2: Update the package database | |
sudo apt-get update | |
# Step 3: Install required packages for Docker installation | |
sudo apt-get install -y ca-certificates curl gnupg lsb-release |
Prepare for your next developer job exam with our immersive Quizz Flash Cards RPG! 🎓✨ Dive into different stages, from front-end to back-end, ISTQB, and more, all while battling through questions and leveling up your character. 📈💥 Boost your knowledge with each correct answer and watch your power grow! Perfect for quick memoization and brain training. Ready to challenge yourself? Let the quest begin! 🚀🧠
Developed with care by kvnbbg 👨💻🌟
A Pen by Kevin Marville on CodePen.
Enquête is the first web app to guide users through the initial step of UX design thinking: Empathize. Designed as a quiz, Enquête helps you understand what users need, forming the basis for creating a comprehensive project brief (cahier des charges).
The steps of UX design thinking include:
🔍 Empathize: Understand the user through research. 📝 Define: Clearly articulate the problem you want to solve. 💡 Ideate: Brainstorm and generate creative solutions. 🔧 Prototype: Build tangible representations for a subset of ideas.
<nav class="bg-blue-600 p-4"> | |
<ul class="flex justify-around text-white"> | |
<li><a href="#" id="homeLink">Home</a></li> | |
<li><a href="#" id="tourLink">VR</a></li> | |
<li><a href="#" id="mapLink">Map</a></li> | |
<li><a href="#" id="videosLink">Videos</a></li> | |
<li><a href="#" id="profileLink">Me</a></li> | |
</ul> | |
</nav> |
<template> | |
<div id="app"> | |
<div class="onboarding" v-if="showOnboarding"> | |
<div class="modal" v-show="showLogin"> | |
<h2>Welcome!</h2> | |
<div class="tabs"> | |
<button :class="{ active: activeTab === 'login' }" @click="changeTab('login')">Login</button> | |
<button :class="{ active: activeTab === 'register' }" @click="changeTab('register')">Register</button> | |
</div> | |
<div class="content"> |