Skip to content

Instantly share code, notes, and snippets.

@neisdev
neisdev / halfmoon-starter-example.markdown
Created July 21, 2023 22:59
Halfmoon || Starter Example
@neisdev
neisdev / index.html
Created July 21, 2023 22:51
Task Management UI
<div class="h-screen w-screen bg-indigo-400 overflow-hidden absolute flex items-center">
<div class="w-screen h-64 absolute top-0 opacity-50 left-0 -my-40 -mx-64 bg-indigo-300 rounded-full"></div>
<div class="w-64 h-64 -mx-32 bg-indigo-300 opacity-50 rounded-full"></div>
<div class="w-64 h-64 ml-auto relative opacity-50 -mr-32 bg-indigo-300 rounded-full"></div>
<div class="w-screen h-64 absolute opacity-50 bottom-0 right-0 -my-40 -mx-64 bg-indigo-300 rounded-full"></div>
</div>
<div class="container mx-auto h-screen py-16 px-8 relative">
<div class="flex w-full rounded-lg h-full lg:overflow-hidden overflow-auto lg:flex-row flex-col shadow-2xl">
<div class="lg:w-1/2 bg-white text-gray-800 flex flex-col">
@neisdev
neisdev / alpine-x-mask-plugin-demo.markdown
Created July 4, 2023 08:36
Alpine x-mask Plugin Demo
@neisdev
neisdev / alpinejs-mentions-hashtags.markdown
Created May 16, 2023 08:26
AlpineJS: Mentions & Hashtags
@neisdev
neisdev / dashboard-with-tailwindcss-and-alpinejs.markdown
Created May 4, 2023 21:19
Dashboard with TailwindCSS and AlpineJS

Dashboard with TailwindCSS and AlpineJS

Simple admin panel or dashboard create with tailwindcss and alpinejs.

A Pen by Mithicher on CodePen.

License.

@neisdev
neisdev / index.html
Created May 4, 2023 08:37
Project creation panel
<div class="" id="createNewProject" tabindex="-1" role="dialog" aria-labelledby="createNewProject" aria-hidden="true">
<div class="modal-dialog" role="document">
<form id="formCreateNewProject">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Create new project</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
@neisdev
neisdev / index.html
Created May 4, 2023 08:16
Word Plugin
<style>
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap');
</style>
<div class="side-pane">
<p class="title-txt">
Flowcite
</p>
<div class="mainpanel">
<ul class="tab-panel">
<li class="active">
@neisdev
neisdev / index.html
Created May 3, 2023 13:50
Python - pruebas
<!DOCTYPE html>
<html lang="en">
<head>
<title>Online Python - IDE, Editor, Compiler, Interpreter</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
@neisdev
neisdev / ace-editor-multiple-tabs-js.markdown
Created May 2, 2023 12:26
Ace Editor Multiple Tabs JS
@neisdev
neisdev / index.html
Created April 29, 2023 18:54
Transition to Auto Height using Grid - Pure CSS Demo
<section class="w-screen min-h-screen py-6 px-12 flex flex-col bg-zinc-900 text-zinc-50 items-center justify-center">
<div class="w-full flex flex-col gap-3 max-w-screen-md">
<!-- FAQ 1 Start-->
<div class="w-full rounded bg-zinc-800 hover:bg-zinc-700">
<div class="flex flex-col">
<input id="faq1" type="checkbox" class="ml-auto sr-only peer">
<label for="faq1" class="flex py-2 px-4 mt-2 w-full items-center cursor-pointer">
<span class="font-medium text-lg">What is the meaning of life, the universe, and everything?</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="w-5 h-5 ml-auto">
<path d="M10.75 4.75a.75.75 0 00-1.5 0v4.5h-4.5a.75.75 0 000 1.5h4.5v4.5a.75.75 0 001.5 0v-4.5h4.5a.75.75 0 000-1.5h-4.5v-4.5z" />