mirror of
https://github.com/Hopiu/djLint.git
synced 2026-05-18 18:11:07 +00:00
started fix for #167. updated docs
This commit is contained in:
Christopher Pickering
parent
0c40a36c3e
commit
a1451fc78e
12 changed files with 119 additions and 19 deletions
|
|
@ -104,6 +104,9 @@ module.exports = function(eleventyConfig) {
|
|||
eleventyConfig.addPassthroughCopy({
|
||||
"./node_modules/@fontsource/rasa/files": "static/font/rasa/files"
|
||||
});
|
||||
eleventyConfig.addPassthroughCopy({
|
||||
"./node_modules/@fontsource/crimson-pro/files": "static/font/crimson-pro/files"
|
||||
});
|
||||
|
||||
// copy images
|
||||
eleventyConfig.addPassthroughCopy({
|
||||
|
|
|
|||
11
docs/package-lock.json
generated
11
docs/package-lock.json
generated
|
|
@ -11,6 +11,7 @@
|
|||
"license": "AGPL-3.0-or-later",
|
||||
"dependencies": {
|
||||
"@creativebulma/bulma-divider": "^1.1.0",
|
||||
"@fontsource/crimson-pro": "^4.5.1",
|
||||
"@fontsource/rasa": "^4.5.3",
|
||||
"@quasibit/eleventy-plugin-schema": "^1.0.0",
|
||||
"@sindresorhus/slugify": "^2.1.0",
|
||||
|
|
@ -426,6 +427,11 @@
|
|||
"resolved": "https://registry.npmjs.org/@creativebulma/bulma-divider/-/bulma-divider-1.1.0.tgz",
|
||||
"integrity": "sha512-Lx5MlUhgAnTF+wNZ5LXcaE1K0F2m0Pkwte1p08FBsIyRV6Oq7BuKPk/O9XJPcF+vR6BjCxNy/hjYFXtNmoXbNg=="
|
||||
},
|
||||
"node_modules/@fontsource/crimson-pro": {
|
||||
"version": "4.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@fontsource/crimson-pro/-/crimson-pro-4.5.1.tgz",
|
||||
"integrity": "sha512-VrMaU0vMJ/n4P5qFpHVdY+iy1Y6CN+tfJBVuxCVqHtZjWOxbwExflhil2Y4namJjl7Ezg5Yy3yNJzpo8spMRvQ=="
|
||||
},
|
||||
"node_modules/@fontsource/inter": {
|
||||
"version": "4.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-4.5.1.tgz",
|
||||
|
|
@ -10723,6 +10729,11 @@
|
|||
"resolved": "https://registry.npmjs.org/@creativebulma/bulma-divider/-/bulma-divider-1.1.0.tgz",
|
||||
"integrity": "sha512-Lx5MlUhgAnTF+wNZ5LXcaE1K0F2m0Pkwte1p08FBsIyRV6Oq7BuKPk/O9XJPcF+vR6BjCxNy/hjYFXtNmoXbNg=="
|
||||
},
|
||||
"@fontsource/crimson-pro": {
|
||||
"version": "4.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@fontsource/crimson-pro/-/crimson-pro-4.5.1.tgz",
|
||||
"integrity": "sha512-VrMaU0vMJ/n4P5qFpHVdY+iy1Y6CN+tfJBVuxCVqHtZjWOxbwExflhil2Y4namJjl7Ezg5Yy3yNJzpo8spMRvQ=="
|
||||
},
|
||||
"@fontsource/inter": {
|
||||
"version": "4.5.1",
|
||||
"resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-4.5.1.tgz",
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@
|
|||
"browserslist": "> 2%, not dead",
|
||||
"dependencies": {
|
||||
"@creativebulma/bulma-divider": "^1.1.0",
|
||||
"@fontsource/crimson-pro": "^4.5.1",
|
||||
"@fontsource/rasa": "^4.5.3",
|
||||
"@quasibit/eleventy-plugin-schema": "^1.0.0",
|
||||
"@sindresorhus/slugify": "^2.1.0",
|
||||
|
|
|
|||
|
|
@ -35,6 +35,11 @@
|
|||
<link rel="stylesheet preload"
|
||||
href="{{ css.stylesCss }}"
|
||||
as="style" />
|
||||
<link rel="preload"
|
||||
href="/static/font/crimson-pro/files/crimson-pro-latin-400-normal.woff2"
|
||||
as="font"
|
||||
type="font/woff2"
|
||||
crossorigin/>
|
||||
<link rel="preload"
|
||||
href="/static/font/inter/files/inter-latin-400-normal.woff2"
|
||||
as="font"
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</a>
|
||||
</div>
|
||||
<div id="djlint-nav-menu" class="navbar-menu">
|
||||
<div class="navbar-menu my-5 is-justify-content-center">
|
||||
<div class="navbar-start my-5 mx-0 is-justify-content-center is-flex-grow-1">
|
||||
|
||||
<a class="navbar-item has-text-grey" href="/docs/getting-started/">
|
||||
Getting Started
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
Best Practices
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-end">
|
||||
<div class="navbar-end mx-0">
|
||||
<a class="navbar-item button is-white animated fadeIn"
|
||||
href="https://github.com/Riverside-Healthcare/djlint"
|
||||
target="_blank"
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ module.exports = class {
|
|||
purgecss({
|
||||
content: ['./src/**/*.njk', './src/**/*.md'],
|
||||
safelist: {
|
||||
deep: [/zoomIn/, /fadeInUp/, /pre/,/code/,/block/, /box/, /title/, /is-\d/, /table/, /message/, /message-header/, /message-body/, /panel-block/, /p-3/, /is-block/, /is-justify-content-space-between/, /is-light/, /is-active/, /is-info/],
|
||||
deep: [/headShake/, /zoomIn/, /fadeInUp/, /pre/,/code/,/block/, /box/, /title/, /is-\d/, /table/, /message/, /message-header/, /message-body/, /panel-block/, /p-3/, /is-block/, /is-justify-content-space-between/, /is-light/, /is-active/, /is-info/],
|
||||
}
|
||||
}),
|
||||
require('autoprefixer'),
|
||||
|
|
|
|||
|
|
@ -11,10 +11,14 @@ date: Last Modified
|
|||
<h2 class="title is-2">
|
||||
Lint & Format HTML Templates</h2>
|
||||
|
||||
<p class="subtitle has-text-centered mb-5">find your favorite template language!
|
||||
<p class="story my-5 has-text-left">Once upon a time all the other programming languages had a formatter and linter. Css, javascript, python, the c suite, typescript, ruby, php, go, swift, and you know the others. <i>The cool kids on the block.</i><br>
|
||||
HTML templates were left out there on their own, in the cold, unformatted and unlinted :( The dirty corner in your repository. <i>Something had to change.</i><br>
|
||||
Welcome djLint, the free cleaning service for html templates!</p>
|
||||
|
||||
<h2 class="title is-2 has-text-centered mb-5">find your favorite template language!</h2>
|
||||
<div class="columns is-multiline">
|
||||
<div class="column is-one-quarter">
|
||||
<a class="is-block card animated" data-animate="fadeInUp" href="/docs/languages/django/">
|
||||
<a class="is-block card animated fadeInUp" href="/docs/languages/django/">
|
||||
<div class="card-content" >
|
||||
<div class="content">
|
||||
<figure class="image brand">
|
||||
|
|
@ -27,7 +31,7 @@ date: Last Modified
|
|||
</div>
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<a class="is-block card animated" data-animate="fadeInUp" href="/docs/languages/jinja/">
|
||||
<a class="is-block card animated fadeInUp" href="/docs/languages/jinja/">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<figure class="image brand">
|
||||
|
|
@ -40,7 +44,7 @@ date: Last Modified
|
|||
</div>
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<a class="is-block card animated" data-animate="fadeInUp" href="/docs/languages/nunjucks/">
|
||||
<a class="is-block card animated fadeInUp" href="/docs/languages/nunjucks/">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<figure class="image brand">
|
||||
|
|
@ -54,7 +58,7 @@ date: Last Modified
|
|||
</div>
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<a class="is-block card animated" data-animate="fadeInUp" href="/docs/languages/twig/">
|
||||
<a class="is-block card animated fadeInUp" href="/docs/languages/twig/">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<figure class="image brand">
|
||||
|
|
@ -67,7 +71,7 @@ date: Last Modified
|
|||
</div>
|
||||
|
||||
<div class="column is-one-quarter">
|
||||
<a class="is-block card animated" data-animate="fadeInUp" href="/docs/languages/handlebars/">
|
||||
<a class="is-block card animated animated" data-animate="fadeInUp" href="/docs/languages/handlebars/">
|
||||
<div class="card-content">
|
||||
<div class="content">
|
||||
<figure class="image brand">
|
||||
|
|
@ -124,7 +128,7 @@ date: Last Modified
|
|||
<div class="container has-text-centered">
|
||||
<h2 class="title is-2">Watch it run!</h2>
|
||||
|
||||
<figure class="image animated is-radius fadeInUp mx-auto" style="max-width:800px">
|
||||
<figure class="image animated mx-auto is-framed" style="max-width:800px" data-animate="headShake">
|
||||
<img src="/static/img/demo.gif" alt="djlint html template formater demo">
|
||||
</figure>
|
||||
|
||||
|
|
@ -147,9 +151,9 @@ Add a badge to your <code>readme.rst</code>:
|
|||
:target: https://github.com/Riverside-Healthcare/djlint
|
||||
{% endhighlight %}
|
||||
|
||||
Looks like this:
|
||||
<p>Looks like this:</p>
|
||||
|
||||
<figure class="image" style="max-width:100px;"><img src="https://img.shields.io/badge/html%20style-djLint-blue.svg" alt="https://github.com/Riverside-Healthcare/djlint" /></figure>
|
||||
<figure class="image" style="max-width:120px;"><img src="https://img.shields.io/badge/html%20style-djLint-blue.svg" alt="https://github.com/Riverside-Healthcare/djlint" /></figure>
|
||||
|
||||
</div>
|
||||
<div class="container has-text-centered mb-5">
|
||||
|
|
|
|||
|
|
@ -93,6 +93,18 @@ $fontDir: "/static/font/rasa/";
|
|||
$fontDir: "/static/font/rasa/files/"
|
||||
);
|
||||
|
||||
$fontDir: "/static/font/crimson-pro/";
|
||||
@import "../../../node_modules/@fontsource/crimson-pro/scss/mixins";
|
||||
|
||||
@include fontFace(
|
||||
$fontName: 'Crimson Pro',
|
||||
$weight: 400,
|
||||
$display: swap,
|
||||
$unicodeMap: latin,
|
||||
$fontDir: "/static/font/crimson-pro/files/"
|
||||
);
|
||||
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -284,6 +296,16 @@ pre .number {
|
|||
color: $info;
|
||||
}
|
||||
|
||||
.story {
|
||||
font-family: Crimson Pro,Georgia,serif;
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
line-height: 1.6666666667;
|
||||
max-width: 800px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
// tabs
|
||||
|
||||
.tab-container {
|
||||
|
|
@ -465,6 +487,37 @@ pre {
|
|||
border-radius: $radius
|
||||
}
|
||||
|
||||
.is-framed {
|
||||
max-width: 800px;
|
||||
border: 8px solid $grey-lightest;
|
||||
border-radius: 4px;
|
||||
border-top: 24px solid $grey-lightest;
|
||||
box-shadow: 0 .5em 1em -.125em #0a0a0a1a,0 0 0 1px #0a0a0a05;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.is-framed::before {
|
||||
border-radius: 10px;
|
||||
content: "";
|
||||
height: 15px;
|
||||
left: 0px;
|
||||
position: absolute;
|
||||
top: -19px;
|
||||
width: 15px;
|
||||
background: $grey-light;
|
||||
}
|
||||
|
||||
.is-framed::after {
|
||||
border-radius: 10px;
|
||||
content: "";
|
||||
height: 15px;
|
||||
left: 20px;
|
||||
position: absolute;
|
||||
top: -19px;
|
||||
width: 15px;
|
||||
background: $grey-light;
|
||||
}
|
||||
|
||||
.hero.is-white .hero-body {
|
||||
background-color: $white;
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 215 KiB After Width: | Height: | Size: 7.2 MiB |
BIN
docs/src/static/img/old_demo.gif
Normal file
BIN
docs/src/static/img/old_demo.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 215 KiB |
|
|
@ -459,7 +459,8 @@ class Config:
|
|||
self.indent_template_tags: str = (
|
||||
r""" if
|
||||
| for
|
||||
| block
|
||||
| block(?!trans|translate)
|
||||
# | blocktrans(?:late)?[ ]+?trimmed
|
||||
| spaceless
|
||||
| compress
|
||||
| addto
|
||||
|
|
@ -471,6 +472,7 @@ class Config:
|
|||
| filter
|
||||
| each
|
||||
| macro
|
||||
| raw
|
||||
"""
|
||||
+ self.custom_blocks
|
||||
)
|
||||
|
|
@ -601,7 +603,7 @@ class Config:
|
|||
r"""
|
||||
if
|
||||
| for
|
||||
| block
|
||||
| block(?!trans)
|
||||
| spaceless
|
||||
| compress
|
||||
| load
|
||||
|
|
@ -615,6 +617,7 @@ class Config:
|
|||
| verbatim
|
||||
| each
|
||||
| macro
|
||||
| raw
|
||||
"""
|
||||
+ self.custom_blocks
|
||||
+ r"""
|
||||
|
|
@ -624,27 +627,37 @@ class Config:
|
|||
self.break_template_tags: str = (
|
||||
r"""
|
||||
if
|
||||
| end
|
||||
| endif
|
||||
| for
|
||||
| block
|
||||
| endblock
|
||||
| endfor
|
||||
| block(?!trans)
|
||||
| endblock(?!trans)
|
||||
| else
|
||||
| spaceless
|
||||
| endspaceless
|
||||
| compress
|
||||
| endcompress
|
||||
| load
|
||||
| include
|
||||
| assets
|
||||
| endassets
|
||||
| addto
|
||||
| language
|
||||
| with
|
||||
| assets
|
||||
| endwith
|
||||
| autoescape
|
||||
| endautoescape
|
||||
| filter
|
||||
| endfilter
|
||||
| elif
|
||||
| resetcycle
|
||||
| verbatim
|
||||
| endverbatim
|
||||
| each
|
||||
| macro
|
||||
| endmacro
|
||||
| raw
|
||||
| endraw
|
||||
"""
|
||||
+ self.custom_blocks
|
||||
+ r"""
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ run::
|
|||
|
||||
for a single test, run::
|
||||
|
||||
pytest tests/test_django.py::test_attribute_include --cov=src/djlint \
|
||||
pytest tests/test_django.py::test_blocktranslate --cov=src/djlint \
|
||||
--cov-branch --cov-report xml:coverage.xml --cov-report term-missing
|
||||
|
||||
"""
|
||||
|
|
@ -278,6 +278,16 @@ def test_blocktranslate(runner: CliRunner, tmp_file: TextIO) -> None:
|
|||
"""
|
||||
)
|
||||
|
||||
output = reformat(
|
||||
tmp_file,
|
||||
runner,
|
||||
b"""<p>
|
||||
{% blocktrans %}If you have not created an account yet, then please
|
||||
<a href="{{ signup_url }}">sign up</a> first.{% endblocktrans %}
|
||||
</p>\n""",
|
||||
)
|
||||
assert output.exit_code == 0
|
||||
|
||||
|
||||
def test_trans(runner: CliRunner, tmp_file: TextIO) -> None:
|
||||
output = reformat(
|
||||
|
|
|
|||
Loading…
Reference in a new issue