yogsototh/brutcss
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

still minor changes

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2024-08-17 07:31:14 +02:00
parent defbbe9b07
commit 12a5979cb4
Signed by untrusted user who does not match committer: yogsototh
GPG key ID: 7B19A4C650D59646
7 changed files with 11 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
_site/brut.min.css vendored
View file

File diff suppressed because one or more lines are too long

4
_site/h/docs.html
View file

@ -79,7 +79,7 @@
<h5 class="tight">h5 tight</h5>
<h6 class="tight">h6 tight</h6>
</div>
</pre></details></div><div class="col card c6"><div class="inner" id="itemize"><h2>itemization</h2><div class="content"><h3>ul</h3><ul><li>item 1</li><li>item 2</li><li>item 3; with a very long text that should wrap to the next line in any browser. We&apos;ll see that the wrapped text should be aligned with the text of the other items. This is due to the <code>list-style-position: outside</code>.</li><li>item 4</li></ul></div><h3>ol</h3><div class="content"><ol><li>item 1</li><li>item 2</li><li>item 3</li><li>item 4</li></ol></div></div><details class="push stretch"><summary class="bg-neutral">code</summary><pre>
</pre></details></div><div class="col card c6"><div class="inner" id="itemize"><h2>itemization</h2><div class="content"><h3>ul</h3><ul><li>item 1</li><li>item 2</li><li>item 3; with a very long text that should wrap to the next line in any browser. We&apos;ll see that the wrapped text should be aligned with the text of the other items. This is due to the <code>list-style-position: outside</code>.</li><li>item 4</li></ul><h3>ol</h3><ol><li>item 1</li><li>item 2</li><li>item 3</li><li>item 4</li></ol></div></div><details class="push stretch"><summary class="bg-neutral">code</summary><pre>
&lt;div class=&quot;inner&quot; id=&quot;itemize&quot;&gt;
&lt;h2&gt;itemization&lt;/h2&gt;
&lt;div class=&quot;content&quot;&gt;
@ -93,9 +93,7 @@
due to the &lt;code&gt;list-style-position: outside&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;item 4&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;h3&gt;ol&lt;/h3&gt;
&lt;div class=&quot;content&quot;&gt;
&lt;ol&gt;
&lt;li&gt;item 1&lt;/li&gt;
&lt;li&gt;item 2&lt;/li&gt;

2
_site/h/download.html
View file

@ -1 +1 @@
<head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><meta content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" name="viewport" /><title>BRUT - download</title><link href="../brut.min.css" rel="stylesheet" type="text/css" /></head><body class="col gapless"><div><nav class="nav" onclick="this.focus()" tabindex="-1"><div class="container"><a class="pagename" href="../index.html">BRUT</a><a href="../h/docs.html">Docs</a><a href="../h/download.html">Download</a><a href="https://gitea.esy.fun/yogsototh/brutcss">Code</a></div></nav><button class="btn sn btn-close">×</button></div><div class="central fill" style="background:url(&apos;../h/img/brutalism.webp&apos;)"><a class="btn warn huge" download="brut.min.css" href="../brut.min.css"><span>Download BRUT<span>(8041 Bytes)</span></span></a></div></body>
<head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><meta content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" name="viewport" /><title>BRUT - download</title><link href="../brut.min.css" rel="stylesheet" type="text/css" /></head><body class="col gapless"><div><nav class="nav" onclick="this.focus()" tabindex="-1"><div class="container"><a class="pagename" href="../index.html">BRUT</a><a href="../h/docs.html">Docs</a><a href="../h/download.html">Download</a><a href="https://gitea.esy.fun/yogsototh/brutcss">Code</a></div></nav><button class="btn sn btn-close">×</button></div><div class="central fill" style="background:url(&apos;../h/img/brutalism.webp&apos;)"><a class="btn warn huge" download="brut.min.css" href="../brut.min.css"><span>Download BRUT<span>(8057 Bytes)</span></span></a></div></body>

2
_site/index.html
View file

