yvachot/MicrosoftCDM-NetworkVisualizer
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add title

Browse source
This commit is contained in:
Yûki VACHOT 2024-05-12 03:55:49 +02:00
parent 8f66d8663a
commit 317d79da23
2 changed files with 28 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

4
index.html
View file

@ -6,7 +6,9 @@
<link rel="stylesheet" href="styles.css"/> <link rel="stylesheet" href="styles.css"/>
</head> </head>
<body> <body>
<div id="container"></div> <div id="container">
<div id="graphTitle" class="graph-title">Microsoft Common Data Model - Network Graph Visualization</div>
</div>
<div id="nodeDrawer" class="drawer"> <div id="nodeDrawer" class="drawer">
<div class="drawer-content"> <div class="drawer-content">
<span class="close">&times;</span> <span class="close">&times;</span>

34
styles.css
View file

@ -6,23 +6,39 @@ html, body {
} }
#container { #container {
position: relative;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
background: white; background: white;
border: 1px solid #ccc;
} }
.graph-title {
position: absolute;
top: 25px;
left: 50%;
transform: translateX(-50%);
font-size: 32px;
color: #333;
z-index: 10;
background-color: rgba(255, 255, 255, 0.8);
padding: 5px 10px;
border-radius: 5px;
}
/* The Drawer (background) */ /* The Drawer (background) */
.drawer { .drawer {
display: none; /* Hidden by default */ display: none;
position: fixed; /* Stay in place */ position: fixed;
z-index: 1; /* Sit on top */ z-index: 1;
right: 0; /* Align to the right side */ right: 0;
top: 0; top: 0;
width: 30%; /* Adjust width as needed */ width: 30%;
height: 100%; /* Full height */ height: 100%;
background-color: white; /* Drawer background color */ background-color: white;
box-shadow: -2px 0 5px rgba(0,0,0,0.5); /* Shadow for better visibility */ box-shadow: -2px 0 5px rgba(0,0,0,0.5);
overflow-x: hidden; /* Prevent horizontal scroll */ overflow-x: hidden;
} }
.drawer-content { .drawer-content {