Template:RidgeRun Linux Camera Drivers/styles.css: Difference between revisions
No edit summary |
No edit summary |
||
Line 72: | Line 72: | ||
height: 2.5rem; | height: 2.5rem; | ||
border-radius: 50%; | border-radius: 50%; | ||
font-size: | font-size: 20px; | ||
cursor: pointer; | cursor: pointer; | ||
transition: background-color 0.3s ease; | transition: background-color 0.3s ease; |
Revision as of 15:18, 10 September 2024
.header-container { display: flex; flex-direction: row; max-width: 1200px; margin: 0 auto; justify-content: space-between; align-items: center; /*background-color: #000c5e;*/ background-color: #232E3C; border-radius: 4px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } .header { font-family: 'Arial', sans-serif; color: #ffffff; padding: 2rem 1rem; text-align: center; align-items: center; flex-grow: 1; } .header h1 { color: #ffffff; font-family: 'Arial', sans-serif; font-size: 2.5em; margin: 0; text-align: center; border: none; /* Ensure no border is applied */ } .header p { font-family: 'Arial', sans-serif; font-size: 1.2em; margin: 0.5em 0 0; } .arrow { font-size: 60px; background-color: transparent; border: none; color: white; cursor: pointer; } .nav-bar { display: flex; justify-content: space-between; align-items: center; background-color: transparent; color: white; width: 100%; height: 50px; box-sizing: border-box; border-radius: 5px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); border: 1px solid #cccccc; } .nav-bar a { width: 100%; height: 50px; } .nav-bar-logo { height: 50px; } .nav-bar-buttons { display: flex; align-items: center; } .nav-bar-button { background-color: #98CEFF; border: none; color: white; padding: 0px; margin: 5px 5px; width: 2.5rem; height: 2.5rem; border-radius: 50%; font-size: 20px; cursor: pointer; transition: background-color 0.3s ease; } .nav-bar-button:hover { background-color: #232E3C; } .nav-bar-button:disabled { background-color: #999; cursor: not-allowed; } .wiki-toc { font-family: 'Arial', sans-serif; margin: 0 0 1rem 20px; padding: 10px; background-color: #ffffff; /*background: linear-gradient(to bottom, #021FE2, #98CEFF);*/ border: 1px solid #dee2e6; border-radius: 4px; float: right; width: 250px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); } .sticky { /*position: -webkit-sticky; */ position: sticky; top: 10px; right: 10px; float: right; } .wiki-toc-logo { display: flex; justify-content: center; } .wiki-toc-logo img { max-width: 70%; height: auto; } .wiki-toc-header { font-size: 16px; font-weight: bold; margin-bottom: 10px; color: #232e3c; border-bottom: 1px solid #dee2e6; padding-bottom: 5px; display: flex; justify-content: space-between; align-items: center; } .wiki-toc-title { text-align: center; font-size: 22px; font-weight: bold; margin-bottom: 10px; color: #007bff; } .toc-toggle { font-size: 14px; color: #555555; cursor: pointer; } .toc-toggle:hover { text-decoration: underline; } .collapse-all { font-size: 14px; color: #555555; cursor: pointer; margin-left: 10px; } .collapse-all i { margin-left: 5px; } .collapse-all:hover { text-decoration: underline; } .wiki-toc-list { list-style: none; padding-left: 0; } .wiki-toc-list > li { margin-bottom: 5px; list-style-type: none; } .wiki-toc-list li a { text-decoration: none; list-style-type: none; font-size: 14px; display: flex; align-items: center; justify-content: space-between; /* Align items with space between */ } .wiki-toc-list li a:hover { text-decoration: underline; } .toc-sub-list { list-style: none; padding-left: 15px; } .icon-toggle { cursor: pointer; transition: transform 0.3s ease; } .icon-toggle.collapsed { transform: rotate(0deg); /* Right arrow */ } .icon-toggle.expanded { transform: rotate(90deg); /* Down arrow */ } .current-page { background-color: #dddddd; /* Highlight color */ font-weight: bold; } .current-section { background-color: #dddddd; /* Highlight color for parent section */ font-weight: bold; } .wiki-search-bar { display: flex; justify-content: center; margin-bottom: 10px; } .wiki-search-input { width: 200px; padding: 5px; border: 1px solid #dee2e6; border-radius: 4px; } .highlight { background-color: #ffff99; } .main-contents-container { display: flex; flex-direction: column; max-width: 1200px; margin: 0 auto; } .main-content { font-family: 'Arial', sans-serif; display: flex; margin-top: 1rem; gap: 1rem; /* Space between sidebar and content */ align-items: stretch; /* Ensures both child elements stretch to the same height */ } .main-content .content { font-family: 'Arial', sans-serif; display: flex; flex-direction: column; } .content { font-family: 'Arial', sans-serif; flex: 3; background-color: #ffffff; } .block { font-family: 'Arial', sans-serif; background-color: #ffffff; padding: 2rem; border-radius: 4px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); border: 1px solid #dee2e6; margin-bottom: 1rem; } .image-container { text-align: center; /* Center the image within the div */ } .image-container img { max-width: 80%; height: auto; } .preferred-partner-banner { background-color: transparent; padding: 5px 0; text-align: right; margin: 0; /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/ /*border: 1px solid #dee2e6;*/ /*margin-bottom: 10px;*/ } .preferred-partner-banner-content img { margin: 0; height: 70px; vertical-align: middle; } .preferred-partner-banner img:hover { transform: scale(1.05); transition: transform 0.3s ease; } .highlight-animated { /*animation: colorChange 2s infinite;*/ animation: colorChange 2s 10; } @keyframes colorChange { 0% { /*color: #232e3c;*/ background-color: transparent; } 50% { /*color: #ffffff;*/ /*background-color: #232e3c;*/ background-color: #98CEFF; } 100% { /*color: #232e3c;*/ background-color: transparent; } }