@ -1 +1 @@
<head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><meta content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" name="viewport" /><title>BRUT</title><link href="brut.min.css" rel="stylesheet" type="text/css" /></head><body class="col gapless"><div><nav class="nav" onclick="this.focus()" tabindex="-1"><div class="container"><a class="pagename" href="index.html">BRUT</a><a href="h/docs.html">Docs</a><a href="h/download.html">Download</a><a href="https://gitea.esy.fun/yogsototh/brutcss">Code</a></div></nav><button class="btn sn btn-close">×</button></div><div><div class="hero" style="background: url(h/img/brutalism.webp)"><div class="container col middle"><div class="row middle"><div class="c2"></div><div class="c8 col block bg-neutral"><h1 class="tight huge">BRUT</h1><h4 class="big">A Brutalist and Minimalist CSS Framework</h4><p class="big">This CSS framework is ideal to be used for <strong>private admin interfaces</strong>.</p><p class="big"> Just by the look of it, it will scream: <br /><span class="hl">THIS IS NOT FOR NON-TECHNICAL PEOPLE!!!</span></p></div><div class="c2"></div></div></div></div><div class="container"><div class="col"><div class="row"><div class="col card"><h3>Examples</h3><div class="content"><p>A few quick examples to show every components. This should be quick and straightforward.</p><p>This CSS framework makes its best to respect some expected composability accross classes. Here are a few examples:</p><div class="row"><div><p class="tight">A <i>card</i>:</p><div class="card"><h3>title</h3><div class="content"><div class="tb">textual btn</div><br /><div class="btn">classic btn</div><br /><div class="msg">Some message block</div></div></div></div><div><p class="tight">The same <i>card</i> with the class <code>big</code>: </p><div class="card big"><h3>title</h3><div class="content"><div class="tb">textual btn</div><br /><div class="btn">classic btn</div><br /><div class="msg">Some message block</div></div></div></div></div></div></div><div class="card"><h3>Example</h3><div class="content"><figure><img alt="A demo of brut.css with a few forms and an error message" src="h/img/brut-demo-light.webp" /><figcaption>What a real app looks like with BRUT</figcaption></figure></div></div></div><div class="row"><div class="col card"><h3>Docs</h3><div class="col content"><a class="tb big info stretch" href="h/docs.html">Docs</a></div></div><div class="col card"><h3>Download</h3><div class="col content"><a class="tb warn big stretch" download="brut.min.css" href="brut.min.css">Download (8041 Bytes)</a></div></div></div></div></div></div><footer><div class="container"><p>By <a href="https://yannesposito.com">Yann Esposito</a></p></div></footer></body>
<head><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><meta content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no" name="viewport" /><title>BRUT</title><link href="brut.min.css" rel="stylesheet" type="text/css" /></head><body class="col gapless"><div><nav class="nav" onclick="this.focus()" tabindex="-1"><div class="container"><a class="pagename" href="index.html">BRUT</a><a href="h/docs.html">Docs</a><a href="h/download.html">Download</a><a href="https://gitea.esy.fun/yogsototh/brutcss">Code</a></div></nav><button class="btn sn btn-close">×</button></div><div><div class="hero" style="background: url(h/img/brutalism.webp)"><div class="container col middle"><div class="row middle"><div class="c2"></div><div class="c8 col block bg-neutral"><h1 class="tight huge">BRUT</h1><h4 class="big">A Brutalist and Minimalist CSS Framework</h4><p class="big">This CSS framework is ideal to be used for <strong>private admin interfaces</strong>.</p><p class="big"> Just by the look of it, it will scream: <br /><span class="hl">THIS IS NOT FOR NON-TECHNICAL PEOPLE!!!</span></p></div><div class="c2"></div></div></div></div><div class="container"><div class="col"><div class="row"><div class="col card"><h3>Examples</h3><div class="content"><p>A few quick examples to show every components. This should be quick and straightforward.</p><p>This CSS framework makes its best to respect some expected composability accross classes. Here are a few examples:</p><div class="row"><div><p class="tight">A <i>card</i>:</p><div class="card"><h3>title</h3><div class="content"><div class="tb">textual btn</div><br /><div class="btn">classic btn</div><br /><div class="msg">Some message block</div></div></div></div><div><p class="tight">The same <i>card</i> with the class <code>big</code>: </p><div class="card big"><h3>title</h3><div class="content"><div class="tb">textual btn</div><br /><div class="btn">classic btn</div><br /><div class="msg">Some message block</div></div></div></div></div></div></div><div class="card"><h3>Example</h3><div class="content"><figure><img alt="A demo of brut.css with a few forms and an error message" src="h/img/brut-demo-light.webp" /><figcaption>What a real app looks like with BRUT</figcaption></figure></div></div></div><div class="row"><div class="col card"><h3>Docs</h3><div class="col content"><a class="tb big info stretch" href="h/docs.html">Docs</a></div></div><div class="col card"><h3>Download</h3><div class="col content"><a class="tb warn big stretch" download="brut.min.css" href="brut.min.css">Download (8057 Bytes)</a></div></div></div></div></div></div><footer><div class="container"><p>By <a href="https://yannesposito.com">Yann Esposito</a></p></div></footer></body>

3
bb/brut/site.clj
View file

@ -230,9 +230,8 @@
[:li "item 3; with a very long text that should wrap to the next line in any browser."
" We'll see that the wrapped text should be aligned with the text of the other items."
" This is due to the " [:code "list-style-position: outside"] "."]
[:li "item 4"]]]
[:li "item 4"]]
[:h3 "ol"]
[:div.content
[:ol
[:li "item 1"]
[:li "item 2"]

3
src/general.less
View file

@ -46,7 +46,8 @@ ul { list-style-type: square;
padding-inline-start: 1.5rem;
}
ol {
padding-inline-start: 2rem;
padding-left: 2rem;
list-style-position: outside;
}
ul > li::marker { font-size: 1.5rem; }
li { line-height: 1.2rem; }

4
src/grid.less
View file

@ -15,8 +15,6 @@
.col {
flex-direction: column;
}
.col > .row { padding: 0 1rem; }
.row > .col { padding: 1rem 0; }
.start {
justify-content: flex-start;
align-items: flex-start;
@ -94,6 +92,8 @@
.no-mobile {
display: none;
}
.row { margin-bottom: 1rem; }
.row.gapless { margin: 0; }
}
.no-grow { flex: 0; }