update AI page
This commit is contained in:
parent
b53389532f
commit
74ab9c9da6
@ -245,3 +245,85 @@ pre code {
|
||||
.alert.fade-out {
|
||||
animation: fadeSlideOut 0.5s forwards;
|
||||
}
|
||||
|
||||
|
||||
/* Dropdown menu styling */
|
||||
.navbar .dropdown-menu {
|
||||
background-color: #1e1e1e;
|
||||
/* Match the chat box background */
|
||||
border: none;
|
||||
/* Remove border */
|
||||
box-shadow: none;
|
||||
/* Remove shadow */
|
||||
padding: 0;
|
||||
/* Remove padding */
|
||||
}
|
||||
|
||||
.navbar .dropdown-item {
|
||||
background-color: #1e1e1e;
|
||||
/* Match the chat box background */
|
||||
color: white;
|
||||
/* White text */
|
||||
padding: 10px 20px;
|
||||
/* Add padding for spacing */
|
||||
border-bottom: 1px solid #444;
|
||||
/* Add a subtle separator */
|
||||
}
|
||||
|
||||
.navbar .dropdown-item:last-child {
|
||||
border-bottom: none;
|
||||
/* Remove border for the last item */
|
||||
}
|
||||
|
||||
.navbar .dropdown-item:hover {
|
||||
background-color: #282828;
|
||||
/* Slightly lighter background on hover */
|
||||
color: #f1f1f1;
|
||||
/* Lighter text on hover */
|
||||
}
|
||||
|
||||
.navbar .dropdown-item:focus {
|
||||
background-color: #282828;
|
||||
/* Match hover style for focused items */
|
||||
outline: none;
|
||||
/* Remove default outline */
|
||||
}
|
||||
|
||||
.navbar .dropdown-toggle {
|
||||
color: white;
|
||||
/* White text */
|
||||
}
|
||||
|
||||
.navbar .dropdown-toggle::after {
|
||||
border-top: 0.3em solid white;
|
||||
/* White arrow for dropdown */
|
||||
}
|
||||
|
||||
.navbar .dropdown-menu.show {
|
||||
opacity: 1;
|
||||
/* Fully opaque when shown */
|
||||
transform: translateY(0);
|
||||
/* Reset transform */
|
||||
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
|
||||
/* Smooth fade and slide transition */
|
||||
}
|
||||
|
||||
.navbar .dropdown-menu {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
/* Start hidden and slightly raised */
|
||||
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
|
||||
/* Smooth fade and slide transition */
|
||||
}
|
||||
|
||||
/* Styling the dropdown toggle button */
|
||||
.navbar .dropdown-toggle:hover {
|
||||
color: #f1f1f1;
|
||||
/* Lighter text on hover */
|
||||
}
|
||||
|
||||
/* Separator between regular menu items and dropdown */
|
||||
.navbar .separator {
|
||||
color: #555;
|
||||
/* Subtle separator color */
|
||||
}
|
||||
|
@ -51,7 +51,8 @@
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<% menuItems.forEach(item=> { %>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="<%= item.url %>" <%=item.openNewPage ? 'target="_blank"' : '' %>>
|
||||
<a class="nav-link" href="<%= item.url %>" <%=item.openNewPage ? 'target="_blank"' : ''
|
||||
%>>
|
||||
<%= item.title %>
|
||||
</a>
|
||||
</li>
|
||||
@ -62,24 +63,26 @@
|
||||
<span class="nav-link separator">|</span>
|
||||
</li>
|
||||
|
||||
<!-- Inject custom menu items here -->
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#" onclick="openLiveLog()">Live Log</a>
|
||||
<!-- Inject custom menu items here as a dropdown -->
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button"
|
||||
data-bs-toggle="dropdown" aria-expanded="false">
|
||||
Tools
|
||||
</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navbarDropdown">
|
||||
<li><a class="dropdown-item" href="#" onclick="openLiveLog()">Live Log</a></li>
|
||||
<li><a class="dropdown-item" href="#" onclick="openTop()">Top</a></li>
|
||||
<li><a class="dropdown-item" href="#" onclick="openGpuStats()">GPU Stats</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#" onclick="openTop()">Top</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#" onclick="openGpuStats()">GPU Stats</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#" onclick="openAbout()">About RayAI</a>
|
||||
<li><a class="dropdown-item" href="#" onclick="openAbout()">About RayAI</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- Alert Messages -->
|
||||
<div id="success-alert" class="alert alert-success mt-3" style="display: none;"></div>
|
||||
<div id="error-alert" class="alert alert-danger mt-3" style="display: none;"></div>
|
||||
|
Loading…
Reference in New Issue
Block a user