- {%- for post in site.posts reversed -%}
+ {%- for post in site.posts -%}
{% capture category_name %}{{ post.categories | first }}{% endcapture %}
{% if category_name == "get-started" %}
diff --git a/_sass/archsvg.scss b/_sass/archsvg.scss
index 72955e3..9989147 100644
--- a/_sass/archsvg.scss
+++ b/_sass/archsvg.scss
@@ -1,120 +1,76 @@
+.arch svg {
+ max-height: 340px;
+}
- .arch svg {
- max-height: 300px;
- }
+#webnn:hover {
+ fill: #00C7FD;
+ stroke: #00C7FD;
+ cursor: pointer;
+}
- .arc-1 {
- fill: $faq-color;
- }
- .arc-1:hover {
- fill: darken($faq-color, 10%);
- }
- .arc-2,
- .arc-5 {
- font-size: 9px;
- }
- .arc-2 {
- fill: #fff;
- }
- .arc-4 {
- fill: #d0ebff;
- }
- .arc-5 {
- fill: #474c58;
- }
- .arc-12 {
- fill: $brand-color2;
- }
- .arc-12:hover {
- fill: $brand-color;
- }
- .arc-13 {
- fill: #90b665;
- }
- .arc-13:hover {
- fill: #80a655;
- }
- .arc-18,
- .arc-19,
- .arc-20,
- .arc-21,
- .arc-22 {
- fill: none;
- stroke: #d0ebff;
- stroke-width: 0.25px;
- }
- .arc-18,
- .arc-20,
- .arc-21,
- .arc-22 {
- stroke-linecap: round;
- }
- .arc-18,
- .arc-20,
- .arc-21 {
- stroke-linejoin: round;
- }
- .arc-19,
- .arc-22 {
- stroke-miterlimit: 10;
- }
- .arc-20 {
- stroke-dasharray: 1 4.99;
- }
+/* #26CC0B */
+.arch text:hover:not(.webgpu, .webnn, .webassembly) {
+ fill: $brand-color;
+}
- .arch text:hover {
- font-weight: 500;
- }
- .arch text:hover:not(.webgpu, .webnn, .webassembly) {
- fill: $brand-color;
- }
+.webnn:hover ~ .nnline,
+.webnn:hover ~ .nnpath {
+ fill: #00C7FD;
+ stroke: #00C7FD;
+ animation: 0.5s draw linear forwards;
+}
- .arch path:hover {
- stroke: $brand-color;
- }
+.webnn:hover ~ #directml {
+ fill: #FD0D8E;
+ stroke: #FD0D8E;
+}
- .webgpu:hover ~ .gpuline,
- .webgpu:hover ~ .gpupath {
- stroke: darken($faq-color, 10%);
- animation: 0.5s draw linear forwards;
- }
+.webnn:hover ~ #tflite {
+ fill: #F9B508;
+ stroke: #F9B508;
+}
- .webgpu:hover ~ .gpu,
- .webgpu:hover ~ .gputext {
- fill: darken($faq-color, 10%);
- }
+.webnn:hover ~ #coreml {
+ fill: #26cc0b;
+ stroke: #26cc0b;
+}
- .webassembly:hover ~ .wasmline,
- .webassembly:hover ~ .wasmpath {
- stroke: #80a655;
- animation: 0.5s draw linear forwards;
- }
+.webnn:hover ~ #cpu {
+ fill: #0068B5;
+ stroke: #0068B5;
+}
- .webassembly:hover ~ .wasm,
- .webassembly:hover ~ .wasmtext {
- fill: #80a655;
- }
+.webnn:hover ~ #gpu {
+ fill: #FF2052;
+ stroke: #FF2052;
+}
- .webnn:hover ~ .nnline,
- .webnn:hover ~ .nnpath {
- stroke: $brand-color;
- animation: 0.5s draw linear forwards;
- }
+.webnn:hover ~ #npu {
+ fill: #010734;
+ stroke: #010734;
+}
- .webnn:hover ~ .nn,
- .webnn:hover ~ .nntext {
- fill: $brand-color;
- }
+.webnn:hover ~ #text-tflite,
+.webnn:hover ~ #text-directml,
+.webnn:hover ~ #text-coreml,
+.webnn:hover ~ #text-cpu,
+.webnn:hover ~ #text-gpu,
+.webnn:hover ~ #text-npu
+{
+ fill: #fff;
+}
- @keyframes draw {
- 0% {
- stroke-dasharray: 140 540;
- stroke-dashoffset: -474;
- stroke-width: 0.5px;
- }
- 100% {
- stroke-dasharray: 760;
- stroke-dashoffset: 0;
- stroke-width: 0.5px;
- }
- }
+@keyframes draw {
+ 0% {
+ stroke-dasharray: 600 100;
+ stroke-dashoffset: 600;
+ stroke-width: 1px;
+ }
+ 100% {
+ stroke-dasharray: 0;
+ stroke-dashoffset: 0;
+ stroke-width: 1px;
+ fill: #00C7FD;
+ stroke: #00C7FD;
+ }
+}
diff --git a/_sass/herosvg.scss b/_sass/herosvg.scss
index 40f1974..d6f8f98 100644
--- a/_sass/herosvg.scss
+++ b/_sass/herosvg.scss
@@ -25,10 +25,10 @@
opacity: 0.75;
}
.cls-8 {
- fill: #90b665;
+ fill: #2555a0;
}
.cls-9 {
- fill: #a1d469;
+ fill: rgba(1, 7, 52, 0.8);
}
.cls-10,
.cls-15 {
@@ -51,7 +51,7 @@
fill: #595959;
}
.cls-17 {
- fill: #95c461;
+ fill: rgba(1, 7, 52, 0.8);
}
.cls-18 {
fill: #c18255;
@@ -341,7 +341,7 @@
fill: #fcf2d6;
}
.cls-94 {
- fill: #719253;
+ fill: #010734;
}
.cls-95 {
fill: #e1d5c9;