From 5384e9d1d37cd2727058312080aa22e2704b5f25 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Iv=C3=A1n=20=C3=81valos?= Date: Sun, 6 Sep 2020 22:17:22 -0500 Subject: [PATCH 1/3] Changed nunito to sans-serif as default font (and some tweaks) --- dist/lit.css | 2 +- docs/lit.html | 3 +-- docs/util.html | 3 +-- index.html | 3 +-- src/lit.css | 25 ++++++++++++++++--------- 5 files changed, 20 insertions(+), 16 deletions(-) diff --git a/dist/lit.css b/dist/lit.css index e087e6a..ab24a2c 100644 --- a/dist/lit.css +++ b/dist/lit.css @@ -1 +1 @@ -*{box-sizing:border-box}*+*{margin:.5em 0}pre{overflow:auto}@media(min-width:35em){.col{display:table-cell}.\31{width:5%}.\33{width:22%}.\34{width:30%}.\35{width:40%}.\32{width:15%}.\36{width:50%}.row{display:table;border-spacing:1em 0}}.row,.w-100{width:100%}.card:focus,hr{outline:0;border:solid #fa0}.card,pre{padding:1em;border:solid #eee}.btn:hover,a:hover{opacity:.6}.c{max-width:60em;padding:1em;margin:auto;font:1em/1.6 nunito}h6{font:100 1em nunito}h5{font:100 1.2em nunito}h3{font:100 2em nunito}h4{font:100 1.5em nunito}h2{font:100 2.2em nunito}h1{font:100 2.5em nunito}a{color:#fa0;text-decoration:none}.btn.primary{color:#fff;background:#fa0;border:solid #fa0}td,th{padding:1em;text-align:left;border-bottom:solid #eee}.btn{padding:1em;text-transform:uppercase;background:#fff;border:solid;font:.7em nunito} \ No newline at end of file +*{box-sizing:border-box}*+*{margin:.5em 0}pre{overflow:auto}@media(min-width:35em){.col{display:table-cell}.\31{width:5%}.\33{width:22%}.\34{width:30%}.\35{width:40%}.\32{width:15%}.\36{width:50%}.row{display:table;border-spacing:1em 0}}.row,.w-100{width:100%}.card:focus,hr{outline:0;border:solid #fa0}.card,pre{padding:1em;border:solid #eee}.btn:hover,a:hover{opacity:.6}.c{max-width:60em;padding:1em;margin:auto;font:1em/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h6{font:400 1em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h5{font:400 1.2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h3{font:400 2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h4{font:400 1.5em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h2{font:400 2.2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h1{font:400 2.5em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}a{color:#fa0;text-decoration:none}.btn.primary{color:#fff;background:#fa0;border:solid #fa0}td,th{padding:1em;text-align:left;border-bottom:solid #eee}.btn{padding:1em;text-transform:uppercase;background:#fff;border:solid;font:.7em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}a.btn{display:inline-block}input,select{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"} \ No newline at end of file diff --git a/docs/lit.html b/docs/lit.html index a54a1b8..06bfd58 100644 --- a/docs/lit.html +++ b/docs/lit.html @@ -6,7 +6,6 @@ lit 🔥 - @@ -112,7 +111,7 @@

Heading 3

Heading 4

Heading 5
Heading 6
-

This is a paragraph. The font family is Nunito. +

This is a paragraph. Some bold text. Italics also looks nice. You can underline things you feel are important. Lit has styles that override the default heading styles, including margin.


     <h1>Heading</h1>
diff --git a/docs/util.html b/docs/util.html
index 13c60ed..5bd34df 100644
--- a/docs/util.html
+++ b/docs/util.html
@@ -6,7 +6,6 @@
     
     util
     
-    
     
     
     
@@ -183,4 +182,4 @@ 

Name

- \ No newline at end of file + diff --git a/index.html b/index.html index 68e5088..50c0549 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,6 @@ lit - @@ -42,4 +41,4 @@

util

- \ No newline at end of file + diff --git a/src/lit.css b/src/lit.css index a580555..830fc62 100644 --- a/src/lit.css +++ b/src/lit.css @@ -1,11 +1,10 @@ /* * Lit v0.1 * Primary Color set to: #FA0 -* Font set to: Nunito */ :root { - --font: nunito; + --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --primary-color: #fa0; --light: #eee; } @@ -87,27 +86,27 @@ a:hover, } h6 { - font: 100 1em var(--font); + font: 400 1em var(--font); } h5 { - font: 100 1.2em var(--font); + font: 400 1.2em var(--font); } h3 { - font: 100 2em var(--font); + font: 400 2em var(--font); } h4 { - font: 100 1.5em var(--font); + font: 400 1.5em var(--font); } h2 { - font: 100 2.2em var(--font); + font: 400 2.2em var(--font); } h1 { - font: 100 2.5em var(--font); + font: 400 2.5em var(--font); } a { @@ -134,4 +133,12 @@ th { background: white; border: solid; font: .7em var(--font); -} \ No newline at end of file +} + +a.btn { + display: inline-block; +} + +select, input { + font-family: var(--font); +} From e0e4e7f89fc19a0c494475e7170910d0f378927d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Iv=C3=A1n=20=C3=81valos?= Date: Sun, 6 Sep 2020 22:20:24 -0500 Subject: [PATCH 2/3] I forgot to push this --- dist/lit.css | 2 +- dist/lit.css.gz | Bin 398 -> 434 bytes src/lit.css | 2 +- 3 files changed, 2 insertions(+), 2 deletions(-) diff --git a/dist/lit.css b/dist/lit.css index ab24a2c..2333824 100644 --- a/dist/lit.css +++ b/dist/lit.css @@ -1 +1 @@ -*{box-sizing:border-box}*+*{margin:.5em 0}pre{overflow:auto}@media(min-width:35em){.col{display:table-cell}.\31{width:5%}.\33{width:22%}.\34{width:30%}.\35{width:40%}.\32{width:15%}.\36{width:50%}.row{display:table;border-spacing:1em 0}}.row,.w-100{width:100%}.card:focus,hr{outline:0;border:solid #fa0}.card,pre{padding:1em;border:solid #eee}.btn:hover,a:hover{opacity:.6}.c{max-width:60em;padding:1em;margin:auto;font:1em/1.6 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h6{font:400 1em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h5{font:400 1.2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h3{font:400 2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h4{font:400 1.5em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h2{font:400 2.2em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}h1{font:400 2.5em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}a{color:#fa0;text-decoration:none}.btn.primary{color:#fff;background:#fa0;border:solid #fa0}td,th{padding:1em;text-align:left;border-bottom:solid #eee}.btn{padding:1em;text-transform:uppercase;background:#fff;border:solid;font:.7em system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}a.btn{display:inline-block}input,select{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"} \ No newline at end of file +*{box-sizing:border-box}*+*{margin:.5em 0}pre{overflow:auto}@media(min-width:35em){.col{display:table-cell}.\31{width:5%}.\33{width:22%}.\34{width:30%}.\35{width:40%}.\32{width:15%}.\36{width:50%}.row{display:table;border-spacing:1em 0}}.row,.w-100{width:100%}.card:focus,hr{outline:0;border:solid #fa0}.card,pre{padding:1em;border:solid #eee}.btn:hover,a:hover{opacity:.6}.c{max-width:60em;padding:1em;margin:auto;font:1em/1.6 sans-serif}h6{font:400 1em sans-serif}h5{font:400 1.2em sans-serif}h3{font:400 2em sans-serif}h4{font:400 1.5em sans-serif}h2{font:400 2.2em sans-serif}h1{font:400 2.5em sans-serif}a{color:#fa0;text-decoration:none}.btn.primary{color:#fff;background:#fa0;border:solid #fa0}td,th{padding:1em;text-align:left;border-bottom:solid #eee}.btn{padding:1em;text-transform:uppercase;background:#fff;border:solid;font:.7em sans-serif}a.btn{display:inline-block}input,select{font-family:sans-serif} \ No newline at end of file diff --git a/dist/lit.css.gz b/dist/lit.css.gz index 39f428fb8f0943a4f4307cf6b514311b610ec500..8bac386e88512a5c23fe8f491b84137d860c7989 100644 GIT binary patch literal 434 zcmV;j0ZslNiwFP!0000017%WOZ=)~}{40^Fldd`N83SF*I;Zo%&SfOd7CU*mU|c9{(IeN9|b|f=baH@Yq`s;J>g^!-den z!}#6_uITShne?K#Z%Hv#z6QiV2d-SN>5X{WXpu6Z^@#ozSy&3oUlA26%JUhXR#@N} zmMc6hFkfM|Xsf$ZWG!4CAFS6&Tu)gXESo2o3lnrnGmP(UIO-X-oJe4UOIjOX@LCx` z@ajSwXvGgNlH#Q_iBa^F^VND+CxjSL;|*zJTnSyi0b(!yMo=}mOxa%7&?-DRY~9w_ zW5l%tJF@s8_ta^tD|ckR(LI@FTXLtQ zVLAt}B*s^JarG$|3@r5u3^8DqtWa;&H23YhSjxJg?Bi@1XQj7O;}UE~hQ1e;Q70bTh;41!SoVY7b|cT`_k&a>UQ^m=U>~D0 c{ooTPv|xS?EtRxW`bIYLFTY(tyORR|0QD}+B>(^b literal 398 zcmV;90df8xiwFP!0000017%XtZiFBZ{FO_ZChb)z>S+^v>4)?M1y53B4Px)E#DA{{ zcjekAGqbb9?yP&;z&V}7w@^pYfM#5$E3@oh_I9B9C=@{@A9i>dHMj7^btmCO=xktl zA2<{AX%H$s31)gytjcGLT9B5BX_WLr3~eM&TQ22-K8nnGVfpA#5m26Q@DN~uH&_OE z@GuWB^S#y8$yGI+?jNkfCeuh;w^+7qun7}%N;8bFZrJs=R5Q{+J5NckEzCv=#R(2B zWCAJJ?xCaDOA{BxNEr*(e{`Jl1vN&I-o=$r|Fz&|F&BcW)n(20973z`>JYny*j>bR z2g*3|HAB@-%}T7X_m%ZD#yhvzl`bP1&~crfTXy4`d!ku3I|s`!U>D(HQ;)= Date: Sun, 6 Sep 2020 22:24:30 -0500 Subject: [PATCH 3/3] Changed 395 to 443 bytes gzipped --- docs/lit.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/lit.html b/docs/lit.html index 06bfd58..b4e538f 100644 --- a/docs/lit.html +++ b/docs/lit.html @@ -28,7 +28,7 @@

lit 🔥

-
world's smallest responsive css framework* (395 bytes gzipped and minified)
+
world's smallest responsive css framework* (434 bytes gzipped and minified)

This is the result of me playing css "code golf" with Skeleton. As such, this framework strives to maintain all of the features that Skeleton and other similar frameworks offer, while working on older browsers as well.

If you want a little more, try using util, an addon for lit

Any other thoughts? Head to the Github repository and make an issue! If you like this idea, don't forget to

@@ -251,7 +251,7 @@

Tables

lit Full - 395 + 434 Skeleton