Template:RidgeRun Linux Camera Drivers/Flow diagram: Difference between revisions
No edit summary |
Efernandez (talk | contribs) No edit summary |
||
(6 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
{{#tag:html| | {{#tag:html| | ||
<style> | <style> | ||
/* Styles for flowchart elements */ | |||
.container { | |||
width:50%; | |||
display: grid; | |||
grid-template-columns: 1fr 1fr 1fr; | |||
place-items: center; | |||
margin-left: auto; | |||
margin-right: auto; | |||
} | |||
.col-1 { | |||
grid-column: 1; | |||
} | |||
.col-2 { | |||
grid-column: 2; | |||
} | |||
.col-3 { | |||
grid-column: 3; | |||
} | |||
.span-3 { | |||
grid-column: span 3; | |||
} | |||
.node { | |||
background-color: #f0f0f0; | |||
font-weight:bold; | |||
border: 1px solid #ccc; | |||
border-radius: 15px; | |||
text-align: center; | |||
width: 100%; | |||
height: 100%; | |||
min-height: 50px; | |||
display: flex; | |||
align-items: center; /* Vertically centers the content */ | |||
justify-content: center; /* Horizontally centers the content */ | |||
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.2); | |||
} | |||
} | |||
.node a { | |||
color: black; | |||
text-decoration:none; | |||
} | |||
} | |||
.clickable { | |||
transition: background-color 0.3s ease, box-shadow 0.3s ease; | |||
cursor: pointer; | |||
} | |||
} | |||
.clickable:hover { | |||
filter: saturate(80%); | |||
box-shadow: 0px 8px 12px rgba(0, 0, 0, 0.3); | |||
} | |||
} | |||
.desition-container { | |||
width:100%; | |||
height:100%; | |||
filter: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.2)); | |||
} | |||
} | |||
.desition-container:hover { | |||
filter: saturate(80%); | |||
filter: drop-shadow(0px 8px 12px rgba(0, 0, 0, 0.3)); | |||
} | } | ||
.desition { | |||
min-height: 100px; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); | |||
} | |||
.right-down-arrow { | |||
background-color: black; | |||
border: 1px solid; | |||
width: 100%; | |||
height: 100%; | |||
display: flex; | |||
min-height: 50px; | |||
min-width: 50px; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon( | |||
0 calc(50% - 2px), | |||
calc(50% + 2px) calc(50% - 2px), | |||
calc(50% + 2px) calc(100% - 15px), | |||
calc(50% + 7px) calc(100% - 15px), | |||
50% 100%, | |||
calc(50% - 7px) calc(100% - 15px), | |||
calc(50% - 2px) calc(100% - 15px), | |||
calc(50% - 2px) calc(50% + 2px), | |||
0 calc(50% + 2px)); | |||
} | |||
.right-down-line { | |||
background-color: black; | |||
width: 100%; | |||
height: 100%; | |||
display: flex; | |||
min-height: 50px; | |||
min-width: 50px; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon( | |||
0% calc(50% - 2px), | |||
calc(50% + 2px) calc(50% - 2px), | |||
calc(50% + 2px) 100%, | |||
calc(50% - 2px) 100%, | |||
calc(50% - 2px) calc(50% + 2px), | |||
0 calc(50% + 2px)); | |||
} | |||
.down-arrow { | |||
background-color: black; | |||
border: 1px solid; | |||
width: 100%; | |||
height: 100%; | |||
display: flex; | |||
min-height: 30px; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon( | |||
calc(50% + 2px) 0, | |||
calc(50% + 2px) calc(100% - 15px), | |||
calc(50% + 7px) calc(100% - 15px), | |||
50% 100%, | |||
calc(50% - 7px) calc(100% - 15px), | |||
calc(50% - 2px) calc(100% - 15px), | |||
calc(50% - 2px) 0); | |||
} | |||
.left-arrow { | |||
background-color: black; | |||
border: 1px solid; | |||
width: 100%; | |||
height: 100%; | |||
display: flex; | |||
min-height: 50px; | |||
min-width: 50px; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon( | |||
0% 50%, | |||
15px calc(50% - 7px), | |||
15px calc(50% - 2px), | |||
100% calc(50% - 2px), | |||
100% calc(50% + 2px), | |||
15px calc(50% + 2px), | |||
15px calc(50% + 7px)); | |||
} | |||
.horizontal-line { | |||
background-color: black; | |||
width: 100%; | |||
height: 100%; | |||
min-height: 50px; | |||
min-width: 50px; | |||
display: flex; | |||
/*https://bennettfeely.com/clippy/*/ | |||
clip-path: polygon( | |||
0% calc(50% - 2px), | |||
100% calc(50% - 2px), | |||
100% calc(50% + 2px), | |||
0% calc(50% + 2px)); | |||
} | |||
</style> | |||
<div class="container"> | |||
<div class="node col-1" style="background-color:#021FE2; color:white;">Do you need a custom driver?</div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="node clickable col-1"><a href="https://developer.ridgerun.com/wiki/index.php/RidgeRun_Linux_Camera_Drivers/Expert_Camera_Driver_Services/Services_Provided#Linux_Drivers_Services">Check our Linux Driver Services!</a></div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="node clickable col-1"><a href="https://developer.ridgerun.com/wiki/index.php/RidgeRun_Linux_Camera_Drivers/Available_Camera_Drivers/List_of_Tested_Camera_Sensors">Check tested drivers list!</a></div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="desition-container col-1"><div class="node desition">Driver in the list?</div></div> | |||
<div class="horizontal-line col-2"></div> | |||
<div class="right-down-line col-3"></div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="down-arrow col-3"></div> | |||
<div class="node col-1" style="background-color:#1ABA3F; color:white;">YES</div> | |||
<div class="node col-3" style="background-color:#EB1E07; color:white;">NO</div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="down-arrow col-3"></div> | |||
<div class="node clickable col-1"><a href="https://developer.ridgerun.com/wiki/index.php/RidgeRun_Linux_Camera_Drivers/Available_Camera_Drivers/Custom_Driver_Development#Hiring_Process">Check our hiring process!</a></div> | |||
<div class="left-arrow col-2"></div> | |||
<div class="node clickable col-3"><a href="https://developer.ridgerun.com/wiki/index.php/RidgeRun_Linux_Camera_Drivers/Expert_Camera_Driver_Services/Client_Requirements">Check the client requirements!</a></div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="node clickable col-1"><a href="https://www.ridgerun.com/contact" target="_blank">Contact Us!</a></div> | |||
<div class="down-arrow col-1"></div> | |||
<div class="node col-1" style="background-color:#021FE2; color:white;">Driver Delivery!</div> | |||
</div> | </div> | ||
}} | }} |
Latest revision as of 17:04, 12 September 2024
Do you need a custom driver?
Driver in the list?
YES
NO
Driver Delivery!