rails_app_generator 0.0.5 → 0.0.8

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: af4adc7a1c56e1146ad7c09a5de8e937a9dcf9c6dbe9c44b5792e498c5432050
-  data.tar.gz: bfb7e1727d74d4090ad8ee9f5bad62091abfce6631e22164483527ae9cafa486
+  metadata.gz: 41476a3a9b133970991c3fbf3562c102ba8249f5b682233f20d84884fb8af678
+  data.tar.gz: 3a9cf1a5878bbee17e0cfff3c6facac2c8af128bd940ce5bdc6bd5894b6c8cf3
 SHA512:
-  metadata.gz: c3e0485f02a267715227db3fd75c9e7b8f02d031661e40d3880edcc07a95f1351f7b94c5456456407d623b0ed3b2d8457e689a4f94cb6d9b5fc57f1ab0d11e68
-  data.tar.gz: 7f7ec8819fb75ba55e0b4e20f5532382e8bca334ea6ee895e2eb73001b34423538ff8876c1e54370c394bc9cac4a2b45e909954cfb9e3d5292092f187619dfcb
+  metadata.gz: 5c88ba2a2ea096fd88795844acd1437af6cc87398f63002ad34dfe99576284ef8ede1e6f34c57b1fe7be9b4fccf174d25211a9084ee8691004c7ed243bc6c061
+  data.tar.gz: 0a16711784c631424eea1d80174697b1e04df33d8803b0963e23b76f70c625ceaa05815b665c81ea78c6958872676632187d487e160e1781e90b914d93a1ef00

data/.rubocop.yml

@@ -16,6 +16,7 @@ Metrics/BlockLength:
   Exclude:
     - "**/spec/**/*"
     - "*.gemspec"
+    - "lib/rails_app_generator/app_generator.rb"
   IgnoredMethods:
     - configure
     - context

data/.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "docwriter.hotkey.mac": "⌥ + ."
+}

data/CHANGELOG.md

