carusog

alias nvim-lazy="NVIM_APPNAME=LazyVim nvim"
alias nvim-kick="NVIM_APPNAME=kickstart nvim"
alias nvim-chad="NVIM_APPNAME=NvChad nvim"
alias nvim-astro="NVIM_APPNAME=AstroNvim nvim"

function nvims() {
  items=("default" "kickstart" "LazyVim" "NvChad" "AstroNvim")
  config=$(printf "%s\n" "${items[@]}" | fzf --prompt=" Neovim Config  " --height=~50% --layout=reverse --border --exit-0)
  if [[ -z $config ]]; then
    echo "Nothing selected"

carusog

Why I use web components

This is some sort of answer to recent posts regarding Web Components, where more than a few misconceptions were delivered as fact.

Let's start by defining what we are talking about.

The Web Components Umbrella

As you can read in the dedicated GitHub page, Web Components is a group of features, where each feature works already by itself, and it doesn't need other features of the group to be already usable, or useful.

carusog

Code is clean if it can be understood easily – by everyone on the team. Clean code can be read and enhanced by a developer other than its original author. With understandability comes readability, changeability, extensibility and maintainability.

---

General rules

1. Follow standard conventions.
2. Keep it simple stupid. Simpler is always better. Reduce complexity as much as possible.
3. Boy scout rule. Leave the campground cleaner than you found it.
4. Always find root cause. Always look for the root cause of a problem.

Design rules

carusog

fetch(`http://www.reddit.com/r/reactjs.json`)
.then(response => {
    if(response.ok) {
        console.log(response);
        return response.json();
    }
    throw new Error('Request failed'); 
})
.then(json => {
    const posts = json.data.children.map(

carusog

import {URLSearchParams} from '@angular/http';

export class QueryParamService {

  get(name: string) {
    const params = new URLSearchParams(window.location.search.substring(1));
    const param = params.get(name);
    return param === null ? null : decodeURIComponent(param);
  }

carusog

import {
  ElementRef
} from '@angular/core';  

// omitted code

constructor(private el: ElementRef) {
    console.log('###element', el);
  }

carusog

// LESS
.debug(@color: red, @opacity: 20%) {
  background-color: fade(@color, @opacity);
}

carusog

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle'
});

carusog

CSS Animated Hamburger Icon for Bootstrap

Bootstrap Animated Hamburger Icon with CSS transforms. No changes to any HTML required, just add the classes. The built-in "collapsed" class on the button will take care of transformations.

Some pens around use JavaScript to toggle .collapsed class on clicked .navbar-toggle (AKA the hamburger) since they suppose there is a bug in Bootstrap.js that doesn't toggle that class. It seems, instead (I didn't inspect the code), that .collapsed class is added only while using a class or an anchor name as collapsable target element. (credits: http://stackoverflow.com/a/31076793/877464)

A Pen by Giuseppe Caruso on CodePen.

carusog

$.fn.toggleClick = function(){
    var methods = arguments, // store the passed arguments for future reference
        count = methods.length; // cache the number of methods 

    //use return this to maintain jQuery chainability
    return this.each(function(i, item){
        // for each element you bind to
        var index = 0; // create a local counter for that element
        $(item).click(function(){ // bind a click handler to that element
            return methods[index++ % count].apply(this,arguments); // that when called will apply the 'index'th method to that element