From 36254e5df415ca396cc2d8182a43f12bea3ba1d4 Mon Sep 17 00:00:00 2001
From: jmasterfunk84 <48972964+jmasterfunk84@users.noreply.github.com>
Date: Tue, 6 Sep 2022 22:05:52 -0600
Subject: [PATCH] When using longer APN name, it is obscured due to short
 field.

---
 webui/src/components/Profile/View.js    | 4 ++--
 webui/src/components/Subscriber/View.js | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/webui/src/components/Profile/View.js b/webui/src/components/Profile/View.js
index 493fb6902..c0b45f1b3 100644
--- a/webui/src/components/Profile/View.js
+++ b/webui/src/components/Profile/View.js
@@ -300,7 +300,7 @@ const View = ({ visible, disableOnClickOutside, profile, onEdit, onDelete, onHid
                     </div>
                   }
                   <div className="body" style={{color:oc.gray[5]}}>
-                    <div className="medium_data">DNN/APN</div>
+                    <div className="large_data">DNN/APN</div>
                     <div className="medium_data">Type</div>
                     <div className="small_data">5QI/QCI</div>
                     <div className="small_data">ARP</div>
@@ -313,7 +313,7 @@ const View = ({ visible, disableOnClickOutside, profile, onEdit, onDelete, onHid
                       slice.session.map(session =>
                     <div key={session.name}>
                       <div className="body">
-                        <div className="medium_data">{session.name}</div>
+                        <div className="large_data">{session.name}</div>
                         <div className="medium_data">{
                             session.type === 1 ? "IPv4" :
                             session.type === 2 ? "IPv6" :
diff --git a/webui/src/components/Subscriber/View.js b/webui/src/components/Subscriber/View.js
index da2d7e1d3..abaaa92fb 100644
--- a/webui/src/components/Subscriber/View.js
+++ b/webui/src/components/Subscriber/View.js
@@ -299,7 +299,7 @@ const View = ({ visible, disableOnClickOutside, subscriber, onEdit, onDelete, on
                     </div>
                   }
                   <div className="body" style={{color:oc.gray[5]}}>
-                    <div className="medium_data">DNN/APN</div>
+                    <div className="large_data">DNN/APN</div>
                     <div className="medium_data">Type</div>
                     <div className="small_data">5QI/QCI</div>
                     <div className="small_data">ARP</div>
@@ -312,7 +312,7 @@ const View = ({ visible, disableOnClickOutside, subscriber, onEdit, onDelete, on
                       slice.session.map(session =>
                     <div key={session.name}>
                       <div className="body">
-                        <div className="medium_data">{session.name}</div>
+                        <div className="large_data">{session.name}</div>
                         <div className="medium_data">{
                             session.type === 1 ? "IPv4" :
                             session.type === 2 ? "IPv6" :