john-hamnavoe

Introduction

Adding pagy and ransack in rails so can have search function, paging and sorting on table of date on index controller. We also will use kredis to make it easy to store users last search/sort etc. between pages.

Install

Gemfile:

gem "pagy" gem "ransack"

drnic

import { Controller } from "@hotwired/stimulus"
import SignaturePad from 'signature_pad'

export default class extends Controller {
  static targets = ["canvas", "input"]
  connect() {
    this.signaturePad = new SignaturePad(this.canvasTarget)
    this.signaturePad.addEventListener("endStroke", this.endStroke)
    this.resizeCanvas()
    if (this.inputTarget.value) {

zealot128

# frozen_string_literal: true
#
# Uncomment this and change the path if necessary to include your own
# components.
# See https://github.com/heartcombo/simple_form#custom-components to know
# more about custom components.
# Dir[Rails.root.join('lib/components/**/*.rb')].each { |f| require f }
#
# Use this setup block to configure all options available in SimpleForm.
SimpleForm.setup do |config|

iamtekeste

# Used as the base secret for all MessageVerifiers in Rails, including the one protecting cookies.
secret_key_base: "key generated from <rails secret>"
production:
    database_username: username
    database_password: password

alexreardon

Drag and drop

This is a collection of knowledge I have built up regarding browser powered drag and drop functionality

Events

dragstart

• timing: once as drag is starting
• event.target: draggable Element

equivalent

• Rails 7.0.2
• stimulus js
• importmaps
• dropzone.js
• direct upload ActiveStorage

This is simple implementation of technologies in hobby project of mine built in Rails7 where I need direct upload to S3.

tabishiqbal

<%= form_with(model: team) do |form| %>
  <div>
    <%= form.label :name %>
    <%= form.text_field :name, class: "input" %>
  </div>

  <div>
    <%= f.select :user_id, {}, {placeholder: "Select user"}, {class: "w-full", data: { controller: "select", select_url_value: users_path }} %>
  </div>

marcus-at-localhost

/* -------------------------------------------------------------------------- */
// All Bootstrap 5 Sass Mixins [ Cheat sheet ]
// Updated to Bootstrap v5.1.x
// @author https://anschaef.de
// @see https://github.com/twbs/bootstrap/tree/main/scss/mixins
// @see https://github.com/twbs/bootstrap/blob/main/scss/_variables.scss
/* -------------------------------------------------------------------------- */

// Options
// @see https://getbootstrap.com/docs/5.1/customize/options/

anschaef

/* -------------------------------------------------------------------------- */
// All Bootstrap 5 Sass Mixins [ Cheat sheet ]
// Updated to Bootstrap v5.1.x
// @author https://anschaef.de
// @see https://github.com/twbs/bootstrap/tree/main/scss/mixins
// @see https://github.com/twbs/bootstrap/blob/main/scss/_variables.scss
/* -------------------------------------------------------------------------- */

// Options
// @see https://getbootstrap.com/docs/5.1/customize/options/

bjo3rnf

<button type="submit"
        class="btn"
        data-controller="confirm-submit"
        data-confirm-submit-confirmation-label-value="Are you sure?"
        data-confirm-submit-warning-class="btn--warning"
        data-action="click->confirm-submit#click">
    Submit
</button>