krzysztof/landing_page
1
0
Fork 0
mirror of https://github.com/qdrant/landing_page.git synced 2026-10-02 01:18:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

moved documentation table styles to the another file, used the existing theme colors, changed pills look, made some tweaks for better dark and light theme styling (#2081)

Browse Source
This commit is contained in:
trean
2026-01-16 16:10:51 +01:00
committed by GitHub
parent 978147d756
commit 13b667dc0c
3 changed files with 82 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
qdrant-landing/themes/qdrant-2024/assets/css/_theme-variables.scss
+2
View File
@@ -45,12 +45,14 @@ $success-10: #00210f;
$success-30: #00522f;
$success-50: #008a53;
$success-70: #50bf83;
$success-80: #7de2ad;
$success-90: #befad6;
$warning-10: #311300;
$warning-30: #733501;
$warning-50: #e0700d;
$warning-70: #ff8d39;
$warning-80: #ffb400;
$warning-90: #ffdbc7;
$error-10: #410002;
qdrant-landing/themes/qdrant-2024/assets/css/documentation.scss
+1 -66
View File
@@ -13,69 +13,4 @@
@import 'partials/feedback';
@import 'partials/documentation/docs-footer';
@import 'partials/video';
@import 'search/dark-theme';
// Table Custom Styling
.documentation {
table {
width: 100%;
border-collapse: collapse;
margin: 1rem 0;
th {
text-align: left;
padding: 8px 10px;
}
td {
padding: 8px 10px;
vertical-align: middle;
line-height: 1.4;
// Link styling
a {
color: #DC244C;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
tr {
// transition for the background color change
transition: background-color 0.2s ease;
&:hover {
// hover color highlight
background-color: rgba(59, 130, 246, 0.05);
// make the link slightly more prominent on hover
td a {
color: darken(#ef4444, 10%);
}
}
}
// Ensure the header row doesn't highlight on hover
thead tr:hover {
background-color: transparent;
}
}
// Stack Pill Styling
.pill {
display: inline-block;
padding: 1px 8px;
border-radius: 12px;
border: 1px solid #DC244C;
color: #DC244C;
//background-color: rgba(59, 130, 246, 0.1);
font-size: 0.85rem;
}
// Level Color-Coding
.text-green { color: #10b981 }
.text-yellow { color: #f59e0b }
.text-red { color: #ef4444 }
}
@import 'search/dark-theme';
qdrant-landing/themes/qdrant-2024/assets/css/partials/documentation/_documentation.scss
+79
View File
@@ -1,4 +1,5 @@
@use '../../helpers/functions' as *;
@use 'sass:color';
.documentation {
background-color: $neutral-10;
@@ -19,6 +20,68 @@
flex-wrap: wrap;
}
table {
width: 100%;
border-collapse: collapse;
margin: 1rem 0;
th {
text-align: left;
padding: 8px 10px;
}
td {
padding: 8px 10px;
vertical-align: middle;
line-height: 1.4;
// Link styling
a {
color: $primary-50;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
tr {
// transition for the background color change
transition: background-color 0.2s ease;
&:hover {
// hover color highlight
background-color: $neutral-20;
// make the link slightly more prominent on hover
td a {
color: darken($primary-60, 10%);
}
}
}
// Ensure the header row doesn't highlight on hover
thead tr:hover {
background-color: transparent;
}
}
// Stack Pill Styling
.pill {
display: inline-block;
padding: 1px 8px;
border-radius: 12px;
font-size: 0.85rem;
background-color: $neutral-30;
color: $neutral-94;
border: 0;
}
// Level Color-Coding
.text-green { color: $success-80; }
.text-yellow { color: $warning-80; }
.text-red { color: $error-50; }
@include media-breakpoint-up(xl) {
&__container {
max-width: 100vw !important;
@@ -52,5 +115,21 @@
box-shadow: 0 0 0 2px $neutral-70;
}
}
table {
tr:hover {
background-color: $neutral-98;
}
}
.pill {
background-color: $neutral-70;
border: 0;
color: $neutral-100;
}
.text-green { color: color.adjust($success-50, $saturation: 5%, $lightness: 8%); }
.text-yellow { color: color.adjust($warning-50, $saturation: 5%, $lightness: 8%); }
.text-red { color: color.adjust($error-50, $lightness: 3%); }
}
}