In openapi-ui.css, added new link styles with hover effects

This commit is contained in:
Alexander Shabarshov 2025-05-04 12:36:03 +01:00
parent c61bf2f374
commit 5faa56c8b8
2 changed files with 35 additions and 29 deletions

View File

@ -17,6 +17,7 @@
<TableOfContents Tree="@_tree" /> <TableOfContents Tree="@_tree" />
</Expander> </Expander>
<div class="oa-main-content">
<HeaderControl Value="@_api.Info" DownloadUrl="@Url" /> <HeaderControl Value="@_api.Info" DownloadUrl="@Url" />
<ServersControl Value="@_api.Servers" /> <ServersControl Value="@_api.Servers" />
@if (_api.Paths?.Count > 0) @if (_api.Paths?.Count > 0)
@ -39,7 +40,7 @@
<ComponentsControl Value="@_api.Components" /> <ComponentsControl Value="@_api.Components" />
</TocMember> </TocMember>
} }
</div>
</CascadingValue> </CascadingValue>
</CascadingValue> </CascadingValue>

View File

@ -332,6 +332,16 @@
border-bottom: 1px dotted black; border-bottom: 1px dotted black;
} }
.openapi-ui a {
text-decoration: none;
cursor: pointer;
color: var(--oa-fg-link);
}
.openapi-ui a:hover {
color: var(--oa-fg-link-hover);
}
.openapi-ui .tooltip .tooltiptext { .openapi-ui .tooltip .tooltiptext {
visibility: hidden; visibility: hidden;
width: fit-content; width: fit-content;
@ -375,16 +385,17 @@
vertical-align: top; vertical-align: top;
} }
.openapi-ui { .openapi-ui {
--oa-bg-lighter: #0000001f; --oa-bg-lighter: #0000001f;
--oa-bg-darker: #00000055; --oa-bg-darker: #00000055;
--oa-bg-darkest: #000000AA; --oa-bg-darkest: #000000AA;
--oa-fg-normal: #e4e4e4; --oa-fg-normal: #e4e4e4;
--oa-fg-lighter: #ffffff; --oa-fg-lighter: #ffffff;
--oa-fg-darker: #A0A0A0; --oa-fg-darker: #A0A0A0;
--oa-fg-darkest: #808080; --oa-fg-darkest: #808080;
--oa-fg-link: var(--oa-fg-1);
--oa-fg-link-hover: var(--oa-bg-1);
--oa-bg-1: #3655a3; --oa-bg-1: #3655a3;
--oa-bg-2: #7a7620; --oa-bg-2: #7a7620;
--oa-bg-3: #9f4b1e; --oa-bg-3: #9f4b1e;
@ -393,7 +404,6 @@
--oa-bg-6: #851192; --oa-bg-6: #851192;
--oa-bg-7: #266b67; --oa-bg-7: #266b67;
--oa-bg-8: #456f2b; --oa-bg-8: #456f2b;
--oa-fg-1: #7d98de; --oa-fg-1: #7d98de;
--oa-fg-2: #ded971; --oa-fg-2: #ded971;
--oa-fg-3: #eda279; --oa-fg-3: #eda279;
@ -402,10 +412,8 @@
--oa-fg-6: #e571f2; --oa-fg-6: #e571f2;
--oa-fg-7: #98e6e1; --oa-fg-7: #98e6e1;
--oa-fg-8: #54b319; --oa-fg-8: #54b319;
--oa-bg-tag: var(--oa-bg-1); --oa-bg-tag: var(--oa-bg-1);
--oa-fg-tag: var(--oa-fg-lighter); --oa-fg-tag: var(--oa-fg-lighter);
--oa-bg-op-get: var(--oa-bg-1); --oa-bg-op-get: var(--oa-bg-1);
--oa-bg-op-put: var(--oa-bg-2); --oa-bg-op-put: var(--oa-bg-2);
--oa-bg-op-post: var(--oa-bg-3); --oa-bg-op-post: var(--oa-bg-3);
@ -414,20 +422,17 @@
--oa-bg-op-head: var(--oa-bg-6); --oa-bg-op-head: var(--oa-bg-6);
--oa-bg-op-patch: var(--oa-bg-7); --oa-bg-op-patch: var(--oa-bg-7);
--oa-bg-op-trace: var(--oa-bg-8); --oa-bg-op-trace: var(--oa-bg-8);
--oa-bg-header: var(--oa-bg-6); --oa-bg-header: var(--oa-bg-6);
--oa-bg-form: var(--oa-bg-7); --oa-bg-form: var(--oa-bg-7);
--oa-bg-path: var(--oa-bg-8); --oa-bg-path: var(--oa-bg-8);
--oa-bg-cookie: var(--oa-bg-1); --oa-bg-cookie: var(--oa-bg-1);
--oa-bg-query: var(--oa-bg-2); --oa-bg-query: var(--oa-bg-2);
--oa-bg-matrix: var(--oa-bg-6); --oa-bg-matrix: var(--oa-bg-6);
--oa-bg-label: var(--oa-bg-7); --oa-bg-label: var(--oa-bg-7);
--oa-bg-simple: var(--oa-bg-8); --oa-bg-simple: var(--oa-bg-8);
--oa-bg-spacedelimited: var(--oa-bg-1); --oa-bg-spacedelimited: var(--oa-bg-1);
--oa-bg-pipedelimited: var(--oa-bg-2); --oa-bg-pipedelimited: var(--oa-bg-2);
--oa-bg-deepobject: var(--oa-bg-3); --oa-bg-deepobject: var(--oa-bg-3);
--oa-font-small: 12px; --oa-font-small: 12px;
--oa-font-smaller: 10px; --oa-font-smaller: 10px;
--oa-font-large: 16px; --oa-font-large: 16px;