Multi including files in JADE - html

What I have now in my index.jade file:
html
include head
body
include header
include main
include aside
// a bunch of other includes
include footer
What I prefer to receive
html
include head.jade
body
+multiinclude('header','main','aside','footer')
But when I'm trying to pass an argument in mixin to include directive it doesn't work:
mixin multiinclude(...includes)
each i in includes
include= i
It just add <include>header</include> tags

You are passing strings into you multiinclude mixin.
You are also trying to loop over your inputs, but they are not in an array format.
Maybe you should include a body.jade file, and in the the body.jade include the different pieces to the body?

Related

Getting a HTML template as a HTML string

consider that I have several HTML templates and they have custom HTML tags. For ex: c-icon, c-text, c-button etc.
For some usecase(Display other content along with innerHTML), I need to access c-icon tag HTML inside c-text and append it to some text so that I can render it with some other html text. In future, I may have another component called c-badge and even I want to refer and render.
Could you please provide any suggestions for achieving the same?

How to add html and head tag in jsoup?

I am trying to sanitize a html page in spring boot using Jsoup. I added head, html and body tag in the allowed tags in the following way.
Safelist safelist = Safelist.relaxed();
safelist.addTags("html", "head", "style", "body", "title");
in the documentation it says that this should work.
The cleaner and these safelists assume that you want to clean a body fragment of HTML (to add user supplied HTML into a templated page), and not to clean a full HTML document.
**If the latter is the case, either wrap the document HTML around the cleaned body HTML, or create a safelist that allows html and head elements as appropriate.**
When I pass the string
String s = "<html><head><title>Title of the document</title></head><body><p>some text</p></body></html>";
to Jsoup.clean() method:
Jsoup.clean(s,"",safelist,new Document.OutputSettings().prettyPrint(false))
I get output as:
<body><title>Title of the document</title><p>some text</p></body>
what I want is:
<html><head><title>Title of the document</title></head><body><p>some text</p></body></html>
Thanks in advance.

How to target similar classes and their children with CSS?

I use AE Templates in Wordpress to create templates which are used around the website, so I don't have to change every occurrence of a single template every time I need to update some information. In my case I have tens of these templates which are exactly the same apart from some text and an image, so they all have exactly the same CSS except for some unique identifiers in classes.
Here's an example:
.elementor-3464 .elementor-element.elementor-element-380443b9 > .elementor-element-populated{
some-rules;
}
This is a line of CSS which is the same for all templates, except 3464 and 380443b9 change from template to template.
It seems a waste of code to me to load all CSS files for every web page with multiple templates with the same CSS. Is there a way I can target all templates by rewriting the above line to be arbitrary for any ID number/sequence (3464 and 380443b9)?
I was hoping I could use the [class*=...] selector but it doesn't work.
I tried this as a replacement for the above example:
[class^="elementor-"] [class*="elementor-element-"] > .elementor-element-populated{
some-rules;
}
The [class^="elementor-"] will only work if the class list begins with "elementor-". If there is another class before it, e.g. class="elementor elementor-1234" then it will not work.
You might need to use:
[class*="elementor-"] [class*="elementor-element-"] > .elementor-element-populated{
some-rules;
}

Pug, splitting into different includes

I wonder if it's possible to create an include in Pug where the include file partially is a bit of a div?
I am importing the include with: include includes/footer
So in the example below, I don't want to close the ul.boxes in the parent file, but in the include file.
For example in the main file, I have the following structure:
ul.boxes
li
li
li
and then in the include I want to continue the li structure with just the li:s, but I want to close the parent ul.boxes in the include.
Is this possible at all with Pug?
Yes, I just tested this and it generated the list as expected:
ul
include ./include_a1
include ./include_a2
include ./include_a3
The include files each contain one line:
li Item A.1
This was the generated HTML:
<ul><li>Item A.1</li><li>Item A.2</li><li>Item A.3</li></ul>
You can also easily do this with a mixin.
In a separate file your mixin can live by itself:
mixin listItem(value)
li= value
Then your main pug file will look like this:
include file_with_mixin
ul
+listItem('Item A.1')
+listItem('Item A.2')
+listItem('Item A.3')
This will produce the exact same output as the straight include method above, but have the benefit of controlling all formatting in the common mixin file and driving presentation logic independently of the data.
That matters if you wanted to bold all of the li elements you would do it in the mixin file only and not need to edit three separate include files.

MVC4 using sections to include javascript

I am working on an asp.net MVC4 application. In my layout page, I have the following code
#RenderSection("page-specific", required: false)
and In my view which uses the above layout, I have
#section page-specific{
<script src="~/Scripts/page-specific.js" type="text/javascript"></script>
}
When I run my application, it gives me the following error
Sections cannot be empty. The "#section" keyword must be followed by a block of markup surrounded by "{}"
But all I want to do is include some page specific styles and javascript. I dont want to include any HTML markup in this particular section. How can I do this while avoiding the empty section error?
Try naming it pageSpecific. I haven't tried using a hyphen in a section name before, but I have a feeling mvc might not like that.