@@ -1,3 +1,26 @@
+## [0.0.7](https://github.com/klueless-io/rails_app_generator/compare/v0.0.6...v0.0.7) (2022-07-22)
+
+
+### Bug Fixes
+
+* add support for profiles and after templates ([1ecf4ab](https://github.com/klueless-io/rails_app_generator/commit/1ecf4abef1bc0f45928a33319ed9db8bebe1c27a))
+
+## [0.0.6](https://github.com/klueless-io/rails_app_generator/compare/v0.0.5...v0.0.6) (2022-07-21)
+
+
+### Bug Fixes
+
+* add a bunch of addons ([b781af6](https://github.com/klueless-io/rails_app_generator/commit/b781af66d7fe7d7dcd2550577166213deefc06c6))
+* add a bunch of addons ([d9a85b7](https://github.com/klueless-io/rails_app_generator/commit/d9a85b7b32c2c25577d98b4b3be9aab7947ff6e9))
+* update template paths in app_generator ([9b28a5e](https://github.com/klueless-io/rails_app_generator/commit/9b28a5ee58535a761581e619eb01dc3059a79948))
+
+## [0.0.5](https://github.com/klueless-io/rails_app_generator/compare/v0.0.4...v0.0.5) (2022-07-19)
+
+
+### Bug Fixes
+
+* add console output capture ([0d66a3b](https://github.com/klueless-io/rails_app_generator/commit/0d66a3ba19c2adbd0f2c0747b8212e7e628c22ba))
+
 ## [0.0.4](https://github.com/klueless-io/rails_app_generator/compare/v0.0.3...v0.0.4) (2022-07-19)
 
 

data/README.md

@@ -22,6 +22,15 @@ Or install it yourself as:
 gem install rails_app_generator
 ```
 
+## Notes
+
+You can use rails_app_generator to create Rails 7 applications
+You can use rails_app_generator with ruby 2.7 or 3.1
+
+Rails new uses a batteries included approach, this means that you get everything and if you don't want a feature you need to turn it off explicitly using --skip-feature
+I hope to change the focus in this project so that you get very minimal installation and then you turn on what you want explicitly.
+Templates for rails are separated from templates for addons
+
 ## Stories
 
 ### Main Story

data/after_templates/README.md

@@ -0,0 +1,3 @@
+# After Templates
+
+A set of templates that can be used via the `--template` argument

data/after_templates/___base_template.rb

@@ -0,0 +1 @@
+# frozen_string_literal: true

data/after_templates/___r7_hotwire.rb

@@ -0,0 +1 @@
+# frozen_string_literal: true

data/after_templates/rag_bootstrap/application-yield.html.erb

@@ -0,0 +1,5 @@
+    <div class="container">
+      <div class="row">
+        <%= yield %>
+      </div>
+    </div>

data/after_templates/rag_bootstrap/application.html.erb

@@ -0,0 +1,4 @@
+    <%= stylesheet_link_tag "custom-using-css" %>
+    <%= stylesheet_link_tag "custom-using-scss" %>
+    <%= stylesheet_link_tag "custom-component" %>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />

data/after_templates/rag_bootstrap/component-cards-fancy.css

@@ -0,0 +1,84 @@
+// Cards 1 : Source: https://codepen.io/donho_zamo/pen/YzXzPXZ
+
+/*----  Main Style  ----*/
+#cards_landscape_wrap-2{
+  text-align: center;
+  background: #F7F7F7;
+}
+#cards_landscape_wrap-2 .container{
+  padding-top: 80px; 
+  padding-bottom: 100px;
+}
+#cards_landscape_wrap-2 a{
+  text-decoration: none;
+  outline: none;
+}
+#cards_landscape_wrap-2 .card-flyer {
+  border-radius: 5px;
+}
+#cards_landscape_wrap-2 .card-flyer .image-box{
+  background: #ffffff;
+  overflow: hidden;
+  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.50);
+  border-radius: 5px;
+}
+#cards_landscape_wrap-2 .card-flyer .image-box img{
+  -webkit-transition:all .9s ease; 
+  -moz-transition:all .9s ease; 
+  -o-transition:all .9s ease;
+  -ms-transition:all .9s ease; 
+  width: 100%;
+  height: 200px;
+}
+#cards_landscape_wrap-2 .card-flyer:hover .image-box img{
+  opacity: 0.7;
+  -webkit-transform:scale(1.15);
+  -moz-transform:scale(1.15);
+  -ms-transform:scale(1.15);
+  -o-transform:scale(1.15);
+  transform:scale(1.15);
+}
+#cards_landscape_wrap-2 .card-flyer .text-box{
+  text-align: center;
+}
+#cards_landscape_wrap-2 .card-flyer .text-box .text-container{
+  padding: 30px 18px;
+}
+#cards_landscape_wrap-2 .card-flyer{
+  background: #FFFFFF;
+  margin-top: 50px;
+  -webkit-transition: all 0.2s ease-in;
+  -moz-transition: all 0.2s ease-in;
+  -ms-transition: all 0.2s ease-in;
+  -o-transition: all 0.2s ease-in;
+  transition: all 0.2s ease-in;
+  box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.40);
+}
+#cards_landscape_wrap-2 .card-flyer:hover{
+  background: #fff;
+  box-shadow: 0px 15px 26px rgba(0, 0, 0, 0.50);
+  -webkit-transition: all 0.2s ease-in;
+  -moz-transition: all 0.2s ease-in;
+  -ms-transition: all 0.2s ease-in;
+  -o-transition: all 0.2s ease-in;
+  transition: all 0.2s ease-in;
+  margin-top: 50px;
+}
+#cards_landscape_wrap-2 .card-flyer .text-box p{
+  margin-top: 10px;
+  margin-bottom: 0px;
+  padding-bottom: 0px; 
+  font-size: 14px;
+  letter-spacing: 1px;
+  color: #000000;
+}
+#cards_landscape_wrap-2 .card-flyer .text-box h6{
+  margin-top: 0px;
+  margin-bottom: 4px; 
+  font-size: 18px;
+  font-weight: bold;
+  text-transform: uppercase;
+  font-family: 'Roboto Black', sans-serif;
+  letter-spacing: 1px;
+  color: #00acc1;
+}

data/after_templates/rag_bootstrap/component-cards-fancy.html

@@ -0,0 +1,80 @@
+<!-- Topic Cards -->
+<div id="cards_landscape_wrap-2">
+  <div class="container">
+    <div class="row">
+      <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
+        <a href="">
+          <div class="card-flyer">
+            <div class="text-box">
+              <div class="image-box">
+                <img src="https://cdn.pixabay.com/photo/2018/03/30/15/11/deer-3275594_960_720.jpg" alt="" />
+              </div>
+              <div class="text-container">
+                <h6>Title 01</h6>
+                <p>
+                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
+                  industry's standard dummy text ever since the 1500s.
+                </p>
+              </div>
+            </div>
+          </div>
+        </a>
+      </div>
+      <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
+        <a href="">
+          <div class="card-flyer">
+            <div class="text-box">
+              <div class="image-box">
+                <img src="https://cdn.pixabay.com/photo/2018/04/09/19/55/low-poly-3305284_960_720.jpg" alt="" />
+              </div>
+              <div class="text-container">
+                <h6>Title 02</h6>
+                <p>
+                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
+                  industry's standard dummy text ever since the 1500s.
+                </p>
+              </div>
+            </div>
+          </div>
+        </a>
+      </div>
+      <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
+        <a href="">
+          <div class="card-flyer">
+            <div class="text-box">
+              <div class="image-box">
+                <img src="https://cdn.pixabay.com/photo/2018/04/06/13/46/poly-3295856_960_720.png" alt="" />
+              </div>
+
+              <div class="text-container">
+                <h6>Title 03</h6>
+                <p>
+                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
+                  industry's standard dummy text ever since the 1500s.
+                </p>
+              </div>
+            </div>
+          </div>
+        </a>
+      </div>
+      <div class="col-xs-12 col-sm-6 col-md-3 col-lg-3">
+        <a href="">
+          <div class="card-flyer">
+            <div class="text-box">
+              <div class="image-box">
+                <img src="https://cdn.pixabay.com/photo/2018/03/30/15/12/dog-3275593_960_720.jpg" alt="" />
+              </div>
+              <div class="text-container">
+                <h6>Title 04</h6>
+                <p>
+                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
+                  industry's standard dummy text ever since the 1500s.
+                </p>
+              </div>
+            </div>
+          </div>
+        </a>
+      </div>
+    </div>
+  </div>
+</div>

data/after_templates/rag_bootstrap/component-cards-staff.css

@@ -0,0 +1,90 @@
+// Cards 2 - Source: https://codepen.io/design007/pen/KKmbZzm
+
+@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
+@import url('https://use.fontawesome.com/releases/v5.13.0/css/all.css');
+:root {
+  --font3: 'Roboto', sans-serif;
+}
+
+.h1,
+h1 {
+  font-size: 1.5rem;
+}
+
+.container-fluid {
+  max-width: 1400px;
+}
+
+.card {
+  background: #fff;
+  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.08), 0 0 6px rgba(0, 0, 0, 0.05);
+  border: 1;
+  border-radius: 1rem;
+}
+
+.img-hover-zoom--colorize img {
+  border-radius: 50%;
+  width: 150px;
+  height: auto;
+  margin-top: 20px;
+  padding: 1px;
+  transition: transform 0.5s;
+  filter: grayscale(100%);
+}
+
+.img-hover-zoom--colorize:hover img {
+  filter: grayscale(0);
+  transform: scale(1.05);
+}
+
+.card h5 {
+  overflow: hidden;
+  height: 80px;
+  font-weight: 300;
+  font-size: 1rem;
+}
+
+.card h5 a {
+  color: black;
+  text-decoration: none;
+}
+
+.role {
+  color: #7a7a7a;
+}
+
+.box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.fab {
+  font-size: 1.5rem;
+  color: darkgray;
+  transition: transform 0.5s;
+}
+
+.fab:hover {
+  color: black;
+  transform: scale(1.1);
+}
+
+.card h2 {
+  font-size: 1rem;
+}
+
+/* MEDIA */
+
+@media only screen and (min-width: 1200px) {
+  .img-hover-zoom--colorize img {
+    width: 200px;
+  }
+}
+
+@media only screen and (min-width: 1200px) {
+  .h1,
+  h1 {
+    font-size: 2rem;
+  }
+}

data/after_templates/rag_bootstrap/component-cards-staff.html

@@ -0,0 +1,140 @@
+<div class="container p-5">
+  <div class="row row-cols-1 row-cols-xs-2 row-cols-sm-2 row-cols-lg-4 g-3">
+    <div class="col">
+      <div class="card h-100 shadow-sm">
+        <div class="text-center">
+          <div class="img-hover-zoom img-hover-zoom--colorize">
+            <img
+              class="shadow"
+              src="https://source.unsplash.com/rDEOVtE7vOs/600x600"
+              alt="Another Image zoom-on-hover effect"
+            />
+          </div>
+        </div>
+
+        <div class="card-body">
+          <div class="clearfix mb-3"></div>
+
+          <div class="my-2 text-center">
+            <h1>Mia Wallace</h1>
+          </div>
+          <div class="mb-3">
+            <h2 class="text-uppercase text-center role">Senior Frontend Developer</h2>
+          </div>
+          <div class="box">
+            <div>
+              <ul class="list-inline">
+                <li class="list-inline-item"><i class="fab fa-github"></i></li>
+                <li class="list-inline-item"><i class="fab fa-linkedin-in"></i></li>
+                <li class="list-inline-item"><i class="fab fa-instagram"></i></li>
+                <li class="list-inline-item"><i class="fab fa-twitter"></i></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card h-100 shadow-sm">
+        <div class="text-center">
+          <div class="img-hover-zoom img-hover-zoom--colorize">
+            <img
+              class="shadow"
+              src="https://source.unsplash.com/XHVpWcr5grQ/600x600"
+              alt="Another Image zoom-on-hover effect"
+            />
+          </div>
+        </div>
+
+        <div class="card-body">
+          <div class="clearfix mb-3"></div>
+
+          <div class="my-2 text-center">
+            <h1>Vincent Vega</h1>
+          </div>
+          <div class="mb-3">
+            <h2 class="text-uppercase text-center role">SEO Specialist</h2>
+          </div>
+          <div class="box">
+            <div>
+              <ul class="list-inline">
+                <li class="list-inline-item"><i class="fab fa-github"></i></li>
+                <li class="list-inline-item"><i class="fab fa-linkedin-in"></i></li>
+                <li class="list-inline-item"><i class="fab fa-instagram"></i></li>
+                <li class="list-inline-item"><i class="fab fa-twitter"></i></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card h-100 shadow-sm">
+        <div class="text-center">
+          <div class="img-hover-zoom img-hover-zoom--colorize">
+            <img
+              class="shadow"
+              src="https://source.unsplash.com/n4KewLKFOZw/600x600"
+              alt="Another Image zoom-on-hover effect"
+            />
+          </div>
+        </div>
+
+        <div class="card-body">
+          <div class="clearfix mb-3"></div>
+
+          <div class="my-2 text-center">
+            <h1>Mr. Wolf</h1>
+          </div>
+          <div class="mb-3">
+            <h2 class="text-uppercase text-center role">DIGITAL MARKETING SPECIALIST</h2>
+          </div>
+          <div class="box">
+            <div>
+              <ul class="list-inline">
+                <li class="list-inline-item"><i class="fab fa-github"></i></li>
+                <li class="list-inline-item"><i class="fab fa-linkedin-in"></i></li>
+                <li class="list-inline-item"><i class="fab fa-instagram"></i></li>
+                <li class="list-inline-item"><i class="fab fa-twitter"></i></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card h-100 shadow-sm">
+        <div class="text-center">
+          <div class="img-hover-zoom img-hover-zoom--colorize">
+            <img
+              class="shadow"
+              src="https://source.unsplash.com/B4TjXnI0Y2c/600x600"
+              alt="Another Image zoom-on-hover effect"
+            />
+          </div>
+        </div>
+
+        <div class="card-body">
+          <div class="clearfix mb-3"></div>
+
+          <div class="my-2 text-center">
+            <h1>O-Ren Ishii</h1>
+          </div>
+          <div class="mb-3">
+            <h2 class="text-uppercase text-center role">Web Developer</h2>
+          </div>
+          <div class="box">
+            <div>
+              <ul class="list-inline">
+                <li class="list-inline-item"><i class="fab fa-github"></i></li>
+                <li class="list-inline-item"><i class="fab fa-linkedin-in"></i></li>
+                <li class="list-inline-item"><i class="fab fa-instagram"></i></li>
+                <li class="list-inline-item"><i class="fab fa-twitter"></i></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

data/after_templates/rag_bootstrap/component-cards-styled.html

@@ -0,0 +1,31 @@
+<div class="m-4">
+  <div class="row row-cols-1 row-cols-md-3 g-3">
+      <div class="col">
+          <!-- Card with default left text alignment -->
+          <div class="card">
+              <div class="card-body card1">
+                  <h3 class="card-title">Bootstrap @import</h3>
+                  <p class="card-text">Use standard SAAS transpiling</p>
+              </div>
+          </div>
+      </div>
+      <div class="col">
+          <!-- Card with center text alignment -->
+          <div class="card text-center">
+              <div class="card-body card2">
+                  <h3 class="card-title">CSS</h3>
+                  <p class="card-text">Using plain CSS files</p>
+              </div>
+          </div>
+      </div>
+      <div class="col">
+      <!-- Card with right text alignment -->
+          <div class="card text-end">
+              <div class="card-body card3">
+                  <h3 class="card-title">SCSS</h3>
+                  <p class="card-text">Using SASS/SCSS files</p>
+              </div>
+          </div>
+      </div>
+  </div>
+</div>

data/after_templates/rag_bootstrap/component-footer.html

@@ -0,0 +1,34 @@
+<footer class="bg-dark text-center text-white">
+  <!-- Grid container -->
+  <div class="container p-4 pb-0">
+    <!-- Section: Social media -->
+    <section class="mb-4">
+      <!-- Facebook -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-facebook-f"></i></a>
+
+      <!-- Twitter -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-twitter"></i></a>
+
+      <!-- Google -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-google"></i></a>
+
+      <!-- Instagram -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-instagram"></i></a>
+
+      <!-- Linkedin -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-linkedin-in"></i></a>
+
+      <!-- Github -->
+      <a class="btn btn-outline-light btn-floating m-1" href="#!" role="button"><i class="fab fa-github"></i></a>
+    </section>
+    <!-- Section: Social media -->
+  </div>
+  <!-- Grid container -->
+
+  <!-- Copyright -->
+  <div class="text-center p-3" style="background-color: rgba(0, 0, 0, 0.2)">
+    © 2020 Copyright:
+    <a class="text-white" href="https://mdbootstrap.com/">MDBootstrap.com</a>
+  </div>
+  <!-- Copyright -->
+</footer>

data/after_templates/rag_bootstrap/component-hero.html

@@ -0,0 +1,15 @@
+<div class="px-4 pt-5 my-5 text-center border-bottom">
+  <h1 class="display-4 fw-bold">Centered screenshot</h1>
+  <div class="col-lg-6 mx-auto">
+    <p class="lead mb-4">Quickly design and customize responsive mobile-first sites with Bootstrap, the world’s most popular front-end open source toolkit, featuring Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful JavaScript plugins.</p>
+    <div class="d-grid gap-2 d-sm-flex justify-content-sm-center mb-5">
+      <button type="button" class="btn btn-primary btn-lg px-4 me-sm-3"  data-bs-toggle="modal" data-bs-target="#exampleModal">Click Me</button>
+      <%= link_to 'People',  people_path, class: "btn btn-outline-secondary btn-lg px-4" %>
+    </div>
+  </div>
+  <div class="overflow-hidden" style="max-height: 30vh;">
+    <div class="container px-5">
+      <img src="https://getbootstrap.com/docs/5.0/examples/heroes/bootstrap-themes.png" class="img-fluid border rounded-3 shadow-lg mb-4" alt="Example image" width="700" height="500" loading="lazy">
+    </div>
+  </div>
+</div>

data/after_templates/rag_bootstrap/component-nav.html

@@ -0,0 +1,36 @@
+<nav class="navbar navbar-expand-lg navbar-light bg-light">
+  <div class="container-fluid">
+    <a class="navbar-brand" href="#">Navbar</a>
+    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="navbar-toggler-icon"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+      <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+        <li class="nav-item">
+          <a class="nav-link active" aria-current="page" href="#">Home</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link" href="#">Link</a>
+        </li>
+        <li class="nav-item dropdown">
+          <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
+            Dropdown
+          </a>
+          <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
+            <li><a class="dropdown-item" href="#">Action</a></li>
+            <li><a class="dropdown-item" href="#">Another action</a></li>
+            <li><hr class="dropdown-divider"></li>
+            <li><a class="dropdown-item" href="#">Something else here</a></li>
+          </ul>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
+        </li>
+      </ul>
+      <form class="d-flex">
+        <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
+        <button class="btn btn-outline-success" type="submit">Search</button>
+      </form>
+    </div>
+  </div>
+</nav>

data/after_templates/rag_bootstrap/custom-bootstrap-import.scss

@@ -0,0 +1,5 @@
+.card1 {
+  $color-left: #ffafbd;
+  $color-right: #ffc3a0;
+  background-image: linear-gradient(to right, $color-left, $color-right);
+}

data/after_templates/rag_bootstrap/custom-using-css.css

@@ -0,0 +1,3 @@
+.card2 {
+  background-image: linear-gradient(to bottom, #ff8f1f, #f32b60);
+}

data/after_templates/rag_bootstrap/custom-using-scss.scss

@@ -0,0 +1,5 @@
+.card3 {
+  $color-left: #ffdde1;
+  $color-right: #ee9ca7;
+  background-image: linear-gradient(to right, $color-left, $color-right);
+}

data/after_templates/rag_bootstrap/manifest.js

@@ -0,0 +1,3 @@
+//= link custom-using-css.css
+//= link custom-using-scss.css  
+//= link custom-component.css  

data/after_templates/rag_bootstrap.rb

@@ -0,0 +1 @@
+# frozen_string_literal: true

data/after_templates/rag_simple.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+# Rails 7 with Bootstrap CSS and custom CSS
+# https://www.youtube.com/watch?v=tYr8yn7yRKw
+
+require 'pry'
+
+self.local_template_path = File.join(File.dirname(__FILE__), 'rag_simple')
+
+gac 'base rails 7 image created'
+
+def application_html
+  <<-HTML
+    <div class="container">
+      <div class="row">
+        <%= yield %>
+      </div>
+    </div>
+  HTML
+end
+
+gsub_file 'app/views/layouts/application.html.erb' , %(    <%= yield %>), application_html
+
+# after_bundle do
+# end