Skip to content

Instantly share code, notes, and snippets.

View meta-n4vn33t's full-sized avatar
💭
I may be slow to respond.

Arya Navneet meta-n4vn33t

💭
I may be slow to respond.
View GitHub Profile
@meta-n4vn33t
meta-n4vn33t / index.html
Last active October 23, 2021 17:41
Pure CSS Gradient Background Animation
<h1 class="text-light">Pure CSS Animated Gradient Background</h1>
<div class="btn-group mt-2 mb-4" role="group" aria-label="actionButtons">
<a href="https://codepen-api-export-production.s3.us-west-2.amazonaws.com/zip/PEN/pyBNzX/1578778289271/pure-css-gradient-background-animation.zip" class="d-block btn btn-outline-light" download><i class="fas fa-file-download mr-2"></i>Download Source</a>
<a href="https://manuelpinto.in" target="_blank" class="d-block btn btn-outline-light">Visit my Website<i class="fas fa-external-link-square-alt ml-2"></i></a>
</div>
<h6 class="text-light small font-weight-bold"><i class="fas fa-code"></i> with <i class="fas fa-heart"></i> by Manuel Pinto</h6>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/js/all.min.js" integrity="sha256-qM7QTJSlvtPSxVRjVWNM2OfTAz/3k5ovHOKmKXuYMO4=" crossorigin="anonymous"></script>

Content aware dropdown

Stripe.com style dropdown, that measures the dropdown content size, and makes a backdrop follower accordingly.

A Pen by Rune Sejer Hoffmann on CodePen.

License.

@meta-n4vn33t
meta-n4vn33t / css-stripe-background-inspired-by-stripe-atlas.markdown
Created March 15, 2020 02:30
CSS Stripe background inspired by Stripe Atlas
@meta-n4vn33t
meta-n4vn33t / index.html
Created March 15, 2020 02:26
Menu (similar stripe)
<div class="container">
<div class="row">
<div class="col-12 my-5">
<nav class="cei-header-nav">
<button class="cei-btn-menu d-block d-lg-none d-xl-none" type="button" aria-label="Toggle navigation">
<span>Menu</span>
<i class="icon ion-md-menu"></i>
</button>
@meta-n4vn33t
meta-n4vn33t / index.pug
Created March 15, 2020 02:25
Stripes background
.stripes-container
.stripes.stripes--teal
- for (var x = 0; x < 5; x++)
span(class='s'+(x+1))
.stripes-container
.stripes.stripes--blue
- for (var x = 0; x < 6; x++)
span(class='s'+(x+1))
.stripes-container
.stripes.stripes--peach
@meta-n4vn33t
meta-n4vn33t / preseed.cfg.j2
Created September 4, 2019 12:31
Ansible Template for Debian Auto Install with Virtual Disk, 2 Network Cards.
-append "preseed/url={{ item.value.preseed | default(deployments[item.value.type].preseed) }}
debian-installer/allow_unauthenticated_ssl=true
debian-installer/locale=en_US.UTF-8
keyboard-configuration/layoutcode=us
console-setup/ask_detect=false
debian/priority=critical
vga=normal
netcfg/choose_interface=auto
localechooser/translation/warn-light=true
@meta-n4vn33t
meta-n4vn33t / README-Template.md
Created January 3, 2019 22:19 — forked from PurpleBooth/README-Template.md
A template to make good README.md

Project Title

One Paragraph of project description goes here

Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.

Prerequisites

@meta-n4vn33t
meta-n4vn33t / earth-day-night-click-on-image.markdown
Created December 9, 2018 19:31
Earth Day & Night (Click on Image)

Earth Day & Night (Click on Image)

An Earth pen for CodePen's challenge!

SVG made with Sketch, and animated using GSAP

A Pen by N K I on CodePen.