zaczero / bootstrap-v4-snippets Goto Github PK

This is something important, even more for component layouts like those in Bootstrap.

Can I PR a set of snippets using aria attributes?

Man, this is really awesome but can you add support for php and blade because now I am only able to use it in html.

The other day I asked how to make this extension work in a .vue file in this comment.

I always use bootstrap-v4-snippets for HTML development in Laravel .blade.php files, and I also want to use it in .vue files.

I've identified that the Vetur extension interferes with this extension, and it doesn't show the snippets as in this image:

This extension also helps a lot in the development with vue and has more than 4 million installations

Where is .exe can't run.

Preview link doesn't work on vscode and chrome.

Is it possible to make this work in .vue files? Thanks.

For example,
b4 card group generate a snippets:

        <div class="card-group">
          <div class="card">
            <img class="card-img-top" data-src="holder.js/100x180/" alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Title</h4>
              <p class="card-text">Text</p>
            </div>
          </div>
          <div class="card">
            <img class="card-img-top" data-src="holder.js/100x180/" alt="Card image cap">
            <div class="card-body">
              <h4 class="card-title">Title</h4>
              <p class="card-text">Text</p>
            </div>
          </div>
        </div>

the image element tag has no close symbol "/" at the end like this:
<img class="card-img-top" data-src="holder.js/100x180/" alt="Card image cap"/>

It will cause some problems in JSX.

The b-navbar snippet needs an update.
The class navbar-dark does not work with the current build as the anchor element on line 2 is missing href="#".

Please change line 2 to the following:
<a class="navbar-brand" href="#">Navbar</a>

Additionally could you guys add a standard link between line 10 & 11? It would make it easier to copy lines when adding additional links to the navbar:

<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>

Not working on express handlebar templates with .hbs file extensions

Iam unable to get Snippets for Bootstrap V4 in my VS code 1.45.

Please help me if there is any configuration needs to make prior to use.

I've made some modifications, though I don't want to PR before testing. I'm aware that this is possible, but I just can't figure it out.

Hi! Thank you for the extension. Unfortunately, I couldn't get it working as it described in the README file. The "Install and start using" method does not seem to work. I use the latest version of VSCODE and tested the extension on twig, html, vue files but it didn't work.
This is what I've done to make it work. Copied all snippets from this repository and pasted them here Preferences: Configure user snippets > twig. Please, have a look.

Version: 1.37.0
Commit: 036a6b1d3ac84e5ca96a17a44e63a87971f8fcc8
Date: 2019-08-08T01:24:14.598Z
Electron: 4.2.7
Chrome: 69.0.3497.128
Node.js: 10.11.0
V8: 6.9.427.31-electron.0
OS: Linux x64 4.15.0-34-generic

Current 'b-form-group' adds the following

<div class="form-group">
    <label for="my-input">Text</label>
    <input id="my-input" class="form-control" type="text">
 </div>

Is there a posibility to change input id to name or add the name property.
the name property is used laravel form handleling and cte changing defeats the purpose of using snippets
Iether

<div class="form-group">
    <label for="my-input">Text</label>
    <input name="my-input" class="form-control" type="text">
 </div>

or

<div class="form-group">
    <label for="my-input">Text</label>
    <input id="my-input" name="my-input" class="form-control" type="text">
 </div>