Skip to content

Instantly share code, notes, and snippets.

View atomjoy's full-sized avatar

Atomjoy atomjoy

View GitHub Profile
@atomjoy
atomjoy / bw-theme.css
Last active March 1, 2025 20:04
Css minimal styles
/* @tailwind base;
@tailwind components;
@tailwind utilities; */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');
:root {
--bw-text-1: #0f0f0f;
@atomjoy
atomjoy / theme.css
Last active February 22, 2025 19:35
Dark, light mode css.
/* @tailwind base;
@tailwind components;
@tailwind utilities; */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');
:root {
--color-gray-50: #fafafa;
@atomjoy
atomjoy / Uuid.php
Last active February 19, 2025 20:27
Laravel Uuid model.
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Concerns\HasUuids;
use Illuminate\Support\Str;
/**
* Uuid class
@atomjoy
atomjoy / Product-attributes.md
Last active February 19, 2025 19:28
Product Attribute Management in Laravel, storing Product attributes such as Size, Color, Weight.

Product Attribute Management in Laravel

Product Attribute Management in Laravel, storing Product attributes such as Size, Color, Weight.

Product variants (many to many)

Products (id, name, desc, visible)
# 1, Shirt, Description, true
# 2, Laptop, Description, true
@atomjoy
atomjoy / InputAttrs.vue
Last active February 17, 2025 13:40
How to catch class attributes in vue 3 components.
<script setup>
import { useAttrs, ref } from 'vue';
const emits = defineEmits(['update:modelValue', 'valid', 'invalid']);
const props = defineProps({
modelValue: [String, Number],
name: { type: String },
label: { type: String },
placeholder: { type: String },
@atomjoy
atomjoy / Icon.vue
Last active February 25, 2025 16:53
Load svg dynamically in Vue 3
<script setup>
import editIcon from '@/assets/svg/edit-svgrepo-com.svg?raw';
</script>
<template>
<div class="svg-icon" v-html="editIcon"></div>
</template>
<style>
.svg-icon {
@atomjoy
atomjoy / singleton.js
Created February 15, 2025 11:30
Js singleton
// First example
export default class Singleton {
number = 0;
constructor() {
if (!!Singleton.instance) {
return Singleton.instance;
}
Singleton.instance = this;
// return this;
}
@atomjoy
atomjoy / Laravel-Custom-Exception-Handler.md
Last active May 4, 2025 09:02
Laravel custom exception handler with service provider (modules).

Laravel Custom Exception Handler

Laravel custom exception handler with service provider (modules).

ExceptionHandlerProvider.php

<?php

namespace App\Providers;
@atomjoy
atomjoy / Upload-avatar-fetch-javascript.md
Last active March 12, 2025 08:26
How to upload avatar using fetch function in JavaScript with Laravel.

Fetch API JavaScript

Upload avatar

Image upload form in html

<img src="/default/avatar.webp" alt="Avatar image" id="avatar">

<form method="post" enctype="multipart/form-data" onsubmit="getData(event)">
@atomjoy
atomjoy / Code-to-json.js
Created January 17, 2025 14:45
Code to json
function jsonEscape(str) {
return str.replace(/\n/g, "\\n").replace(/\r/g, "\\r").replace(/\t/g, "\\t");
}
function jsonEscapeCode(str) {
return str.replace(/"/g, '\\"').replace(/'/g, "\'");
}
let code = jsonEscapeCode(`<?php
$name = "Benny's";