From ecaf53ee24878f20c61fdb4b2650c4eddb7806ca Mon Sep 17 00:00:00 2001 From: Mike Linksvayer Date: Sat, 21 Feb 2026 01:40:18 +0000 Subject: [PATCH 1/2] Replace the license property sprite (green/blue/red circles) with individual icons --- _includes/css/responsive.css | 18 ++++-------- _includes/license-overview.html | 2 +- _includes/sidebar.html | 2 +- _layouts/license.html | 2 +- appendix.md | 14 ++++----- assets/css/application.scss | 48 +++++++++++++++++++++---------- assets/img/license-sprite.png | Bin 639 -> 0 bytes assets/img/license-sprite@2x.png | Bin 742 -> 0 bytes 8 files changed, 48 insertions(+), 38 deletions(-) delete mode 100644 assets/img/license-sprite.png delete mode 100644 assets/img/license-sprite@2x.png diff --git a/_includes/css/responsive.css b/_includes/css/responsive.css index 39dd8f5c0..64524f36b 100644 --- a/_includes/css/responsive.css +++ b/_includes/css/responsive.css @@ -146,25 +146,17 @@ font-size: 10px; } .license-rules:not(.license-rules-sidebar) li { + padding-left: 14px; margin-right: 5px; font-size: 10px; -webkit-text-size-adjust: none; } - .license-rules:not(.license-rules-sidebar) li span { - background-size: 44px; + .license-rules:not(.license-rules-sidebar) .license-marker { width: 10px; - height: 10px; + font-size: 10px; + left: 0; top: 1px; - position: relative; - } - .license-rules:not(.license-rules-sidebar) .license-conditions span { - background-position: -34px 0; - } - .license-rules:not(.license-rules-sidebar) .license-permissions span { - background-position: -24px 0px; - } - .license-rules:not(.license-rules-sidebar) .license-limitations span { - background-position: -14px 0; + position: absolute; } .hint--large::after{ diff --git a/_includes/license-overview.html b/_includes/license-overview.html index 320c4142a..c810fe2f0 100644 --- a/_includes/license-overview.html +++ b/_includes/license-overview.html @@ -33,7 +33,7 @@

{% assign req = rule_obj.tag %} {% if license[type] contains req %}
  • - + {% if type == "permissions" %}✓{% elsif type == "conditions" %}ⓘ{% else %}✕{% endif %} {{ rule_obj.label }}
    • {% endif %} diff --git a/_includes/sidebar.html b/_includes/sidebar.html index 6148959b7..414c19106 100644 --- a/_includes/sidebar.html +++ b/_includes/sidebar.html @@ -38,7 +38,7 @@

    Optional steps

    - + Source
    diff --git a/_layouts/license.html b/_layouts/license.html index ac63b38b2..602089dd3 100644 --- a/_layouts/license.html +++ b/_layouts/license.html @@ -32,7 +32,7 @@ {% assign req = rule_obj.tag %} {% if page[type] contains req %}
  • - + {% if type == "permissions" %}✓{% elsif type == "conditions" %}ⓘ{% else %}✕{% endif %} {{ rule_obj.label }}
    • {% endif %} diff --git a/appendix.md b/appendix.md index 2f150cbe3..091257547 100644 --- a/appendix.md +++ b/appendix.md @@ -47,8 +47,8 @@ If you're here to choose a license, **[start from the home page](/)** to see a f {% else %} {% assign lite = "" %} {% endif %} - - + + {% if t == "permissions" %}✓{% elsif t == "conditions" %}ⓘ{% else %}✕{% endif %} {% assign seen_req = true %} @@ -66,11 +66,11 @@ If you're here to choose a license, **[start from the home page](/)** to see a f ## Legend -

    Open source licenses grant to the public permissions to do things with licensed works which copyright or other "intellectual property" laws might otherwise disallow.

    +

    Open source licenses grant to the public ✓ permissions to do things with licensed works which copyright or other "intellectual property" laws might otherwise disallow.

    -

    Most open source licenses' grants of permissions are subject to compliance with conditions.

    +

    Most open source licenses' grants of permissions are subject to compliance with ⓘ conditions.

    -

    Most open source licenses also have limitations that usually disclaim warranty and liability, and sometimes expressly exclude patents or trademarks from licenses' grants.

    +

    Most open source licenses also have ✕ limitations that usually disclaim warranty and liability, and sometimes expressly exclude patents or trademarks from licenses' grants.

    {% for type in types %} ### {% if type == "permissions" %}Permissions{% elsif type == "conditions" %}Conditions{% else %}Limitations{% endif %} @@ -85,8 +85,8 @@ If you're here to choose a license, **[start from the home page](/)** to see a f {% else %} {% assign lite = "" %} {% endif %} - - + + {% if type == "permissions" %}✓{% elsif type == "conditions" %}ⓘ{% else %}✕{% endif %} {{ rule_obj.description }} diff --git a/assets/css/application.scss b/assets/css/application.scss index 835aa041a..cfc9fb580 100644 --- a/assets/css/application.scss +++ b/assets/css/application.scss @@ -300,6 +300,8 @@ strong { } .license-rules li { + position: relative; + padding-left: 18px; margin-right: 15px; margin-bottom: 5px; } @@ -308,17 +310,39 @@ strong { color: #444; } -.license-sprite { - background-image: url(../img/license-sprite.png); - background-repeat: no-repeat; +.source-marker { + display: inline-block; + width: 16px; + text-align: center; + margin-right: 4px; + font-size: 0.875rem; + line-height: 1; +} + +.license-marker { display: inline-block; + width: 12px; + text-align: center; + font-weight: 700; + line-height: 1; +} + +.license-rules li .license-marker { + position: absolute; + left: 0; + top: 0.1em; } +.license-types td .license-marker { display: block; margin: 0 auto; } +.license-types td .license-marker, +.license-types dd .license-marker { font-size: 0.8125rem; } -.sidebar .source span { background-position: 0 0; width: 16px; height: 12px; } -.license-limitations span { background-position: -16px 0; width: 12px; height: 12px; } -.license-permissions span { background-position: -28px 0; width: 12px; height: 12px; } -.license-conditions span { background-position: -40px 0; width: 12px; height: 12px; } -.lite span { opacity: 0.5; } +.license-permissions .license-marker { color: #298625; } +.license-conditions .license-marker { color: #0d648a; } +.license-limitations .license-marker { color: #812a28; } + +.license-permissions .lite .license-marker { color: rgba(41, 134, 37, 0.5); } +.license-conditions .lite .license-marker { color: rgba(13, 100, 138, 0.5); } +.license-limitations .lite .license-marker { color: rgba(129, 42, 40, 0.5); } .license-rules-sidebar li { float: none; @@ -492,6 +516,7 @@ strong { // Selecting all the tooltip bodies to increase their font-size [class*="hint--"][aria-label]:after { font-size: 0.80rem; + font-weight: 400; text-shadow: none; } @@ -554,13 +579,6 @@ strong { background-size: 72px 182px; } - .license-sprite { - background-image: url(../img/license-sprite@2x.png); - -webkit-background-size: 52px 12px; - -moz-background-size: 52px 12px; - background-size: 52px 12px; - } - } {% include css/responsive.css %} diff --git a/assets/img/license-sprite.png b/assets/img/license-sprite.png deleted file mode 100644 index 656e4ac3ae30a2bb32745b1782ae37494c27c7f9..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 639 zcmV-_0)YLAP))_qF$&^AsK!_f>e`A72MP{s7Mj-guwhiwKI=GF#p`sx@>> zN_T=3Qz+6%cQ$?h^T9aUoo%X6w1c!C6L=XF{=|2Q$)eGjTPS>T@IOz#sc5tl^LoN$ z2z95bN5aMH$JO;n66!Xghc}51V(HBTivUn#7$qJ`Y5^%d(3#mGrC0GWeuV5QyohhG z831jJ<+fu2w_uRIH1p^WK*R|C!eRW1mDqrFV$scqzr|PC+{a>^!#FC$95lHNn8HRx zOku3g{w!WA#bOES+(o>L1vr7%u?oYO!7N}Gw&6XzgmHAy0szEZ7q8%L1dR3BS6Gj| zB@!NE3+`eYzQ#&Gl>^zs5SC*n8brNUWU~h~8Wer>5ed6WgpBWEEq=m7e1V&oM#MfW zMH^H20RLc;e6aT-U_84B1Mq7~Ktc=q@Hvj)9suAYOyfhG28^Qd{7bn(c@a=yIex%i z+(Seww*u#}6~Eymmf|t~Mw9EcCii=85I*5X2`Dg)U*6{~Rwa26ZUMPdHc zXyH>tY|1|N$u}tRWd;I9u{gJ=M=xL%9w7lf!)3Hkp#eaH3N2j48JxzIKKl}vaH>Rw zVO;R+B@AH>05f=No`(-&?gA#z0qhu%|F;ALEb;6m1OPyR+t}*=zcK;Wa0VwZhX4cg Z@d@Ir_c?J&xkms1002ovPDHLkV1lv%8P)&* diff --git a/assets/img/license-sprite@2x.png b/assets/img/license-sprite@2x.png deleted file mode 100644 index 063370e071f73d996eb25025d2de7fa327cd6214..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 742 zcmVu_Tve3 zfw)CXU=QlifpX|42Fjrye)>T3cnZ(qBA^@nIEha%fQ?u#-7Of!AeI8)72F^@ zOR%pD{UGi)Y{4YpI_$=23}Bu1)o>h}unK*$_atsBdcP{EN7C(h59?)T8P?zqbje;9 z`f#bp{i<~9aSYwEGliX~<74@`2Ma~+rw!DNv6OKZFb}wbHR689i+Bf3K(G94K%>b0 zw1Hm0Dgex25?|wc{DMo#OF|M(Vh4UoeAMP=1s00juZmlZ#{l2pRZL+~YyQAXIMn*P z{|n+CLBM`IfG@GAHK(u8$*mEqXtQ zo5YyboyNU*6OHtnoKNNFv!eHdxR12wL7W4?Foq&`I+#F1_8J%~dOwJ3YR})v^LreA z#<=Vq#*ans2c6-0T$Y`A>@7n-=nQpiN7J=y;u*}8p%TFMm3SRNdz#pVk+SrI z&hiEx#bvF#f^9fZrhd?QCee$dXh^q+ar9!eZ2hXvR7VX1|N3odCEx<4@dd_lzO4O! Y0K^a>ma2j_L;wH)07*qoM6N<$g20|#ZvX%Q From 21454b2264b0ca0c8664607962bd20465f8baf21 Mon Sep 17 00:00:00 2001 From: Mike Linksvayer Date: Sat, 21 Feb 2026 02:01:35 +0000 Subject: [PATCH 2/2] rm unncessary class adjustment --- appendix.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/appendix.md b/appendix.md index 091257547..62c119d98 100644 --- a/appendix.md +++ b/appendix.md @@ -43,11 +43,11 @@ If you're here to choose a license, **[start from the home page](/)** to see a f {% if r contains req %} {% if r contains "--" %} - {% assign lite = " lite" %} + {% assign lite = "lite" %} {% else %} {% assign lite = "" %} {% endif %} - + {% if t == "permissions" %}✓{% elsif t == "conditions" %}ⓘ{% else %}✕{% endif %}