Device view broken in devices tab.

[BH-NetAdmin]

I'm not sure if this is an issue or something I am doing wrong, but when trying to add device views, they appear to not be showing correctly under the devices tab as seen in the second screenshot. Any help is appreciated!

Netbox V. 3.5.5 Python V. 3.10.6

[peterbaumert]

Could be related to #16 can you try in light mode as well? And could you paste the css here that you used and the name of your ports?

[BH-NetAdmin]

Could be related to #16 can you try in light mode as well? And could you paste the css here that you used and the name of your ports?

Thank you for the response,

It apears the same no matter if in dark or light mode. The ports are named gi1/0/xx. I just copied the examples out of the example folder and changed the interface names, but maybe i missed something? I don't code much.

/* 2960X-48FPD-L */ .deviceview.area { Grid-template-areas: “gi1/0/1 gi1/0/3 gi1/0/5 gi1/0/7 gi1/0/9 gi1/0/11 gi1/0/13 gi1/0/15 gi1/0/17 gi1/0/19 gi1/0/21 gi1/0/23 gi1/0/25 gi1/0/27 gi1/0/29 gi1/0/31 gi1/0/33 gi1/0/35 gi1/0/37 gi1/0/39 gi1/0/41 gi1/0/43 gi1/0/45 gi1/0/47 s3 y1 s4 y2 z" “gi1/0/2 gi1/0/4 gi1/0/6 gi1/0/8 gi1/0/10 gi1/0/12 gi1/0/14 gi1/0/16 gi1/0/18 gi1/0/20 gi1/0/22 gi1/0/24 gi1/0/26 gi1/0/28 gi1/0/30 gi1/0/32 gi1/0/34 gi1/0/36 gi1/0/38 gi1/0/40 gi1/0/42 gi1/0/44 gi1/0/46 gi1/0/48 s3 te1/0/1 s4 te1/0/2 z"; }

[deku-m]

Adding:

This is also for creating a SC-Panel with the following: /* Ports are named "LC 1", "LC 2" | "Rear Port 1", "Rear Port 2" and so on */ .deviceview.area.dFront { /* both set to auto to overwrite the 32 columns 2 rows design */ grid-auto-rows: auto; grid-auto-columns: auto; grid-template-areas: "port-1 port-2 port-3 port-4 port-5 port-6 port-7 port-8 port-9 port-10 port-11 port-12 port-13 port-14 port-15 port-16 port-17 port-18 port-19 port-20 port-21 port-22 port-23 port-24" } .deviceview.area.dRear { /* both set to auto to overwrite the 32 columns 2 rows design */ grid-auto-rows: auto; grid-auto-columns: auto; grid-template-areas: "port-1 port-2 port-3 port-4 port-5 port-6 port-7 port-8 port-9 port-10 port-11 port-12 port-13 port-14 port-15 port-16 port-17 port-18 port-19 port-20 port-21 port-22 port-23 port-24" }

In this it has to do with that the ports are named 1/2/3/4/6/7 etc. So it might be related to issue https://github.com/peterbaumert/netbox-device-view/issues/17 ? As i think the regex cant handle it as it only use a-z or 0-9.

def process_interfaces(interfaces, ports_chassis, dev=1):
    if interfaces is not None:
        for itf in interfaces:
            regex = r"^(?P<type>([a-z]+))((?P<dev>[0-9]+)\/)?((?P<module>[0-9]+)\/)?((?P<port>[0-9]+))$"

def process_ports(ports, ports_chassis, where):
    if ports is not None:
        for port in ports:
            regex = r"^(?P<type>([A-Za-z]+))[\s]?((?P<port>[0-9]+))$"

But i could be wrong in that.

[deku-m]

Could be related to #16 can you try in light mode as well? And could you paste the css here that you used and the name of your ports?

Thank you for the response,

It apears the same no matter if in dark or light mode. The ports are named gi1/0/xx. I just copied the examples out of the example folder and changed the interface names, but maybe i missed something? I don't code much.

/* 2960X-48FPD-L */ .deviceview.area { Grid-template-areas: “gi1/0/1 gi1/0/3 gi1/0/5 gi1/0/7 gi1/0/9 gi1/0/11 gi1/0/13 gi1/0/15 gi1/0/17 gi1/0/19 gi1/0/21 gi1/0/23 gi1/0/25 gi1/0/27 gi1/0/29 gi1/0/31 gi1/0/33 gi1/0/35 gi1/0/37 gi1/0/39 gi1/0/41 gi1/0/43 gi1/0/45 gi1/0/47 s3 y1 s4 y2 z" “gi1/0/2 gi1/0/4 gi1/0/6 gi1/0/8 gi1/0/10 gi1/0/12 gi1/0/14 gi1/0/16 gi1/0/18 gi1/0/20 gi1/0/22 gi1/0/24 gi1/0/26 gi1/0/28 gi1/0/30 gi1/0/32 gi1/0/34 gi1/0/36 gi1/0/38 gi1/0/40 gi1/0/42 gi1/0/44 gi1/0/46 gi1/0/48 s3 te1/0/1 s4 te1/0/2 z"; }

I see in yours you have a caps on Grid-template-areas: can you try it with grid-template-areas: