Wrap each block of text in a tag
I am starting a new project from frontend mentor. Usually the site lets you download a starter folder, that has some starter essentials to help you, but a thing I don't like is that they let there a raw html. I was wondering, is there a way to wrap each block of these texts in some tag with vscode? So I don't have to do each for each one
23 Replies
Search and replace on the empty lines using a regex
You might also be able to multi select and use the wrap with Emmet abbreviation command, not sure
how
Not at my pc at the moment. Something like searching for
^$ with regex matching oni c
gonna search about thx
Share the raw text, I'll take a look when I'm back at my pc
Desserts
Waffle with Berries
Waffle
6.50
Add to Cart
Vanilla Bean Crème Brûlée
Crème Brûlée
7.00
Add to Cart
Macaron Mix of Five
Macaron
8.00
Add to Cart
Classic Tiramisu
Tiramisu
5.50
Add to Cart
Pistachio Baklava
Baklava
4.00
Add to Cart
Lemon Meringue Pie
Pie
5.00
Add to Cart
Red Velvet Cake
Cake
4.50
Add to Cart
Salted Caramel Brownie
Brownie
4.50
Add to Cart
Vanilla Panna Cotta
Panna Cotta
6.50
Add to Cart
Your Cart (<!-- Quantity -->)
Your added items will appear here
if you want to ignore the spaces, use this:
^ *(.+) *$highlight something first and then use Ctrl + Shift + L
after that, use Ctrl + Shift + P or press F1 and search Emmet: Wrap with Abbreviation
no need for the regex and fancy stuff, emmet is your friend here
The way Ctrl + Shift + L works is that if you select a part of text, it will search for other text containing what you selected
Lets say you higtlighted the word "balls" and then press Ctrl + Shift + L,
After pressing the keyboard shortcut, you will be able the edit text containing the world "balls". You can add spacings, letters, quotations whatever you want
heres how I would do it based on your example
i still don't get why you would need regex for this tho
another use case of the Ctrl + Shift + L is that you can change all elements classname with the same classname.
Ex, I have 10 <li class="header_listItem">. I can highlight the classname and be able to edit them all
this doesnt work: ctrl + shift + l only selects multiple instances of the same selected text/search
and none of the text is the same
"Add to Cart" is and you can use arrow and shift key to highlight text
You can see it in my 2nd demo vid
yes, that works
but the first and last 2 lines have to be done manually
i dont think so, check my video. you can select all of the them
they do, because everything you do relies on repeated text
i agree that regex does work in some situations but ctrl + shift + l works perfectly fine here
i'm not saying you should use ctrl + shift +l all the time on more advanced stuff but it cuts it
im saying that your method works for almost everything in the input, but not everything
it has the advantage of being easier to do, quick, simple and you can easily correct if something is wrong
however, it cant do much for things that dont have a repeating pattern
ah ok, all good
May I help you?
if you can help, just help here in open chat. The only help we allow on the server is given freely
I will help freely.