tiny-components
/
plain-ui
1
0
Fork 0
Code Issues 13 Pull Requests Projects Releases 5 Wiki Activity

adding

Browse Source
release/0.2
Björn 3 years ago
parent 22e148c710
commit f4510403b0
3 changed files with 49 additions and 34 deletions
Show Stats Download Patch File Download Diff File

76
dist/index.html vendored
Unescape View File

@ -52,17 +52,18 @@
<div class="content">
<p>
<span class="bold">Plain UI</span> is a simple UI Framework.
It uses strong Utility Classes and has a few Components.
It has
</p>
<p>
Some ideas of this are based Work from the last 10 Years. <span class="highlight">But</span> also Ideas from Frameworks TailwindCSS.
</p>
<h3 class="h4 highlight">
<h3 class="h5">
Contribution
</h3>
<ul>
<li>TailwindCSS that have thought me a few new Ideas to handle Helper-Classes</li>
<li>TailwindCSS for showing new ideas and concepts to handle handle Helper-Classes</li>
<li><span class="bold">TailwindCSS</span> for showing new ideas and concepts to handle handle Helper-Classes</li>
<li><span class="bold">Reflex Grid</span> </li>
<li><span class="bold">Reflex Grid</span> </li>
</ul>
</div>
<div class="center">
@ -100,13 +101,15 @@
<h2 class="highlight">
Building
</h2>
<p>
For Buildung use Webpack or a similiar System. Plain UI is build by Laravel-Mix. Consider to use PurgeCSS,
with all Helper-Classes the CSS is really growning. PurgeCSS, with Laravel Mix it looks like this,
</p>
<code>
<div class="content">
<p>
For Buildung use Webpack or a similiar System. Plain UI is build by Laravel-Mix. Consider to use PurgeCSS,
with all Helper-Classes the CSS is really growning. PurgeCSS, with Laravel Mix it looks like this,
</code>
<a href="https://purgecss.com/" target="_blank">PurgeCSS</a>
</p>
<code></code>
</div>
</div>
</div>
</div>
@ -124,31 +127,22 @@
<div class="container">
<div class="grid">
<div class="col-12">
<h2 class="m-bottom-2 highlight">
<h2 class="highlight">
Basic Styles
</h2>
<h3 class="m-bottom-2 highlight">
<h3 class="highlight">
Normalize
</h3>
<p>
For all elements is the same, try set a basic style without anything, no margin, no padding. The Reason is to use Components, Layout and
Helpers for the styling or make your own rules for the elements.
</p>
<h3 class="m-bottom-2 highlight">
Heading + .highlight
</h3>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<div class="content">
<p>
For all elements is the same, try set a basic style without anything, no margin, no padding. The Reason is to use Components, Layout and
Helpers for the styling or make your own rules for the elements.
</p>
</div>
<h2 class="m-bottom-2 highlight">
<h2 class="highlight">
Heading
</h2>
@ -159,21 +153,35 @@
<h5>Heading 5</h5>
<h6>Heading 6</h6>
<h3 class="m-bottom-2 highlight">
<h3 class="highlight">
Heading + .highlight
</h3>
<h3>
<h1 class="highlight">Heading 1</h1>
<h2 class="highlight">Heading 2</h2>
<h3 class="highlight">Heading 3</h3>
<h4 class="highlight">Heading 4</h4>
<h5 class="highlight">Heading 5</h5>
<h6 class="highlight">Heading 6</h6>
<h3 class="highlight">
Content
</h3>
<div class="content">
<p>
Y'know this time it wasn't my fault. The Doc set all of his clocks twenty-five minutes slow. Listen, this is very important, I forgot my video camera, could you stop by my place and pick it up on your way to the mall? whoa, this is it, this is the part coming up, Doc. I'm really gonna miss you. Doc, about the future- Thank you, don't forget to take a flyer.
</p>
<p>
Dear Doctor Brown, on the night that I go back in time, you will be shot by terrorists. Please take whatever precautions are necessary to prevent this terrible disaster. Your friend, Marty. Well, safe and sound, now, n good old 1955. I've gotta go. Look, George, I'm telling you George, if you do not ask Lorraine to that dance, I'm gonna regret it for the rest of my life. Hey George, heard you laid out Biff, nice going.
</p>
<ul>
<li></li>
<li></li>
<li></li>
<li>Anyway, if Grandpa hadn't hit him</li>
<li>Yeah, well history is gonna change</li>
<li>Children</li>
</ul>
<blockquote>
I'm telling you George, if you do not ask Lorraine to that dance, I'm gonna regret it for the rest of my life. Hey George, heard you laid out Biff, nice going.
</blockquote>
</div>
</div>
</div>

3
dist/plain-ui.css vendored
Unescape View File

@ -1876,6 +1876,9 @@ samp {
-webkit-text-decoration-skip: ink edges;
text-decoration-skip: ink edges;
}
.content a {
text-decoration: underline;
}
.content b,
.content strong {
font-weight: bolder;

4
src/scss/core/_content.scss
Unescape View File

@ -23,6 +23,10 @@
text-decoration-skip: ink edges;
}
a {
text-decoration: underline;
}
// Add the correct font weight in Chrome, Edge, and Safari.
b,
strong {

Write Preview
Loading…
Cancel
Save