Skip to content

Instantly share code, notes, and snippets.

View kyrylo's full-sized avatar
🦋
Fixing bugs

Kyrylo Silin kyrylo

🦋
Fixing bugs
View GitHub Profile
@kyrylo
kyrylo / index.html
Last active November 26, 2024 16:59
<details> dropdown with a backdrop
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dropdown with Backdrop</title>
<style>
body {
@kyrylo
kyrylo / index.html
Last active November 25, 2024 20:31
StimulusJS dropdown
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dropdown with Stimulus</title>
<script type="module">
import { Application, Controller } from "https://cdn.jsdelivr.net/npm/@hotwired/stimulus@3.2.2/+esm";
@kyrylo
kyrylo / index.html
Last active November 15, 2024 12:50
Got inspired by the "signup peekaboos" on Hey and Basecamp, and I love the concept! https://x.com/kyrylosilin/status/1856648149038686626
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Signup peekaboo 👻</title>
<script type="module">
import { Application, Controller } from "https://cdn.jsdelivr.net/npm/@hotwired/stimulus@3.2.2/+esm";
@kyrylo
kyrylo / index.html
Last active November 9, 2024 10:54
Beautiful animated gift box with CSS animations and Stimulus! 🎁 https://x.com/kyrylosilin/status/1855198338485735532
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Claim your gift</title>
<script type="module">
import { Application, Controller } from "https://cdn.jsdelivr.net/npm/@hotwired/stimulus@3.2.2/+esm";
@kyrylo
kyrylo / index.html
Last active November 7, 2024 11:31
Mobile-friendly testimonials in CSS (no JS!) with the columns property. https://x.com/kyrylosilin/status/1854465457513722207
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Masonry layout with CSS columns</title>
<style>
body { font-family: "Lucida Grande"; padding-bottom: 2000px; }
blockquote { margin: 0; }
@kyrylo
kyrylo / colorized_logger.rb
Last active December 11, 2024 00:26
Nice colorized logs for Rails apps! With this initializer, you can instantly colorize your Rails development logs. Just copy and paste the code, and it’ll work. https://x.com/kyrylosilin/status/1852308566201237815
# frozen_string_literal: true
# config/initializers/colorized_logger.rb
# This initializer adds color to the Rails logger output. It's a nice way to
# visually distinguish log levels.
module ColorizedLogger
COLOR_CODES = {
debug: "\e[36m", # Cyan
info: "\e[32m", # Green
warn: "\e[33m", # Yellow
@kyrylo
kyrylo / plain.css
Last active September 20, 2024 15:47
How to hide scrollbars in 2024
/* Plain CSS */
/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
-ms-overflow-style: none; /* IE and Edge */
@kyrylo
kyrylo / deploy.yml
Created September 13, 2024 10:56
Deploy with Kamal and GitHub Actions
name: Deploy
on:
push:
branches:
- main
jobs:
Deploy:
if: ${{ github.event_name == 'push' && github.ref == 'refs/heads/main' }}
@kyrylo
kyrylo / main_correct.go
Created September 10, 2024 15:14
How to wrap errors in Go (wrong)
// Correct way
package main
import (
"errors"
"fmt"
)
var errDoopsy = errors.New("doopsy")
@kyrylo
kyrylo / service.rb
Last active August 7, 2024 06:11
How to define service objects in Rails: the simple way
# frozen_string_literal: true
class ApplicationService
def self.call(...)
new(...).call
end
def initialize(...)
end
end