lbssousa

VSCode + Dev Containers and Toolbx/Distrobox setup for Fedora Silverblue

PLEASE NOTE:

I personally don't use Flatpak VSCode anymore, since I switched from Fedora Silverblue to Universal Blue's project Bluefin-DX. I'll leave the instructions here for those who want them, but be aware that Flatpak VSCode instructions won't be maintained anymore.

Steps

If you prefer VSCode Flatpak

1. Install VSCode Flatpak from Flathub:

lbssousa

Tailwind CSS best practices

Utility classes

1. When writing a string of multiple utility classes, always do so in an order with meaning. The "Concentric CSS" approach works well with utility classes (i.e,. 1. positioning/visibility 2. box model 3. borders 4. backgrounds 5. typography 6. other visual adjustments). Once you establish a familiar pattern of ordering, parsing through long strings of utility classes will become much, much faster so a little more effort up front goes a long way!

2. Always use fewer utility classes when possible. For example, use mx-2 instead of ml-2 mr-2 and don't be afraid to use the simpler p-4 lg:pt-8 instead of the longer, more complicated pt-4 lg:pt-8 pr-4 pb-4 pl-4.

3. Prefix all utility classes that will only apply at a certain breakpoint with that breakpoint's prefix. For example, use block lg:flex lg:flex-col lg:justify-center instead of block lg:flex flex-col justify-center to make it very clear that the flexbox utilities are only applicable at the

lbssousa

/*
 * Usage in a component:
 *
 * import { createComponent } from '@vue/composition-api'
 * import { useTailwindBreakpoints } from 'path/to/useTailwindBreakpoints'
 * import tailwindConfig from 'tailwind.config.js'
 *
 * interface Props {
 *   (...)
 * }

lbssousa

<template>
  <div>
    <slot/>
  </div>
</template>

<script>
// @ts-check

/**

lbssousa

GENERAL INSTRUCTIONS
--------------------

1. Under your src-electron/ folder, create a folder called ppapi-flash-plugin and separate subfolders for your
   supported platforms (linux, win32, darwin) and architectures (ia32, x64).

2. Under each platform/architecture subfolder, put a copy of the plugin binary and manifest.json companion file.
   If needed, rename the binary files to pepflashplayer.dll (Windows), PepperFlashPlayer.plugin (macOS)
   or libpepflashplayer.so (Linux).

lbssousa

<template>
  (...)
  <parallax-scene :scalar-x="25" :scalar-y="15">
    <parallax-layer :depth="0.00">
      <img src="~assets/parallax/0_sun.png" style="position: relative; top: -4px;" draggable="false" alt="">
    </parallax-layer>
    <parallax-layer :depth="0.33">
      <img src="~assets/parallax/1_mountains.png" style="position: relative; top: 40px;" draggable="false" alt="">
    </parallax-layer>
    <parallax-layer :depth="0.67">

lbssousa

# -*- mode: ruby -*-
# vi: set ft=ruby :

$script = <<ENDSCRIPT
Home="/home/ubuntu"

# Altere os valores abaixo de acordo com o seu banco
Modulo="warsaw_setup_64.deb"
UrlModulo="https://guardiao.itau.com.br/warsaw/${Modulo}"
UrlBanco="http://www.itau.com.br"

lbssousa

# -*- mode: ruby -*-
# vi: set ft=ruby :

$script = <<ENDSCRIPT
Home="/home/ubuntu"

# Altere os valores abaixo de acordo com o seu banco
Modulo="GBPCEFwr64.deb"
UrlModulo="https://cloud.gastecnologia.com.br/cef/warsaw/install/${Modulo}"
UrlBanco="http://www.caixa.gov.br"