My apologies for the post. I realize that this is more than likely redundant but for some reason I can't seem to find my answer.
I believe there is a keyboard shortcut in Textmate for converting something along the lines of
div.test
to
<div class="test"></div>
Any ideas? Anyone know where I can get documentation about this shortcut?
Thank you.
See Zen Coding and Sparkup.
Without the additions mentioned by #Bradford, the alternative option is to use the built-in snippets. For example (when the document is set to be HTML), typing div<TAB><TAB>test inserts the following and places the cursor on the second line:
<div id="test">
</div>
Related
Out of nowhere, PhpStorm has decided to misunderstand custom tags are and as a result doesn't format the code correctly.
I'm editing a .vue file - here's a short snippet of what it should be formatted like:
<template>
<auth-layout>
<h2>{{ __('register.content.heading') }}</h2>
<p>{{ __('register.content.copy') }}</p>
</auth-layout>
</template>
However, PhpStorm complains that the auth-layout tag is never closed. Then when running the reformat action, anything underneath </auth-layout> gets messed up.
Does anyone know why this is happening and is there a way to fix it?
Ok as is tradition, I have solved this immediately after posting this question. My auth-layout tag has a lang="" attribute which was completely confusing PhpStorm. Removing it fixes it.
I'm using materialize 0.100.2 and have used multiple card-panels. Each card-panel has a button that opens a dropdown. The dropdown is same for every trigger. I searched for the solution and I even found a problem just similar to mine. But I did not understand the solution that was proposed. The problem and solution I found is can be seen on github on following link -
https://github.com/Dogfalo/materialize/issues/2051
My problem is like I import data from backend and I iterate card-panels up to the length of data I receive. I put the dropdown below this iteration so for it to be common for all the card-panels.
Consider 'actionLists' with the data.
<div class="card-panel" data-ng-repeat="actionItem in actionLists">
.....
<button class="dropdown-button btn btn-floating" data-activates="dropdown-example"><i class="material-icons">edit</i></button>
</div>
<div id="dropdown-example" class="dropdown-content">
....
</div>
Can you please help me out. I'm quite new to materialize. Thanks in advance.
Before anything else, I'd recommend updating to version 1.0 rc1.
There have been some changes since the 0.x versions.
Then you can have multiple dropdown-trigger element reference the same dropdown-content.
See https://materializecss.com/dropdown.html
Is there a way to have Adobe Brackets automatically reformat an HTML file for me? I don't mean change the code, I mean indentation.
For example, I might be given a file that has code like this:
<div>
<strong>James Doe.</strong>
</div>
It is easier to read like this:
<div>
<strong>James Doe.</strong>
</div>
Is there something that can do this automatically in Brackets? If not, another application? Rather than me going through and reformatting the lines manually.
The "Beautify" extension is probably what you're after.
Just open the Extension Manager and search for "Beautify".
Is there a way to change autocomplete rule for attribute values in PhpStorm 7.1 (or disable it)?
I mean I want to change autocomplete from
<div class=""></div>
to
<div class=''></div>
In addition to already stated workarounds by Noah.
It's not possible to choose quote symbol in such case.
Please watch/vote this ticket to get notified on progress: http://youtrack.jetbrains.com/issue/WEB-459
I've been using PhpStorm since v5, but have not found a way to address this.
However, this behaviour can vary, depending on how you're getting to the quotes.
If you're typing <div class= and it's automatically filling in the "" for you, you can remove that by [unsetting "Automatically add quotes for attribute values"].
If you're using tab-completion, like <div cla[TAB], then there doesn't seem to be much you can do, except press backspace after tab. I haven't
You can set up your own Live Template <div class='$END$'></div> to give you your desired format.
There may be a plugin or two that can change / override PhpStorm's default behaviour, but I haven't looked too much.
One of my most common operations in textmate is to encapsulate a block of text in a <div>.
How can i create a keyboard shortcut for this? I do not really feel like learning anything complex, so simple solutions would work best - thanks!
Maybe I didn't understand your question, but what about the "Wrap Selection in Open/Close Tag" (Ctl-Shift-W) from the HTML bundle? Having a block of text selected then overtyping the default <p> with <div> does the work. See http://manual.macromates.com/en/bundles#html
But the following snippet :
${0:${TM_SELECTED_TEXT/\A(.)<\/div>\z|./(?1:$1:$0<\/div>)/m}}
does the same thing without even typing the tag ...
HTH
This might slightly off topic, but you might be interested in using Zen coding for Textmate, which allows you produce lots of HTML with a few key strokes.
You write:
div#page>div.logo+ul#navigation>li*5>a
You get:
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
(disclaimer: the example code is from the above mentioned site)
Besides that it adds features for easy navigation of editable parts of HTML, for easy wrapping of content using the same syntax as above. This last past would allow you to wrap any text (content) in whatever HTML you would like.
Happy coding :)