qa/custom-style.css at master · meshery/qa · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
@charset "UTF-8";
@import "https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700");

body {
    background: #3C494F;
}
div[data-testid="base-layout"] {
    background: #3C494F;
}
a[href="https://allurereport.org"]{
    display: none;
}
.l5-dark-yellow { background-color: #ebc017 !important; }

.l5-dark-yellow-text { color: #ebc017 !important; }

.l5-light-yellow { background-color: #e9c46a !important; }
.l5-light-yellow .l5-light-yellow-text { color: #e9c46a !important; }
.l5-light-yellow table.adapters { box-shadow: 1px 1px 2px grey; border: 1px; }
.l5-light-yellow table.adapters td { width: auto; vertical-align: middle; border: 1px solid darkgray; }
.l5-light-yellow table.adapters td.no-adapters { width: auto; text-align: center; color: #aaa; font-style: italic; }
.l5-light-yellow table.adapters td.alpha-adapters { width: auto; background-color: lightgray; text-align: center; }
.l5-light-yellow table.adapters td.beta-adapters { width: auto; background-color: #00D3A9; text-align: center; color: #fff; }
.l5-light-yellow table.adapters td.stable-adapters { width: auto; background-color: #3C494F; text-align: center; color: #fff; }
.l5-light-yellow table.adapters tr:hover { background-color: #f5f5f5; }
.l5-light-yellow table.adapters img.adapter-logo { vertical-align: middle; margin-right: 5px; height: 30px; width: 30px; }

.social__link .footer-icons-text { display: none; }

/* Show the span when hovering over the link */
.social__link:hover .footer-icons-text { display: block; }

.main-container { padding: 3.5rem 4.4rem; overflow-x: auto; width: 100%; min-height: calc(100vh - var(--footer-height)); flex-grow: 5; }
@media (max-width: 1200px) { .main-container { flex: 0 0 100%; } }
@media (max-width: 600px) { .main-container { padding: 1.5rem 1.5rem 1.5rem 2.5rem; } }
.main-container .breadcrumb { list-style: none; }
.main-container #breadcrumbs { font-size: .9rem; line-height: 1.15rem; }
.main-container #breadcrumbs a { color: var(--color-grey-dark); transition: all 0.3s; }
.main-container #breadcrumbs a:hover { color: var(--color-secondary-dark); }


html { scroll-padding-bottom: var(--footer-height); scroll-behavior: smooth; }

.footer { background: linear-gradient(to bottom, #151515 5%, #252525 20%, #2f2f2f, #303030, #3d3d3d); display: flex; flex-direction: column; padding: min(2vh, 2vw); gap: min(2vh, 5vw); }
@media (max-width: 600px) { .footer { height: calc(var(--footer-height) - 4.0rem); } }
@media (max: 1200px) { .footer { height: var(--footer-height); } }
.footer * { color: white; }
.footer .text-white { color: #adb5bd; font-size: 1rem; text-align: center; }
@media (max-width: 600px) { .footer .text-white { font-size: .8rem; } }
.footer .footer-icons-list { display: flex; gap: 2rem; flex-wrap: wrap; justify-content: center; }
@media (max-width: 600px) { .footer .footer-icons-list { gap: .5rem; } }
.footer .footer-icons-list .footer-icons { position: relative; }
.footer .footer-icons-list .footer-icons .social__link span { position: absolute; left: 50%; top: 0; width: max-content; padding: 0.5rem 1rem; background-color: #495057; transform: translate(-50%, -120%); border-radius: 5px; opacity: 0; transition: all 0.3s; margin-bottom: 0.5rem; }
.footer .footer-icons-list .footer-icons .social__link img, .footer .footer-icons-list .footer-icons .social__link svg { transition: all 0.3s; filter: grayscale(1) invert(0.35); width: 25px; height: 25px; }
@media (max-width: 1200px) { .footer .footer-icons-list .footer-icons .social__link img, .footer .footer-icons-list .footer-icons .social__link svg { width: 2rem; height: 2rem; } }
@media (max-width: 600px) { .footer .footer-icons-list .footer-icons .social__link img, .footer .footer-icons-list .footer-icons .social__link svg { width: 1.1rem; height: 1.1rem; } }
.footer .footer-icons-list .footer-icons .social__link img:hover, .footer .footer-icons-list .footer-icons .social__link svg:hover { filter: none; }
.footer .footer-icons-list .footer-icons .social__link img:hover + span, .footer .footer-icons-list .footer-icons .social__link svg:hover + span { opacity: 1; }
.footer .footer-icons-list .footer-icons .social__link img.github:hover { filter: brightness(0) invert(1); fill: white; }
.footer .footer-icons-list .footer-icons .social__link svg:hover { fill: #0073cf; }
.footer .footer-icons-list .footer-icons .social__link .twitter:hover { fill: #000; }
.footer .footer-icons-list .footer-icons .social__link svg.youtube:hover { fill: #FF0000; }

:root { --footer-height: 8.0rem;  }