mirror of
https://github.com/oddlama/nix-config.git
synced 2025-10-10 14:50:40 +02:00
feat: add svgs to d2 network
This commit is contained in:
oddlama
parent
d319c3b042
commit
5248003dfe
7 changed files with 51 additions and 133 deletions
|
|
@ -1,48 +1 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:url(#SVGID_1_);}
|
||||
.st1{fill:url(#SVGID_2_);}
|
||||
.st2{fill:url(#SVGID_3_);}
|
||||
.st3{fill:url(#SVGID_4_);}
|
||||
.st4{fill:url(#SVGID_5_);}
|
||||
.st5{fill:url(#SVGID_6_);}
|
||||
</style>
|
||||
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="315.5926" y1="56.3856" x2="382.6675" y2="207.0383">
|
||||
<stop offset="0" style="stop-color:#51BCFE"/>
|
||||
<stop offset="1" style="stop-color:#6C69FF"/>
|
||||
</linearGradient>
|
||||
<path class="st0" d="M356.53,256.7c0-1.68-125.8-218.04-125.8-218.04h55.35l33.55,57.03l33.55-57.03h28.51l13.42,23.48l-43.61,85.54
|
||||
l33.55,58.7L356.53,256.7"/>
|
||||
<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="149.5343" y1="214.3758" x2="370.9458" y2="334.1458" gradientTransform="matrix(-0.5036 0.8639 -0.8639 -0.5036 764.5684 155.4585)">
|
||||
<stop offset="0" style="stop-color:#E4C4FF"/>
|
||||
<stop offset="1" style="stop-color:#7A5EEF"/>
|
||||
</linearGradient>
|
||||
<path class="st1" d="M305.69,341.77c1.46-0.83,126.95-217.38,126.95-217.38l27.45,48.06l-32.88,57.41l66.16,0.85l14.14,24.76
|
||||
l-13.74,23.3l-95.91,4.56l-34.34,58.24L305.69,341.77z"/>
|
||||
<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="297.415" y1="44.5186" x2="380.1422" y2="188.2198" gradientTransform="matrix(-0.4989 0.8666 -0.8666 -0.4989 589.9011 170.0448)">
|
||||
<stop offset="0" style="stop-color:#51BCFE"/>
|
||||
<stop offset="1" style="stop-color:#6C69FF"/>
|
||||
</linearGradient>
|
||||
<path class="st2" d="M202.2,340.41c1.45,0.84,251.73-0.23,251.73-0.23l-27.62,47.97l-66.16,0.62l32.69,57.52L378.61,471l-27.05-0.09
|
||||
l-52.38-80.47l-67.61-0.22L202.2,340.41"/>
|
||||
<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="81.5631" y1="127.9986" x2="302.9746" y2="247.7686" gradientTransform="matrix(-0.4982 -0.867 0.867 -0.4982 127.8989 643.4454)">
|
||||
<stop offset="0" style="stop-color:#E4C4FF"/>
|
||||
<stop offset="1" style="stop-color:#7A5EEF"/>
|
||||
</linearGradient>
|
||||
<path class="st3" d="M153.93,254.72c0,1.68,125.23,218.37,125.23,218.37l-55.35-0.14l-33.4-57.11l-33.69,56.94l-28.51-0.07
|
||||
l-13.36-23.52l43.83-85.43l-33.39-58.79L153.93,254.72z"/>
|
||||
<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="296.6631" y1="166.1278" x2="379.3903" y2="309.829" gradientTransform="matrix(-0.488 -0.8729 0.8729 -0.488 48.9143 645.1781)">
|
||||
<stop offset="0" style="stop-color:#51BCFE"/>
|
||||
<stop offset="1" style="stop-color:#6C69FF"/>
|
||||
</linearGradient>
|
||||
<path class="st4" d="M208.09,166.3c-1.46,0.82-128.94,216.2-128.94,216.2l-27.01-48.31l33.41-57.11l-66.15-1.45L5.49,250.73
|
||||
l13.95-23.17l95.94-3.67l34.87-57.93L208.09,166.3"/>
|
||||
<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="63.5654" y1="79.0025" x2="284.977" y2="198.7725">
|
||||
<stop offset="0" style="stop-color:#E4C4FF"/>
|
||||
<stop offset="1" style="stop-color:#7A5EEF"/>
|
||||
</linearGradient>
|
||||
<path class="st5" d="M306.07,167.25c-1.45-0.84-251.73-0.21-251.73-0.21l27.7-47.92l66.16-0.5l-32.58-57.58l14.27-24.69l27.04,0.13
|
||||
l52.23,80.56l67.61,0.34L306.07,167.25z"/>
|
||||
</svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 512 512"><linearGradient id="a" x1="315.593" x2="382.668" y1="56.386" y2="207.038" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#51bcfe"/><stop offset="1" style="stop-color:#6c69ff"/></linearGradient><path d="M356.53 256.7c0-1.68-125.8-218.04-125.8-218.04h55.35l33.55 57.03 33.55-57.03h28.51l13.42 23.48-43.61 85.54 33.55 58.7z" style="fill:url(#a)"/><linearGradient id="b" x1="149.534" x2="370.946" y1="214.376" y2="334.146" gradientTransform="scale(-1)rotate(-59.76 -517.584 587.633)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#e4c4ff"/><stop offset="1" style="stop-color:#7a5eef"/></linearGradient><path d="M305.69 341.77c1.46-.83 126.95-217.38 126.95-217.38l27.45 48.06-32.88 57.41 66.16.85 14.14 24.76-13.74 23.3-95.91 4.56-34.34 58.24z" style="fill:url(#b)"/><linearGradient id="c" x1="297.415" x2="380.142" y1="44.519" y2="188.22" gradientTransform="scale(-1)rotate(-60.071 -442.026 425.138)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#51bcfe"/><stop offset="1" style="stop-color:#6c69ff"/></linearGradient><path d="M202.2 340.41c1.45.84 251.73-.23 251.73-.23l-27.62 47.97-66.16.62 32.69 57.52L378.61 471l-27.05-.09-52.38-80.47-67.61-.22z" style="fill:url(#c)"/><linearGradient id="d" x1="81.563" x2="302.975" y1="127.999" y2="247.769" gradientTransform="scale(-1)rotate(60.117 492.003 -432.248)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#e4c4ff"/><stop offset="1" style="stop-color:#7a5eef"/></linearGradient><path d="M153.93 254.72c0 1.68 125.23 218.37 125.23 218.37l-55.35-.14-33.4-57.11-33.69 56.94-28.51-.07-13.36-23.52 43.83-85.43-33.39-58.79z" style="fill:url(#d)"/><linearGradient id="e" x1="296.663" x2="379.39" y1="166.128" y2="309.829" gradientTransform="scale(-1)rotate(60.792 525.44 -364.264)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#51bcfe"/><stop offset="1" style="stop-color:#6c69ff"/></linearGradient><path d="M208.09 166.3c-1.46.82-128.94 216.2-128.94 216.2l-27.01-48.31 33.41-57.11-66.15-1.45-13.91-24.9 13.95-23.17 95.94-3.67 34.87-57.93z" style="fill:url(#e)"/><linearGradient id="f" x1="63.565" x2="284.977" y1="79.002" y2="198.773" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#e4c4ff"/><stop offset="1" style="stop-color:#7a5eef"/></linearGradient><path d="M306.07 167.25c-1.45-.84-251.73-.21-251.73-.21l27.7-47.92 66.16-.5-32.58-57.58 14.27-24.69 27.04.13 52.23 80.56 67.61.34z" style="fill:url(#f)"/></svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 2.5 KiB |
|
|
@ -1,57 +1 @@
|
|||
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||
<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
|
||||
<svg fill="#000000" height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<g>
|
||||
<path d="M168,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C180,189.412,174.624,184.036,168,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M256,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C268,189.412,262.624,184.036,256,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M212,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C224,189.412,218.624,184.036,212,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M460,0H52C23.28,0,0,23.28,0,52v408c0,28.72,23.28,52,52,52h408c28.72,0,52-23.28,52-52V52C512,23.28,488.72,0,460,0z
|
||||
M444,284h-88.024c-2.212,0-3.976,1.64-3.976,3.848V348H160v-60.152c0-2.208-1.616-3.848-3.828-3.848H68V68h44v92.184
|
||||
c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184
|
||||
c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184
|
||||
c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h20v92.184
|
||||
c0,6.624,5.368,12,12,12c6.624,0,12-5.376,12-12V68h44V284z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M124,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C136,189.412,130.624,184.036,124,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M388,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C400,189.412,394.624,184.036,388,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M344,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C356,189.412,350.624,184.036,344,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<path d="M300,184.036c-6.632,0-12,5.376-12,12v23.752c0,6.628,5.368,12,12,12c6.624,0,12-5.372,12-12v-23.752
|
||||
C312,189.412,306.624,184.036,300,184.036z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="800" height="800" viewBox="0 0 512 512"><path d="M168 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12M256 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12M212 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12"/><path d="M460 0H52C23.28 0 0 23.28 0 52v408c0 28.72 23.28 52 52 52h408c28.72 0 52-23.28 52-52V52c0-28.72-23.28-52-52-52m-16 284h-88.024c-2.212 0-3.976 1.64-3.976 3.848V348H160v-60.152c0-2.208-1.616-3.848-3.828-3.848H68V68h44v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h20v92.184c0 6.624 5.368 12 12 12 6.624 0 12-5.376 12-12V68h44z"/><path d="M124 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12M388 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12M344 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12M300 184.036c-6.632 0-12 5.376-12 12v23.752c0 6.628 5.368 12 12 12 6.624 0 12-5.372 12-12v-23.752c0-6.624-5.376-12-12-12"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 1.6 KiB |
|
|
@ -7,10 +7,13 @@
|
|||
(lib)
|
||||
concatStringsSep
|
||||
mkDefault
|
||||
mkEnableOption
|
||||
mkIf
|
||||
;
|
||||
in {
|
||||
topology.self.services = {
|
||||
options.topology.extractors.services.enable = mkEnableOption "topology service extractor" // {default = true;};
|
||||
|
||||
config.topology.self.services = mkIf config.topology.extractors.services.enable {
|
||||
adguardhome = mkIf config.services.adguardhome.enable {
|
||||
name = "AdGuard Home";
|
||||
icon = "services.adguardhome";
|
||||
|
|
|
|||
|
|
@ -12,13 +12,16 @@
|
|||
listToAttrs
|
||||
mapAttrsToList
|
||||
mkDefault
|
||||
mkEnableOption
|
||||
mkIf
|
||||
mkMerge
|
||||
nameValuePair
|
||||
optional
|
||||
;
|
||||
in {
|
||||
config = mkIf config.systemd.network.enable {
|
||||
options.topology.extractors.systemd-network.enable = mkEnableOption "topology systemd-network extractor" // {default = true;};
|
||||
|
||||
config = mkIf (config.topology.extractors.systemd-network.enable && config.systemd.network.enable) {
|
||||
topology.self.interfaces = mkMerge (
|
||||
# Create interfaces based on systemd.network.netdevs
|
||||
concatLists (
|
||||
|
|
@ -9,6 +9,7 @@
|
|||
flip
|
||||
mapAttrsToList
|
||||
mkDefault
|
||||
mkEnableOption
|
||||
mkIf
|
||||
mkMerge
|
||||
filter
|
||||
|
|
@ -22,7 +23,9 @@
|
|||
|
||||
networkId = wgName: "wireguard-${wgName}";
|
||||
in {
|
||||
config = mkIf (config ? wireguard) {
|
||||
options.topology.extractors.wireguard.enable = mkEnableOption "topology wireguard extractor" // {default = true;};
|
||||
|
||||
config = mkIf (config.topology.extractors.wireguard.enable && config ? wireguard) {
|
||||
# Create networks (this will be duplicated by each node,
|
||||
# but it doesn't matter and will be merged anyway)
|
||||
topology.networks = mkMerge (
|
||||
|
|
|
|||
|
|
@ -6,13 +6,15 @@
|
|||
}: let
|
||||
inherit
|
||||
(lib)
|
||||
any
|
||||
attrValues
|
||||
concatLines
|
||||
flip
|
||||
optionalString
|
||||
;
|
||||
|
||||
netToD2 = net: ''
|
||||
${net.id}: ${net.name} {
|
||||
net_${net.id}: ${net.name} {
|
||||
info: |md
|
||||
${net.cidrv4}
|
||||
${net.cidrv6}
|
||||
|
|
@ -21,25 +23,24 @@
|
|||
'';
|
||||
|
||||
nodeInterfaceToD2 = node: interface:
|
||||
''
|
||||
${node.id}.${interface.id}: ${interface.id} {
|
||||
info: |md
|
||||
${toString interface.mac}
|
||||
${toString interface.addresses}
|
||||
${toString interface.gateways}
|
||||
|
|
||||
}
|
||||
''
|
||||
+ optionalString (interface.network != null) ''
|
||||
${node.id}.${interface.id} -- ${interface.network}
|
||||
'';
|
||||
# TODO: deduplicate first
|
||||
#+ concatLines (flip map interface.physicalConnections (x: ''
|
||||
# ${node.id}.${interface.id} -- ${x.node}.${x.interface}
|
||||
#''));
|
||||
concatLines (flip map interface.physicalConnections (x:
|
||||
optionalString (
|
||||
(!any (y: y.node == node.id && y.interface == interface.id) config.nodes.${x.node}.interfaces.${x.interface}.physicalConnections)
|
||||
|| (node.id < x.node)
|
||||
)
|
||||
''
|
||||
node_${node.id} -- node_${x.node}: "" {
|
||||
source-arrowhead.label: ${interface.id}
|
||||
target-arrowhead.label: ${x.interface}
|
||||
}
|
||||
''));
|
||||
|
||||
nodeToD2 = node: ''
|
||||
${node.id}: ${node.name} {}
|
||||
node_${node.id}: "" {
|
||||
shape: image
|
||||
width: 680
|
||||
icon: ${config.lib.renderers.svg.node.mkInfoCardNetwork node}
|
||||
}
|
||||
|
||||
${concatLines (map (nodeInterfaceToD2 node) (attrValues node.interfaces))}
|
||||
'';
|
||||
|
|
|
|||
|
|
@ -97,7 +97,7 @@
|
|||
mkInterface = interface: let
|
||||
color =
|
||||
if interface.virtual
|
||||
then "#242931"
|
||||
then "#7a899f"
|
||||
else "#70a5eb";
|
||||
in
|
||||
/*
|
||||
|
|
@ -135,7 +135,7 @@
|
|||
html
|
||||
*/
|
||||
''
|
||||
<div tw="flex flex-col mx-4 mt-4 bg-[#21262e] rounded-lg p-2">
|
||||
<div tw="flex flex-col mx-4 mt-4 rounded-lg p-2">
|
||||
<div tw="flex flex-row items-center">
|
||||
${mkImage "w-16 h-16 mr-4 rounded-lg" (config.lib.icons.get service.icon)}
|
||||
<div tw="flex flex-col grow">
|
||||
|
|
@ -153,14 +153,26 @@
|
|||
*/
|
||||
''
|
||||
<div tw="flex flex-row mx-6 mt-2 items-center">
|
||||
${mkImageMaybe "w-12 h-12 mr-3" (config.lib.icons.get node.icon)}
|
||||
${mkImageMaybe "w-12 h-12 mr-4" (config.lib.icons.get node.icon)}
|
||||
<h2 tw="grow text-4xl font-bold">${node.name}</h2>
|
||||
<div tw="flex grow"></div>
|
||||
<h2 tw="text-4xl">${node.deviceType}</h2>
|
||||
${mkImageMaybe "w-16 h-16 ml-3" (config.lib.icons.get node.deviceIcon)}
|
||||
${mkImageMaybe "w-16 h-16 ml-4" (config.lib.icons.get node.deviceIcon)}
|
||||
</div>
|
||||
'';
|
||||
|
||||
mkInfoCardNetwork = node:
|
||||
mkRootCard "rounded-xl"
|
||||
/*
|
||||
html
|
||||
*/
|
||||
''
|
||||
${mkTitle node}
|
||||
|
||||
${concatLines (map mkInterface (attrValues node.interfaces))}
|
||||
${optionalString (node.interfaces != {}) spacingMt2}
|
||||
'';
|
||||
|
||||
mkInfoCardFull = node: let
|
||||
services = filter (x: !x.hidden) (attrValues node.services);
|
||||
in
|
||||
|
|
@ -171,11 +183,9 @@
|
|||
''
|
||||
${mkTitle node}
|
||||
|
||||
${optionalString (node.interfaces != {}) (mkSpacer "Interfaces" + spacingMt2)}
|
||||
${concatLines (map mkInterface (attrValues node.interfaces))}
|
||||
${optionalString (node.interfaces != {}) spacingMt2}
|
||||
|
||||
${optionalString (services != []) (mkSpacer "Services")}
|
||||
${concatLines (map mkService services)}
|
||||
${optionalString (services != []) spacingMt2}
|
||||
|
||||
|
|
@ -196,7 +206,8 @@ in {
|
|||
|
||||
config = {
|
||||
lib.renderers.svg.node = {
|
||||
mkInfoCardFull = node: renderHtmlToSvg (html.node.mkInfoCardFull node) node.name;
|
||||
mkInfoCardNetwork = node: renderHtmlToSvg (html.node.mkInfoCardNetwork node) "card-network-${node.name}";
|
||||
mkInfoCardFull = node: renderHtmlToSvg (html.node.mkInfoCardFull node) "card-node-${node.name}";
|
||||
};
|
||||
|
||||
renderers.svg.output = pkgs.runCommand "topology-svgs" {} ''
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue