forked from snxraven/ravenscott-blog
update AI page
This commit is contained in:
parent
b53389532f
commit
74ab9c9da6
@ -245,3 +245,85 @@ pre code {
|
|||||||
.alert.fade-out {
|
.alert.fade-out {
|
||||||
animation: fadeSlideOut 0.5s forwards;
|
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">
|
<ul class="navbar-nav ms-auto">
|
||||||
<% menuItems.forEach(item=> { %>
|
<% menuItems.forEach(item=> { %>
|
||||||
<li class="nav-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 %>
|
<%= item.title %>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
@ -62,24 +63,26 @@
|
|||||||
<span class="nav-link separator">|</span>
|
<span class="nav-link separator">|</span>
|
||||||
</li>
|
</li>
|
||||||
|
|
||||||
<!-- Inject custom menu items here -->
|
<!-- Inject custom menu items here as a dropdown -->
|
||||||
<li class="nav-item">
|
<li class="nav-item dropdown">
|
||||||
<a class="nav-link" href="#" onclick="openLiveLog()">Live Log</a>
|
<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>
|
||||||
<li class="nav-item">
|
<li><a class="dropdown-item" href="#" onclick="openAbout()">About RayAI</a></li>
|
||||||
<a class="nav-link" href="#" onclick="openTop()">Top</a>
|
</ul>
|
||||||
</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>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
<!-- Alert Messages -->
|
<!-- Alert Messages -->
|
||||||
<div id="success-alert" class="alert alert-success mt-3" style="display: none;"></div>
|
<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>
|
<div id="error-alert" class="alert alert-danger mt-3" style="display: none;"></div>
|
||||||
|
Loading…
Reference in New Issue
Block a user