From 4b0ae3d6f32edcd75769b42c603d0c30ad31dfb7 Mon Sep 17 00:00:00 2001
From: Juan Massuelles <jbmassuelles@solocal.com>
Date: Wed, 30 Aug 2023 11:34:25 +0200
Subject: [PATCH] [HTML/CSS] pure css pie charts

 - updating main style
---
 pies/_global.scss       | 11 +++++++++--
 pies/index.html         |  3 +--
 pies/pie-charts.css     | 13 ++++++++++---
 pies/pie-charts.css.map |  2 +-
 4 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/pies/_global.scss b/pies/_global.scss
index 5a9a26f..2af657e 100644
--- a/pies/_global.scss
+++ b/pies/_global.scss
@@ -4,10 +4,17 @@
   right:5px;
   border-radius:5px;
   padding:10px;
-  background-color:lightblue;
+  background-color:rgb(216, 216, 216);
   a {
+    padding:5px;
+    margin:0;
+    border-right:solid 1px rgb(128,128,128);
+    display: inline-block;
+    &:last-child {
+      border-right:none;
+    }
     &[href],&:link,&:hover,&:focus,&:active {
-      color:darkblue;
+      color:rgb(78, 78, 78);
     }
   }
 }
diff --git a/pies/index.html b/pies/index.html
index 9949359..50e3f64 100644
--- a/pies/index.html
+++ b/pies/index.html
@@ -20,8 +20,7 @@
       <a href="https://codeburst.io/how-to-pure-css-pie-charts-w-css-variables-38287aea161e">
         <strong>HOW TO: Pure CSS pie charts w/ CSS variables</strong>
         <br/><span>Create customisable pie charts in ~30 lines of CSS</span>
-      </a>
-      <a href="https://www.freecodecamp.org/news/css-only-pie-chart/">
+      </a><a href="https://www.freecodecamp.org/news/css-only-pie-chart/">
         <strong>How to Create a Pie Chart Using Only CSS</strong>
         <br/><span>only one slice ;)</span>
       </a>
diff --git a/pies/pie-charts.css b/pies/pie-charts.css
index a2c70be..e6bca00 100644
--- a/pies/pie-charts.css
+++ b/pies/pie-charts.css
@@ -4,9 +4,16 @@
   right: 5px;
   border-radius: 5px;
   padding: 10px;
-  background-color: lightblue; }
-  .references a[href], .references a:link, .references a:hover, .references a:focus, .references a:active {
-    color: darkblue; }
+  background-color: #d8d8d8; }
+  .references a {
+    padding: 5px;
+    margin: 0;
+    border-right: solid 1px gray;
+    display: inline-block; }
+    .references a:last-child {
+      border-right: none; }
+    .references a[href], .references a:link, .references a:hover, .references a:focus, .references a:active {
+      color: #4e4e4e; }
 
 :root {
   font-family: sans-serif; }
diff --git a/pies/pie-charts.css.map b/pies/pie-charts.css.map
index 3b0223f..40ad942 100644
--- a/pies/pie-charts.css.map
+++ b/pies/pie-charts.css.map
@@ -1,6 +1,6 @@
 {
 "version": 3,
-"mappings": "AAAA,WAAY;EACV,QAAQ,EAAC,KAAK;EACd,MAAM,EAAC,GAAG;EACV,KAAK,EAAC,GAAG;EACT,aAAa,EAAC,GAAG;EACjB,OAAO,EAAC,IAAI;EACZ,gBAAgB,EAAC,SAAS;EAExB,uGAAwC;IACtC,KAAK,EAAC,QAAQ;;ACApB,KAAK;EACH,WAAW,EAAE,UAAU;;AAGzB,aAAa;EACX,aAAa,EAAE,IAAI;EACnB,QAAQ,EAAE,QAAQ;;AAGpB,IAAK;EACH,MAAM,EAnBE,KAAK;EAoBb,KAAK,EApBG,KAAK;EAqBb,gBAAgB,EApBV,OAAO;EAqBb,GAAG,EAhBS,GAAG;EAiBf,IAAI,EAjBQ,GAAG;EAkBf,YAAU;IACR,MAAM,EAAE,kBAAwC;IAChD,QAAQ,EAAE,QAAQ;IAClB,MAAM,EAAE,IAAI;IACZ,KAAK,EAAC,IAAI;;AAId,OAAQ;EACN,MAAM,EAAE,KAA+B;EACvC,KAAK,EAAG,KAA+B;EACvC,gBAAgB,EA9BN,OAAO",
+"mappings": "AAAA,WAAY;EACV,QAAQ,EAAC,KAAK;EACd,MAAM,EAAC,GAAG;EACV,KAAK,EAAC,GAAG;EACT,aAAa,EAAC,GAAG;EACjB,OAAO,EAAC,IAAI;EACZ,gBAAgB,EAAC,OAAkB;EACnC,aAAE;IACA,OAAO,EAAC,GAAG;IACX,MAAM,EAAC,CAAC;IACR,YAAY,EAAC,cAA0B;IACvC,OAAO,EAAE,YAAY;IACrB,wBAAa;MACX,YAAY,EAAC,IAAI;IAEnB,uGAAwC;MACtC,KAAK,EAAC,OAAe;;ACP3B,KAAK;EACH,WAAW,EAAE,UAAU;;AAGzB,aAAa;EACX,aAAa,EAAE,IAAI;EACnB,QAAQ,EAAE,QAAQ;;AAGpB,IAAK;EACH,MAAM,EAnBE,KAAK;EAoBb,KAAK,EApBG,KAAK;EAqBb,gBAAgB,EApBV,OAAO;EAqBb,GAAG,EAhBS,GAAG;EAiBf,IAAI,EAjBQ,GAAG;EAkBf,YAAU;IACR,MAAM,EAAE,kBAAwC;IAChD,QAAQ,EAAE,QAAQ;IAClB,MAAM,EAAE,IAAI;IACZ,KAAK,EAAC,IAAI;;AAId,OAAQ;EACN,MAAM,EAAE,KAA+B;EACvC,KAAK,EAAG,KAA+B;EACvC,gBAAgB,EA9BN,OAAO",
 "sources": ["_global.scss","_pie-charts-multipart.scss"],
 "names": [],
 "file": "pie-charts.css"