homepage.veen.world/app/static/css/default.css

144 lines
2.6 KiB
CSS
Raw Normal View History

2025-01-10 14:08:21 +01:00
/* General link styles */
2025-01-08 14:59:36 +01:00
a {
2025-01-08 17:09:45 +01:00
text-decoration: none;
color: #000000;
}
2025-01-10 14:08:21 +01:00
/* Header styles */
2025-01-08 17:09:45 +01:00
.header img {
float: right;
width: 100px;
height: 100px;
}
2025-01-08 14:59:36 +01:00
2025-01-08 17:09:45 +01:00
.header h1 {
position: relative;
}
2025-01-10 14:08:21 +01:00
/* Equal-height container using flexbox */
2025-01-08 17:09:45 +01:00
.equal-height {
display: flex;
flex: 1;
}
2025-01-10 14:08:21 +01:00
/* Card styles */
.card {
flex: 1; /* Ensures cards fill the height of their container */
border-radius: 5px; /* Rounded corners */
border: 1px solid #ccc; /* Optional border color */
padding: 10px; /* Inner spacing */
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Subtle shadow effect */
color: #000000 !important;
background-color: #f9f9f9;
}
2025-01-08 17:09:45 +01:00
.card-body {
display: flex;
flex-direction: column;
2025-01-10 14:08:21 +01:00
align-items: center; /* Center content horizontally */
text-align: center; /* Center text alignment */
2025-01-08 17:09:45 +01:00
}
2025-01-08 14:59:36 +01:00
2025-01-08 17:09:45 +01:00
.card-icon {
display: flex;
2025-01-10 14:08:21 +01:00
justify-content: center; /* Center the icon horizontally */
2025-01-08 17:09:45 +01:00
}
2025-01-08 14:59:36 +01:00
2025-01-08 17:09:45 +01:00
.card-text,
.card ul {
2025-01-10 14:08:21 +01:00
text-align: left; /* Align text to the left */
2025-01-08 17:09:45 +01:00
}
2025-01-08 14:59:36 +01:00
2025-01-10 14:08:21 +01:00
.card-column {
padding-top: 12px;
padding-bottom: 12px;
2025-01-08 17:09:45 +01:00
}
2025-01-08 14:59:36 +01:00
2025-01-10 14:08:21 +01:00
.card .stretched-link {
2025-01-08 17:09:45 +01:00
font-size: 0.7em;
}
2025-01-08 14:59:36 +01:00
2025-01-10 14:08:21 +01:00
h3.card-title {
2025-01-08 17:09:45 +01:00
font-size: 1.3em;
}
2025-01-08 14:59:36 +01:00
2025-01-10 14:08:21 +01:00
/* Footer styles */
2025-01-08 17:09:45 +01:00
.footer {
margin-top: 12px;
text-align: center;
2025-01-10 14:08:21 +01:00
font-size: 0.7em;
}
.footer p,
.footer h3 {
margin: 0;
padding: 0;
2025-01-08 17:09:45 +01:00
}
2025-01-10 14:08:21 +01:00
h3.footer-title {
font-size: 1.3em;
2025-01-08 17:09:45 +01:00
}
2025-01-10 14:08:21 +01:00
/* Dropdown menu styles */
2025-01-08 22:02:15 +01:00
.dropdown-menu {
position: absolute !important;
}
.dropdown-menu-footer {
position: absolute !important;
top: auto !important;
2025-01-10 14:08:21 +01:00
bottom: 100%; /* Positions the menu above the trigger */
transform: translateY(-10px); /* Optional spacing for smoother appearance */
2025-01-08 22:02:15 +01:00
}
2025-01-10 14:08:21 +01:00
/* Dropdown submenu styles */
2025-01-08 17:09:45 +01:00
.dropdown-submenu {
position: relative;
2025-01-08 18:06:08 +01:00
list-style: none;
2025-01-08 17:09:45 +01:00
}
2025-01-08 22:02:15 +01:00
.dropdown-submenu > .dropdown-menu {
position: absolute;
top: 0;
2025-01-10 14:08:21 +01:00
left: 100%; /* Default position: open to the right */
2025-01-08 22:02:15 +01:00
margin-top: -1px;
2025-01-10 14:08:21 +01:00
z-index: 1050;
transition: opacity 0.3s ease-in-out; /* Smooth opacity transition */
2025-01-09 14:36:44 +01:00
}
2025-01-10 14:08:21 +01:00
/* Handle collapse behavior for dropdowns */
2025-01-09 14:36:44 +01:00
.dropdown-menu.collapse {
display: none;
}
.dropdown-menu.collapse.show {
display: block;
2025-01-09 14:42:38 +01:00
}
2025-01-10 14:08:21 +01:00
/* Ensure submenus are hidden by default */
2025-01-09 14:42:38 +01:00
.dropdown-submenu .dropdown-menu {
display: none;
opacity: 0;
transition: opacity 0.3s ease-in-out;
position: absolute;
left: 100%;
top: 0;
}
2025-01-10 14:08:21 +01:00
/* Show submenu on hover */
2025-01-09 14:42:38 +01:00
.dropdown-submenu:hover > .dropdown-menu {
display: block;
opacity: 1;
}
2025-01-10 14:08:21 +01:00
/* Ensure submenu remains visible when hovered over */
2025-01-09 14:42:38 +01:00
.dropdown-submenu:hover > .dropdown-menu:hover {
display: block;
opacity: 1;
}
2025-01-10 14:05:53 +01:00
2025-01-10 14:08:21 +01:00
/* Handle dynamic submenu positioning */
2025-01-10 14:05:53 +01:00
.dropdown-submenu > .dropdown-menu[style*="right: 100%"] {
2025-01-10 14:08:21 +01:00
left: auto; /* Override left position for leftward opening */
2025-01-10 14:05:53 +01:00
}