Rafael Camargo rafaelcamargo

Developer with a sharp eye for design.

rafaelcamargo / index.html

Created September 30, 2024 02:08

Font size clamping calculation easily explained

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Font size interpolation</title>
	<style>
	html,
	body {
	display: flex;

rafaelcamargo / index.html

Last active November 28, 2024 02:19

CSS :has

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>CSS :has</title>
	<link rel="preconnect" href="https://rsms.me/">
	<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
	<style>
	:root {

rafaelcamargo / index.html

Last active February 16, 2025 23:40

React Form Validation

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Newsletter Form</title>
	<script src="https://cdn.jsdelivr.net/npm/@babel/[email protected]/babel.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/[email protected]/umd/react.production.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/[email protected]/umd/react-dom.production.min.js"></script>
	<style>

rafaelcamargo / index.html

Last active February 22, 2025 22:31

Converter HTML para imagem

	<!DOCTYPE html>
	<html lang="pt">

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="preconnect" href="https://rsms.me/">
	<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
	<title>Converter HTML para imagem</title>

rafaelcamargo / index.html

Created February 22, 2025 22:31

Converting HTML to Image

	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="preconnect" href="https://rsms.me/">
	<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
	<title>Converting HTML to Image</title>

rafaelcamargo / async-task-runner.js

Created April 25, 2025 19:08

Async Task Runner

	function processTasks(tasks){
	if(!tasks?.length) return console.log('Finished');
	const [exec, ...rest] = tasks;
	setTimeout(() => {
	exec();
	processTasks(rest);
	});
	}

	const smallBatch = [

rafaelcamargo / index.html

Created May 30, 2025 16:27

Customizing checkboxes and radio buttons without hacks

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Customizing checkboxes and radio buttons without hacks</title>
	<style>
	html,
	body {
	margin: 0;