* added new entry page
This commit is contained in:
Stephan Hadan
parent
6e5614763d
commit
e500631b7f
13 changed files with 666 additions and 2373 deletions
|
|
@ -0,0 +1,15 @@
|
||||||
|
# Über mich
|
||||||
|
|
||||||
|
Hey, willkommen auf meiner Seite! Schön, dass du hier bist. Lass mich dir ein bisschen über mich erzählen.
|
||||||
|
|
||||||
|
Mit über 25 Jahren Erfahrung als IT Operations Engineer kenne ich die Herausforderungen und Chancen in der IT-Welt genau. Als begeisterter Open-Source-Fan und Systemadministrator setze ich auf innovative Technologien, um Lösungen zu entwickeln, die effizient, sicher und nachhaltig sind.
|
||||||
|
|
||||||
|
Einer meiner Schwerpunkte liegt auf **ISO 27001**-Themen, also allem, was mit Informationssicherheit zu tun hat. Ob es darum geht, Risiken zu bewerten, Sicherheitsrichtlinien zu erstellen oder ein ISMS aufzubauen – ich helfe dabei, Sicherheit auf das nächste Level zu bringen.
|
||||||
|
|
||||||
|
Im Bereich **Endpoint Management** habe ich Erfahrung mit verschiedenen MDM-Lösungen wie MicroMDM, JamfNow! und Microsoft Intune. Damit sorge ich dafür, dass Geräte sicher und unkompliziert verwaltet werden können.
|
||||||
|
|
||||||
|
Durch meine langjährige Arbeit als Entwickler eines ERP-Systems für die Schmuckbranche verstehe ich, worauf es in der Softwareentwicklung ankommt. Diese Perspektive hilft mir, eng mit Entwicklern zusammenzuarbeiten und **DevOps**-Prozesse zu optimieren.
|
||||||
|
|
||||||
|
Als **System Reliability Engineer** ist es mein Ziel, Systeme so zu gestalten, dass sie stabil, skalierbar und automatisiert sind. Ich bin überzeugt, dass Open Source oft die bessere Wahl ist, und liebe es, neue Technologien auszuprobieren und kreative Lösungen zu finden.
|
||||||
|
|
||||||
|
Ich freue mich darauf, gemeinsam an spannenden Projekten zu arbeiten und die IT-Welt ein Stück besser zu machen!
|
||||||
BIN
docs/assets/brand/Satoshi-Variable.ttf
Normal file
BIN
docs/assets/brand/Satoshi-Variable.ttf
Normal file
Binary file not shown.
495
docs/assets/css/custom.css
Normal file
495
docs/assets/css/custom.css
Normal file
|
|
@ -0,0 +1,495 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Satoshi';
|
||||||
|
src: url("/assets/brand/Satoshi-Variable.ttf") format("truetype");
|
||||||
|
font-display: swap;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Define brand */
|
||||||
|
:root, [data-md-color-scheme="default"] {
|
||||||
|
--md-default-bg-color: rgb(250, 250, 250);
|
||||||
|
--md-primary-fg-color: rgb(255, 255, 255);
|
||||||
|
--md-primary-fg-color--light: #5FFFD7;
|
||||||
|
--md-primary-fg-color--dark: #E549FF;
|
||||||
|
--md-primary-bg-color: rgba(0,0,0,.75);
|
||||||
|
--md-primary-bg-color--light: rgba(0,0,0,.54);
|
||||||
|
--md-accent-fg-color: #E549FF;
|
||||||
|
--pg-light-border: rgb(229, 231, 235);
|
||||||
|
--hb-hero-color: rgb(45, 45, 45);
|
||||||
|
}
|
||||||
|
:root, [data-md-color-scheme="slate"] {
|
||||||
|
--md-default-bg-color: rgb(26, 26, 27);
|
||||||
|
--md-primary-fg-color: rgb(15, 15, 15);
|
||||||
|
--md-primary-fg-color--light: #5FFFD7;
|
||||||
|
--md-primary-fg-color--dark: #FCDB17;
|
||||||
|
--md-primary-bg-color: rgba(0,0,0,.75);
|
||||||
|
--md-primary-bg-color--light: rgba(0,0,0,.54);
|
||||||
|
--md-accent-fg-color: #FCDB17;
|
||||||
|
--pg-light-border: rgb(47, 47, 47);
|
||||||
|
--hb-hero-color: #5FFFD7;
|
||||||
|
/* --md-footer-bg-color--dark: var(--md-default-bg-color); */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Better contrast link colors */
|
||||||
|
[data-md-color-scheme="default"] > * {
|
||||||
|
--md-typeset-a-color: #00B1BB;
|
||||||
|
}
|
||||||
|
[data-md-color-scheme="slate"] > * {
|
||||||
|
--md-typeset-a-color: #5FFFD7;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hide shadow under navigation */
|
||||||
|
.md-header[data-md-state="shadow"],
|
||||||
|
.md-header--shadow {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* buttons */
|
||||||
|
.md-typeset .md-button {
|
||||||
|
color: var(--md-typeset-color);
|
||||||
|
background: none;
|
||||||
|
border: 1px solid var(--pg-light-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px -1px;
|
||||||
|
}
|
||||||
|
.md-typeset .md-button--primary {
|
||||||
|
color: var(--md-typeset-a-color);
|
||||||
|
background-color: var(--md-primary-fg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .grid.cards > :is(ul, ol) > li, .md-typeset .grid > .card { /* Firefox */
|
||||||
|
color: var(--md-typeset-color);
|
||||||
|
background: var(--md-primary-fg-color);
|
||||||
|
border: 1px solid var(--pg-light-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px -1px;
|
||||||
|
transition: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .grid.cards>:-webkit-any(ul,ol)>li, .md-typeset .grid>.card { /* Webkit */
|
||||||
|
color: var(--md-typeset-color);
|
||||||
|
background: var(--md-primary-fg-color);
|
||||||
|
border: 1px solid var(--pg-light-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px -1px;
|
||||||
|
transition: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .grid.cards > :is(ul, ol) > li:is(:focus-within, :hover), .md-typeset .grid > .card:is(:focus-within, :hover) { /* Firefox */
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px -1px;
|
||||||
|
border-color: var(--md-accent-fg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .grid.cards>:-webkit-any(ul,ol)>li:-webkit-any(:focus-within,:hover) { /* Webkit */
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px -1px;
|
||||||
|
border-color: var(--md-accent-fg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* typewriter */
|
||||||
|
|
||||||
|
#typewriter {
|
||||||
|
color: var(--md-accent-fg-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* header font */
|
||||||
|
|
||||||
|
.md-header__topic:first-child {
|
||||||
|
font-family: 'Satoshi';
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset h1 {
|
||||||
|
font-family: 'Satoshi';
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--md-typeset-a-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
h2, h3 {
|
||||||
|
font-family: 'Satoshi';
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Correct page icon size */
|
||||||
|
.md-nav__link svg {
|
||||||
|
width: 22px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Un-sticky sidebar without JS */
|
||||||
|
.no-js .md-sidebar {
|
||||||
|
align-self: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Make header icons smaller */
|
||||||
|
.md-header__button.md-icon svg {
|
||||||
|
height: 1rem;
|
||||||
|
width: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* override language selector */
|
||||||
|
.md-select button img.twemoji {
|
||||||
|
height: 1rem;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-select__link img.twemoji {
|
||||||
|
height: 1rem;
|
||||||
|
vertical-align: text-bottom;
|
||||||
|
margin-right: 1%;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Custom header + nav */
|
||||||
|
.md-header >*, .md-tabs {
|
||||||
|
background: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-color-scheme="slate"] .md-header >*, [data-md-color-scheme="slate"] .md-tabs {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-header__button {
|
||||||
|
color: var(--md-default-fg-color--light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-header, .md-tabs { /* firefox fallback */
|
||||||
|
background-color: rgba(255, 255, 255, .95);
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-color-scheme="slate"] .md-header, [data-md-color-scheme="slate"] .md-tabs { /* firefox fallback */
|
||||||
|
background-color: rgba(9, 9, 9, 0.95);
|
||||||
|
}
|
||||||
|
|
||||||
|
@supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {
|
||||||
|
.md-header, .md-tabs {
|
||||||
|
background-color: rgba(255, 255, 255, .6);
|
||||||
|
-webkit-backdrop-filter: blur(12px);
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
[data-md-color-scheme="slate"] .md-header, [data-md-color-scheme="slate"] .md-tabs {
|
||||||
|
background-color: rgba(0, 0, 0, 0.5);
|
||||||
|
-webkit-backdrop-filter: blur(12px);
|
||||||
|
backdrop-filter: blur(12px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-color-scheme="slate"] .md-nav--primary .md-nav__title[for="__drawer"] {
|
||||||
|
color: var(--md-typeset-a-color)
|
||||||
|
}
|
||||||
|
|
||||||
|
header[class="md-header md-header--shadow"], nav[class="md-tabs"] {
|
||||||
|
border-bottom: 1px solid var(--pg-light-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 60em) {
|
||||||
|
.md-search__overlay {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-search__form {
|
||||||
|
border: 1px solid var(--pg-light-border);
|
||||||
|
background-color: var(--md-primary-fg-color) !important;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(0, 0, 0, 0.02) 0px 1px 2px -1px;
|
||||||
|
border-radius: 6px;
|
||||||
|
height: 1.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-toggle="search"]:checked ~ .md-header .md-search__form {
|
||||||
|
border-radius: 6px 6px 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
[dir="ltr"] .md-search__output {
|
||||||
|
top: initial;
|
||||||
|
border-radius: 0 0 6px 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-toggle="search"]:checked ~ .md-header .md-search__output {
|
||||||
|
box-shadow: 0 0 .6rem rgba(0,0,0,.07);
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-search__input {
|
||||||
|
font-size: .6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-search__options {
|
||||||
|
top: .05rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-search__icon, .md-search__input::placeholder {
|
||||||
|
color: var(--md-default-fg-color--light) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-search__icon svg {
|
||||||
|
width: .75rem;
|
||||||
|
height: .75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-tabs__link--active {
|
||||||
|
background:
|
||||||
|
radial-gradient(farthest-side, var(--md-typeset-a-color) 98%,transparent 100%) bottom right/2px 2px,
|
||||||
|
radial-gradient(farthest-side, var(--md-typeset-a-color) 98%,transparent 100%) bottom left /2px 2px,
|
||||||
|
linear-gradient(var(--md-typeset-a-color),var(--md-typeset-a-color)) bottom/calc(100% - 2px) 2px;
|
||||||
|
background-repeat:no-repeat;
|
||||||
|
background-origin: padding-box;
|
||||||
|
padding-bottom: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-footer {
|
||||||
|
margin-top: 1rem;
|
||||||
|
border-top: 1px solid var(--pg-light-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wide card grids */
|
||||||
|
.md-typeset .grid.wide {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.md-typeset .grid.wide {
|
||||||
|
grid-template-columns: repeat(1, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Primary buttons */
|
||||||
|
.md-main .md-button--primary {
|
||||||
|
color: var(--md-primary-fg-color);
|
||||||
|
background-color: var(--hb-hero-color);
|
||||||
|
border-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset hr {
|
||||||
|
margin-top: 5rem;
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Testimonial cards */
|
||||||
|
.testimonial {
|
||||||
|
padding: 40px 20px;
|
||||||
|
border: 1px solid var(--pg-light-border);
|
||||||
|
border-radius: 6px;
|
||||||
|
background-color: var(--md-primary-fg-color);
|
||||||
|
/* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: box-shadow 0.3s; */
|
||||||
|
|
||||||
|
.quote {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headshot {
|
||||||
|
width: 5rem;
|
||||||
|
height: 5rem;
|
||||||
|
border-radius: 50%;
|
||||||
|
object-fit: cover; /* Ensures the image keeps its aspect ratio */
|
||||||
|
}
|
||||||
|
|
||||||
|
.author {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
width: 7rem; /* You can adjust this based on the size you want */
|
||||||
|
object-fit: contain; /* Ensures the logo keeps its aspect ratio */
|
||||||
|
transition: opacity 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo:hover {
|
||||||
|
opacity: 0.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.role {
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: var(--md-default-fg-color--light);
|
||||||
|
/* margin-top: 0.5rem; */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Accent color */
|
||||||
|
.accent {
|
||||||
|
color: var(--md-typeset-a-color);
|
||||||
|
}
|
||||||
|
.accent a {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Centered item */
|
||||||
|
.centered {
|
||||||
|
display: block;
|
||||||
|
margin: 0 auto;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Announcement Bar */
|
||||||
|
.md-banner {
|
||||||
|
background-color: var(--md-typeset-a-color);
|
||||||
|
color: var(--md-default-bg-color);
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Logo Grids */
|
||||||
|
.flex-container {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
.flex-item {
|
||||||
|
flex-basis: calc(50% - 10px);
|
||||||
|
}
|
||||||
|
.flex-item img {
|
||||||
|
padding: 3rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Botcamp - 4 col grid */
|
||||||
|
|
||||||
|
.botcamp > .flex-item {
|
||||||
|
flex-basis: calc(25% - 10px); /* adjust this value for different screen sizes */
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
.botcamp > .flex-item img {
|
||||||
|
padding: 1rem 3rem;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
@media only screen and (min-width: 769px) {
|
||||||
|
.botcamp > .flex-item {
|
||||||
|
flex-basis: calc(25% - 10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.flex-item {
|
||||||
|
flex-basis: calc(50% - 10px);
|
||||||
|
}
|
||||||
|
.botcamp > .flex-item img {
|
||||||
|
padding: 3rem 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Home - 3 col grid */
|
||||||
|
|
||||||
|
.home > .flex-item {
|
||||||
|
flex-basis: calc(33% - 10px); /* adjust this value for different screen sizes */
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
.home > .flex-item img {
|
||||||
|
padding: 1rem 3rem;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
@media only screen and (min-width: 769px) {
|
||||||
|
.home > .flex-item {
|
||||||
|
flex-basis: calc(33% - 10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.home > .flex-item {
|
||||||
|
flex-basis: calc(50% - 10px);
|
||||||
|
}
|
||||||
|
.home > .flex-item img {
|
||||||
|
padding: 3rem 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
[data-md-color-scheme="default"] .dark-logo {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-md-color-scheme="slate"] .light-logo {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Two Thirds Grids */
|
||||||
|
.grid.two-thirds {
|
||||||
|
grid-template-columns: 2fr 1fr; /* Default to 2/3 and 1/3 width columns */
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.grid.two-thirds {
|
||||||
|
grid-template-columns: 1fr; /* All items will stack on top of each other */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Highlights text to link color */
|
||||||
|
.text-highlight {
|
||||||
|
color: var(--md-typeset-a-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Highlights 2nd card in a card grid to the hover state */
|
||||||
|
.highlight-second-card > ul > li:nth-child(2) {
|
||||||
|
border-color: var(--md-accent-fg-color) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fix mobile search with blurred header
|
||||||
|
Causes a delay when opening search, not optimal */
|
||||||
|
[data-md-scrolllock] .md-header,
|
||||||
|
[data-md-scrolllock] .md-tabs {
|
||||||
|
-webkit-backdrop-filter: none !important;
|
||||||
|
backdrop-filter: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Custom Metrics Display */
|
||||||
|
.md-typeset .custom-metric {
|
||||||
|
text-align: center !important;
|
||||||
|
padding: 2rem 0 !important;
|
||||||
|
margin: 1rem 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .custom-metric .metric-value {
|
||||||
|
font-size: 4rem !important;
|
||||||
|
font-weight: 700 !important;
|
||||||
|
color: var(--md-primary-fg-color--dark) !important;
|
||||||
|
line-height: 1.2 !important;
|
||||||
|
font-family: 'Satoshi', sans-serif !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .custom-metric .metric-label {
|
||||||
|
font-size: 1rem !important;
|
||||||
|
color: var(--md-default-fg-color) !important;
|
||||||
|
margin-top: 0.5rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive adjustments */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.md-typeset .custom-metric .metric-value {
|
||||||
|
font-size: 3rem !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.md-typeset .custom-metric .metric-label {
|
||||||
|
font-size: 0.9rem !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Exchange Grid */
|
||||||
|
.exchange-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(8, 1fr);
|
||||||
|
gap: 10px;
|
||||||
|
align-items: center;
|
||||||
|
justify-items: center;
|
||||||
|
padding-top: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exchange-grid .flex-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.exchange-grid img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
padding: 0rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1200px) {
|
||||||
|
.exchange-grid {
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 600px) {
|
||||||
|
.exchange-grid {
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 193 KiB |
19
docs/assets/js/mathjax.js
Normal file
19
docs/assets/js/mathjax.js
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
window.MathJax = {
|
||||||
|
tex: {
|
||||||
|
inlineMath: [["\\(", "\\)"]],
|
||||||
|
displayMath: [["\\[", "\\]"]],
|
||||||
|
processEscapes: true,
|
||||||
|
processEnvironments: true
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
ignoreHtmlClass: ".*|",
|
||||||
|
processHtmlClass: "arithmatex"
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
document$.subscribe(() => {
|
||||||
|
MathJax.startup.output.clearCache()
|
||||||
|
MathJax.typesetClear()
|
||||||
|
MathJax.texReset()
|
||||||
|
MathJax.typesetPromise()
|
||||||
|
})
|
||||||
14
docs/assets/js/typewriter.js
Normal file
14
docs/assets/js/typewriter.js
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
document$.subscribe(() => {
|
||||||
|
const instance = new Typewriter('#typewriter', {
|
||||||
|
strings: [
|
||||||
|
'Systemadministrator',
|
||||||
|
'Site Reliability Engineer',
|
||||||
|
'DevOps Engineer',
|
||||||
|
'IT Operations Engineer',
|
||||||
|
'Informationssicherheit',
|
||||||
|
'Datenschutz',
|
||||||
|
],
|
||||||
|
autoStart: true,
|
||||||
|
loop: true,
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
@ -1,9 +1,10 @@
|
||||||
---
|
---
|
||||||
template: home.html
|
template: home.html
|
||||||
title: Stephan Hadan
|
title: Stephan Hadan
|
||||||
social:
|
pdf: false
|
||||||
cards_layout_options:
|
hide:
|
||||||
title: Documentation that simply works
|
- toc
|
||||||
|
- navigation
|
||||||
|
- feedback
|
||||||
|
- title
|
||||||
---
|
---
|
||||||
|
|
||||||
Welcome to Material for MkDocs.
|
|
||||||
43
mkdocs.yml
43
mkdocs.yml
|
|
@ -36,27 +36,21 @@ copyright: Copyright © 2024-2025 Stephan Hadan
|
||||||
theme:
|
theme:
|
||||||
name: material
|
name: material
|
||||||
custom_dir: overrides
|
custom_dir: overrides
|
||||||
palette:
|
palette:
|
||||||
- media: "(prefers-color-scheme)"
|
# - media: "(prefers-color-scheme: dark)"
|
||||||
|
- scheme: slate
|
||||||
|
accent: amber
|
||||||
toggle:
|
toggle:
|
||||||
icon: material/link
|
icon: material/brightness-2
|
||||||
name: Switch to light mode
|
name: "Switch to light mode"
|
||||||
- media: "(prefers-color-scheme: light)"
|
# - media: "(prefers-color-scheme: light)"
|
||||||
scheme: default
|
- scheme: default
|
||||||
primary: indigo
|
accent: deep purple
|
||||||
accent: indigo
|
|
||||||
toggle:
|
toggle:
|
||||||
icon: material/toggle-switch
|
icon: material/brightness-5
|
||||||
name: Switch to dark mode
|
name: "Switch to dark mode"
|
||||||
- media: "(prefers-color-scheme: dark)"
|
|
||||||
scheme: slate
|
|
||||||
primary: black
|
|
||||||
accent: indigo
|
|
||||||
toggle:
|
|
||||||
icon: material/toggle-switch-off
|
|
||||||
name: Switch to system preference
|
|
||||||
font:
|
font:
|
||||||
text: Roboto
|
text: Noto Sans
|
||||||
code: Roboto Mono
|
code: Roboto Mono
|
||||||
logo: assets/logo.png
|
logo: assets/logo.png
|
||||||
favicon: images/favicon.png
|
favicon: images/favicon.png
|
||||||
|
|
@ -137,6 +131,10 @@ plugins:
|
||||||
categories:
|
categories:
|
||||||
- categories
|
- categories
|
||||||
- tags
|
- tags
|
||||||
|
- social:
|
||||||
|
cards_layout_options:
|
||||||
|
background_color: "#151819"
|
||||||
|
color: "#5FFFD7"
|
||||||
- macros
|
- macros
|
||||||
|
|
||||||
# Additional configuration
|
# Additional configuration
|
||||||
|
|
@ -164,6 +162,9 @@ extra:
|
||||||
link: https://stephan.hadan.de/feed_rss_created.xml
|
link: https://stephan.hadan.de/feed_rss_created.xml
|
||||||
name: Neueste Blogbeiträge
|
name: Neueste Blogbeiträge
|
||||||
|
|
||||||
|
extra_css:
|
||||||
|
- assets/css/custom.css
|
||||||
|
|
||||||
# Extensions
|
# Extensions
|
||||||
markdown_extensions:
|
markdown_extensions:
|
||||||
- abbr
|
- abbr
|
||||||
|
|
@ -197,7 +198,11 @@ markdown_extensions:
|
||||||
# Extra Javascript
|
# Extra Javascript
|
||||||
extra_javascript:
|
extra_javascript:
|
||||||
- https://unpkg.com/tablesort@5.3.0/dist/tablesort.min.js
|
- https://unpkg.com/tablesort@5.3.0/dist/tablesort.min.js
|
||||||
- javascripts/tablesort.js
|
- assets/js/tablesort.js
|
||||||
|
- assets/js/mathjax.js
|
||||||
|
- https://unpkg.com/mathjax@3/es5/tex-mml-chtml.js
|
||||||
|
- assets/js/typewriter.js
|
||||||
|
- https://unpkg.com/typewriter-effect@latest/dist/core.js
|
||||||
|
|
||||||
# Page tree
|
# Page tree
|
||||||
nav:
|
nav:
|
||||||
|
|
|
||||||
|
|
@ -1,340 +1,102 @@
|
||||||
{% extends "overrides/main-styles.html" %}
|
{% extends "base.html" %}
|
||||||
|
|
||||||
<!-- Render hero under tabs -->
|
|
||||||
{% block tabs %}
|
{% block tabs %}
|
||||||
{{ super() }}
|
{{ super() }}
|
||||||
|
|
||||||
<!-- Hero for landing page -->
|
<!-- Additional styles for landing page -->
|
||||||
|
<style>
|
||||||
|
.mdx-container {
|
||||||
|
background: url("data:image/svg+xml;utf8,<svg width='100%' height='100%' viewBox='0 0 1123 258' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'><g transform='matrix(-1.01432,0,0,0.388868,1134.41,161.501)'><path d='M1124,2L1124,258L-1,258L-1,210C-1,210 15,215 54,215C170,215 251,123 379,123C500,123 493,169 633,169C773,169 847,2 1205,3L1124,2Z' style='fill:rgb(250, 250, 250);fill-rule:nonzero;'/></g></svg>")
|
||||||
|
no-repeat bottom,
|
||||||
|
linear-gradient(to bottom, rgb(255 255 255/.8), #00C2CE 99%, var(--md-default-bg-color) 99%);
|
||||||
|
background-size: contain;
|
||||||
|
padding-top: 1rem;
|
||||||
|
}
|
||||||
|
[data-md-color-scheme="slate"] .mdx-container {
|
||||||
|
background: url("data:image/svg+xml;utf8,<svg width='100%' height='100%' viewBox='0 0 1123 258' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xml:space='preserve' xmlns:serif='http://www.serif.com/' style='fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;'><g transform='matrix(-1.01432,0,0,0.388868,1134.41,161.501)'><path d='M1124,2L1124,258L-1,258L-1,210C-1,210 15,215 54,215C170,215 251,123 379,123C500,123 493,169 633,169C773,169 847,2 1205,3L1124,2Z' style='fill:rgb(26, 26, 27);fill-rule:nonzero;'/></g></svg>")
|
||||||
|
no-repeat bottom, rgba(9, 9, 9, 0.95);
|
||||||
|
background-size: contain;
|
||||||
|
}
|
||||||
|
|
||||||
<!--binbash leverage documetation-->
|
.mdx-hero {
|
||||||
<section class="first-gradiant-body w-100">
|
color: var(--hb-hero-color);
|
||||||
<div class="md-grid conteiner-row pt-1 pt-lg-5 my-4">
|
margin: 0 0.8rem;
|
||||||
<div class="px-3 ctx-header-text conteiner">
|
}
|
||||||
<div class="conteiner-row">
|
.mdx-hero h1 {
|
||||||
<p class="h1 text-xs-center">
|
color: currentcolor;
|
||||||
binbash
|
margin-bottom: 1rem;
|
||||||
<img src="assets/images/logos/leverage-title-logo.svg" class="mx-3 leverage-title-logo" height="22%"/>
|
font-size: 2.6rem;
|
||||||
documentation
|
}
|
||||||
</p>
|
@media screen and (max-width: 29.9375em) {
|
||||||
</div>
|
.mdx-hero h1 {
|
||||||
<img src="assets/images/logos/binbash-landing-header.svg" class="laverage-header-img d-lg-none d-xl-none mx-auto mb-5" />
|
font-size: 1.4rem;
|
||||||
<p class="h3 text-xs-center">The leading, easy to deploy, reusable and most automated solution for defining, provisioning and managing your secure and scalable multi-account AWS infrastructure environment.</p>
|
}
|
||||||
<div class="conteiner-row conteiner-xs">
|
}
|
||||||
<button
|
.mdx-hero__content {
|
||||||
type="button"
|
padding-bottom: 6rem;
|
||||||
title="{{ page.next_page.title | e }}"
|
}
|
||||||
onclick="location.href='./concepts/'"
|
@media screen and (min-width: 60em) {
|
||||||
class="btn-dark btn-xl-large btn-lg-large mx-3 mt-3 my-md-5 my-lg-5 my-xl-5 box-shadow"
|
.mdx-hero {
|
||||||
>
|
align-items: stretch;
|
||||||
Get Started
|
display: flex;
|
||||||
</button>
|
}
|
||||||
<button
|
.mdx-hero__content {
|
||||||
type="button"
|
margin-top: 3.5rem;
|
||||||
title="{{ page.next_page.title | e }}"
|
max-width: 38rem;
|
||||||
onclick="window.open('https://join.slack.com/t/binbashar/shared_invite/zt-fw1692b6-9k4ADsWJ47lKacszphXM1w', '_blank')"
|
padding-bottom: 14vw;
|
||||||
class="btn-warning btn-xl-large btn-lg-large mx-3 mt-3 my-md-5 my-lg-5 my-xl-5 box-shadow"
|
}
|
||||||
>
|
.mdx-hero__image {
|
||||||
Join Us on Slack
|
order: 1;
|
||||||
</button>
|
transform: translateX(4rem);
|
||||||
</div>
|
width: 38rem;
|
||||||
</div>
|
}
|
||||||
<div class="ctx-header-img d-lg">
|
}
|
||||||
<img src="assets/images/logos/binbash-landing-header.svg" class="laverage-header-img mx-lg-5" />
|
@media screen and (min-width: 76.25em) {
|
||||||
</div>
|
.mdx-hero__image {
|
||||||
</div>
|
transform: translateX(8rem);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mdx-hero .md-button {
|
||||||
|
color: var(--hb-hero-color);
|
||||||
|
border-color: var(--hb-hero-color);
|
||||||
|
}
|
||||||
|
[data-md-color-scheme="slate"] .mdx-hero .md-button--primary {
|
||||||
|
color: var(--md-primary-fg-color);
|
||||||
|
}
|
||||||
|
.mdx-hero .md-button--primary {
|
||||||
|
color: var(--md-primary-fg-color);
|
||||||
|
background-color: var(--hb-hero-color);
|
||||||
|
border-color: transparent;
|
||||||
|
margin-right: 0.5rem;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
</section>
|
.md-main .md-button--primary {
|
||||||
|
color: var(--md-primary-fg-color);
|
||||||
|
background-color: var(--hb-hero-color);
|
||||||
|
border-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
<section class="second-gradiant-body w-100">
|
nav[class="md-tabs"] {
|
||||||
<!--We ship it. You own it-->
|
border-bottom: none;
|
||||||
<div class="md-grid conteiner-row pt-4 my-4">
|
}
|
||||||
<div class="card-white py-3 mx-xs-3 mx-sm-3 mx-4 mx-xl-0 ">
|
</style>
|
||||||
<div class="conteiner-row">
|
|
||||||
<div class="conteiner ctx-card-white-1 pt-4">
|
|
||||||
<div class="d-sm text-align-center">
|
|
||||||
<p class="display-3 Telegraf-UltraBold text-dark mx-auto mt-4">We ship it.</p>
|
|
||||||
<p class="display-3 Telegraf-UltraBold text-pink mx-auto my-4">You own it.</p>
|
|
||||||
</div>
|
|
||||||
<div class="d-sm-none d-md-none d-lg-none d-xl-none text-align-center">
|
|
||||||
<p class="display-4 Telegraf-UltraBold text-dark mx-auto mt-4">We ship it.</p>
|
|
||||||
<p class="display-4 Telegraf-UltraBold text-pink mx-auto my-4">You own it.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="conteiner ctx-card-white-1 text-dark h3 d-lg-none d-xl-none my-xs-5 my-sm-5 my-md-5">
|
<section class="mdx-container">
|
||||||
<ul class="ul-home mx-xs-auto mx-sm-auto mx-md-auto my-xs-5 my-sm-5 my-md-5">
|
<div class="md-grid md-typeset">
|
||||||
<li>- Own your AWS infrastructure</li>
|
<div class="mdx-hero">
|
||||||
<li>- Implement, reuse and scale faster</li>
|
<div class="mdx-hero__content">
|
||||||
<li>- Bootstrap your AWS Landing Zone</li>
|
<h1>Stephan Hadan<div id="typewriter">Systemadministrator</div></h1>
|
||||||
<li>- Proven libraries and modules</li>
|
<h3>{{ config.site_description }}</h3>
|
||||||
<li>- Modern Terraform, Ansible, Helm, K8s Stack</li>
|
<a href="/about/" class="md-button md-button--primary">
|
||||||
<li>- Optimize your cloud costs by design</li>
|
Über mich
|
||||||
<li>- Secure your cloud assets and production workloads</li>
|
</a>
|
||||||
<li>- Achieve compliance in AWS</li>
|
<a href="/cv/" class="md-button" target="_blank">
|
||||||
</ul>
|
Lebenslauf
|
||||||
</div>
|
</a>
|
||||||
|
|
||||||
<button
|
|
||||||
onclick="window.open('https://github.com/binbashar', '_blank')"
|
|
||||||
title="{{ lang.t('source.link.title') }}"
|
|
||||||
type="button"
|
|
||||||
class="btn-white btn-xl-large btn-lg-large box-shadow mx-auto my-4"
|
|
||||||
>
|
|
||||||
Contribute on GitHub
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="conteiner ctx-card-white-1 text-dark h3 d-lg">
|
|
||||||
<ul>
|
|
||||||
<li>- Own your AWS infrastructure</li>
|
|
||||||
<li>- Implement, reuse and scale faster</li>
|
|
||||||
<li>- Bootstrap your AWS Landing Zone</li>
|
|
||||||
<li>- Proven libraries and modules</li>
|
|
||||||
<li>- Modern Terraform, Ansible, Helm, K8s Stack</li>
|
|
||||||
<li>- Optimize your cloud costs by design</li>
|
|
||||||
<li>- Secure your cloud assets and production workloads</li>
|
|
||||||
<li>- Achieve compliance in AWS</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</section>
|
||||||
|
|
||||||
<!--Whats is leverage-->
|
|
||||||
<div class="conteiner-row-lg conteiner-row-xl conteiner py-5 my-5">
|
|
||||||
<div class="conteiner" style="order:0; flex: 50%;">
|
|
||||||
<div class="conteiner ctx-what-is mx-auto">
|
|
||||||
<span class="display-3 text-dark Telegraf-UltraBold mt-4 text-align-center text-end-xl text-end-lg">What is Leverage?</span>
|
|
||||||
<div class="conteiner text-dark h3 text-align-start text-end-xl text-end-lg my-xs-5 my-sm-5 my-md-5">
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
Our focus is on creating reusable, high quality AWS Cloud Infrastructure code, through our core components:
|
|
||||||
</p>
|
|
||||||
<p class="my-3 t-b">
|
|
||||||
• Reference Architecture for AWS<br>
|
|
||||||
• Infrastructure as Code (IaC) Library<br>
|
|
||||||
• Leverage CLI<br>
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
Because all the code and modules are already built, we can get your project up and running on AWS <span class="t-b">up to 10x faster</span> than a consulting company.
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
On top of code that is thoroughly documented, tested, and has been proven in production at dozens of other project deployments <span class="t-b">our Engineering Support Team.</span>
|
|
||||||
</p>
|
|
||||||
<button
|
|
||||||
onclick="location.href='https://www.binbash.co/leverage'"
|
|
||||||
title="{{ page.next_page.title | e }}"
|
|
||||||
type="button"
|
|
||||||
class="btn-dark btn-xl-large btn-lg-large my-4 box-shadow ml-auto mx-xs-auto mx-sm-auto mx-md-auto"
|
|
||||||
>
|
|
||||||
Product Features
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="conteiner" style="order:1; flex: 50%; overflow:hidden;">
|
|
||||||
<img src="assets/images/illustrations/mock-mac-book-16.png" class="laverage-mac-img my-xs-5 my-sm-5 my-md-5" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--Why Leverage-->
|
|
||||||
<section class="third-dark-body w-100">
|
|
||||||
<div class="conteiner py-5 my-5">
|
|
||||||
<img src="assets/images/illustrations/why-leverage.svg" class="why-laverage-img" />
|
|
||||||
<img src="assets/images/illustrations/Ilustracion-Binbash.png" class="laverage-mac2-img" />
|
|
||||||
<div class="conteiner-row">
|
|
||||||
<div style="order:0; flex: 50%;">
|
|
||||||
<div class="conteiner ctx-card-white-1 text-white h3 my-5 d-xl-none d-lg-none mx-auto w-70">
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
You will get your entire Cloud Native Application Infra in a few weeks.
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
We've built every component based on the best recommended practices.
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" class="mx-2" width="20px" height="20px"/>
|
|
||||||
Implement, reuse and scale your production workloads faster.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div class="conteiner ctx-card-white-1 text-white h3 my-5 mx-auto w-70">
|
|
||||||
<btn
|
|
||||||
onclick="window.open('https://www.binbash.co/competition','_blank')"
|
|
||||||
title="{{ lang.t('source.link.title') }}"
|
|
||||||
type="button"
|
|
||||||
class="btn-rainbow btn-rainbow-custom btn-xl-large btn-lg-large mx-auto text-align-center cursor-pointer"
|
|
||||||
>
|
|
||||||
Leverage vs. Competition
|
|
||||||
</btn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div style="order:0; flex: 50%;" class="d-lg">
|
|
||||||
<div class="card-rainbow second-gradiant-body px-5 py-5" style="order:1; flex: 100%;">
|
|
||||||
<div class="conteiner ctx-card-white-1 text-dark h3">
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" width="20px" height="20px"/>
|
|
||||||
If you implement our <span class="t-b">Reference AWS Cloud Solutions Architecture</span> and the <span class="t-b">Infrastructure as Code (IaC) Library</span> via <span class="t-b">Leverage CLI</span>, you will get your entire Cloud Native Application Infra in a few weeks.
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" width="20px" height="20px"/>
|
|
||||||
We've built every component based on the best-recommended practices, mainly following the <span class="t-b">AWS Well-Architected Framework</span>, granting you ownership to implement, reuse and scale your production workloads faster.
|
|
||||||
</p>
|
|
||||||
<p class="my-3">
|
|
||||||
<img src="assets/images/icons/check-ok.svg" width="20px" height="20px"/>
|
|
||||||
Leverage will solve your entire infrastructure and grant you complete control of the source code, and of course, you'll be able to run it without us.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--Our tech stack-->
|
|
||||||
<section class="four-gray-body w-100">
|
|
||||||
<div class="md-grid conteiner pt-5 my-0 my-xl-4 my-lg-4">
|
|
||||||
<p class="display-3 text-dark Telegraf-UltraBold mt-4 text-align-center text-start-xl text-start-lg">Our tech stack</p>
|
|
||||||
<img src="assets/images/logos/stack-tecnology.svg" class="mx-auto my-5" width="80%"/>
|
|
||||||
<div class="conteiner conteiner-row-lg conteiner-row-xl my-4">
|
|
||||||
<div class="text-dark h3 mx-4 my-3 mx-lg-0 my-xl-0 mx-lg-0 my-xl-0" style="order:0; flex: 50%;">
|
|
||||||
<p>Opinionated reference <span class="t-b">AWS solutions</span> composable architecture, based on the <span class="t-b">AWS Well-Architected Framework</span>. With over ten years of experience, Infra as code and best practices.</p>
|
|
||||||
</div>
|
|
||||||
<div class="text-dark h3 mx-4 my-3 mx-lg-0 my-xl-0 mx-lg-0 my-xl-0" style="order:0; flex: 50%;">
|
|
||||||
<p>Leverage facilitates a collection of reusable, tested, production-ready E2E IaC solutions. They are leveraged by modules written in <span class="t-b">Terraform, Ansible, Dockerfiles, Helm Charts</span> and <span class="t-b">Python</span>.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="conteiner conteiner-row-lg conteiner-row-xl my-4">
|
|
||||||
<div class="text-dark h3 mx-4 my-3 mx-lg-0 my-xl-0 mx-lg-0 my-xl-0" style="order:0; flex: 50%;">
|
|
||||||
<p>Automated deployment workflow via <span class="t-b">Leverage CLI.</span></p>
|
|
||||||
</div>
|
|
||||||
<div style="order:0; flex: 50%;">
|
|
||||||
<button
|
|
||||||
onclick="location.href='./concepts/our-tech-stack/'"
|
|
||||||
title="{{ page.next_page.title | e }}"
|
|
||||||
type="button"
|
|
||||||
class="btn-dark btn-xl-large btn-lg-large my-4 box-shadow mx-auto"
|
|
||||||
>
|
|
||||||
Why our tech stack???
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- <img src="/assets/images/diagrams/AWS-ORGANIZATION.png" class="mx-auto mt-5 mb-3 d-sm" width="100%"/>-->
|
|
||||||
<img src="assets/images/diagrams/ref-architecture-aws.png" class="mx-auto mt-5 mb-3 d-sm" width="100%"/>
|
|
||||||
<img src="assets/images/diagrams/diagrama-organization-binbash.png" class="mx-auto mt-5 d-sm-none d-md-none d-lg-none d-xl-none" width="100%"/>
|
|
||||||
<div class="conteiner-row my-0 my-xl-4 my-lg-4 stack-tenology-gradient">
|
|
||||||
<img src="assets/images/logos/stack-tecnologico-2.svg" class="mx-auto py-3" width="60%"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!--Footer-->
|
|
||||||
<footer class="bg-dark w-100">
|
|
||||||
<div class="md-grid conteiner-row-xl conteiner-row-lg conteiner pt-5 my-4">
|
|
||||||
<div class="conteiner-row" style="flex:50%">
|
|
||||||
<div class="text-white d-flex" style="flex: 40%;">
|
|
||||||
<img src="assets/images/logos/logo-binbash.png" class="mx-auto" width="30%"/>
|
|
||||||
</div>
|
|
||||||
<div class="text-white h3" style="flex: 30%;">
|
|
||||||
<div class="conteiner text-white h3">
|
|
||||||
<ul>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/" target="_blank">Home</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/" target="_blank">Solutions</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/leverage" target="_blank">Leverage</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://medium.com/binbash-inc" target="_blank">Blog</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/contact" target="_blank">Contact</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="text-white h3" style="flex: 30%;">
|
|
||||||
<div class="conteiner text-white h3">
|
|
||||||
<ul>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://github.com/sponsors/binbashar" target="_blank">About Us</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/team" target="_blank">Team</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://github.com/binbashar" target="_blank">Resources</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/" target="_blank">Testimonials</a>
|
|
||||||
</li>
|
|
||||||
<li class="cursor-pointer item-text-footer">
|
|
||||||
<a href="https://www.binbash.co/pricing" target="_blank">Pricing</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="conteiner-row mt-5 my-xl-0 mX-lg-0" style="flex:50%">
|
|
||||||
<div class="text-white text-end h3" style="flex: 15%;">
|
|
||||||
<span>Follow us on: </span>
|
|
||||||
</div>
|
|
||||||
<div class="text-white h3" style="flex: 55%;">
|
|
||||||
<a href="https://join.slack.com/t/binbashar/shared_invite/zt-fw1692b6-9k4ADsWJ47lKacszphXM1w" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/slack.svg"
|
|
||||||
title="Slack"
|
|
||||||
class="mx-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://www.linkedin.com/company/binbash" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/linkedIn.svg"
|
|
||||||
title="linkedIn"
|
|
||||||
class="mr-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://github.com/binbashar" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/github.svg"
|
|
||||||
title="Github"
|
|
||||||
class="mr-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://twitter.com/binbash_devops" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/twitter.svg"
|
|
||||||
title="Twitter"
|
|
||||||
class="mr-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://www.instagram.com/binbash_devops/" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/instagram.svg"
|
|
||||||
title="Instagram"
|
|
||||||
class="mr-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
<a href="https://medium.com/binbash-inc" target="_blank">
|
|
||||||
<img
|
|
||||||
src="assets/images/logos/socialmedia/medium.svg"
|
|
||||||
title="Medium"
|
|
||||||
class="mr-3 cursor-pointer item-social-media"
|
|
||||||
width="9%"
|
|
||||||
/>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
File diff suppressed because it is too large
Load diff
|
|
@ -1,55 +0,0 @@
|
||||||
{% extends "base.html" %}
|
|
||||||
|
|
||||||
<!-- Custom front matter -->
|
|
||||||
{% block extrahead %}
|
|
||||||
|
|
||||||
<!-- Determine title -->
|
|
||||||
{% set title = config.site_name %}
|
|
||||||
{% if page and page.title and not page.is_homepage %}
|
|
||||||
{% set title = config.site_name ~ " - " ~ page.title | striptags %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
<!-- The image needs to have an absolute URL -->
|
|
||||||
{% set image = config.site_url ~ 'assets/images/illustrations/banner.png' %}
|
|
||||||
|
|
||||||
<!-- Open graph meta tags -->
|
|
||||||
<meta property="og:type" content="website" />
|
|
||||||
<meta property="og:title" content="{{ title }}" />
|
|
||||||
<meta property="og:description" content="{{ config.site_description }}" />
|
|
||||||
<meta property="og:url" content="{{ page.canonical_url }}" />
|
|
||||||
<meta property="og:image" content="{{ image }}" />
|
|
||||||
<meta property="og:image:type" content="image/png" />
|
|
||||||
<meta property="og:image:width" content="1080" />
|
|
||||||
<meta property="og:image:height" content="568" />
|
|
||||||
|
|
||||||
<!-- google-site-verification meta-tag -->
|
|
||||||
<meta name="google-site-verification" content="-Rj8YMCn9uu5IwOFdC-WfAzXp4ZOMJtYKxU40ZgcJIU" />
|
|
||||||
|
|
||||||
<!-- Extra stylesheets -->
|
|
||||||
<!-- <link
|
|
||||||
rel="stylesheet"
|
|
||||||
href="{{ 'assets/stylesheets/overrides.css' | url }}"
|
|
||||||
/>-->
|
|
||||||
{% endblock %}
|
|
||||||
|
|
||||||
<!-- Announcement bar -->
|
|
||||||
{% block announce %}
|
|
||||||
<!-- Extra stylesing -->
|
|
||||||
<style>
|
|
||||||
.md-announce a,
|
|
||||||
.md-announce a:focus,
|
|
||||||
.md-announce a:hover{color:currentColor}.md-announce
|
|
||||||
strong{white-space:nowrap}.md-announce
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<a href="https://www.linkedin.com/company/binbash">
|
|
||||||
<p style="color: #D5EE1C">For updates follow <strong style="color: #D5EE1C">@binbash</strong> on
|
|
||||||
<span class="twemoji linkedin" style="color: #0e76a8">
|
|
||||||
{% include ".icons/fontawesome/brands/linkedin-in.svg" %}
|
|
||||||
</span>
|
|
||||||
<strong style="color: white">LinkedIn</strong>
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
|
|
||||||
{% endblock %}
|
|
||||||
|
|
@ -1,6 +1,5 @@
|
||||||
{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
|
<!--{% block announce %}
|
||||||
{% block announce %}
|
|
||||||
Für Updates folge bitte <strong>@stiebke</strong> auf
|
Für Updates folge bitte <strong>@stiebke</strong> auf
|
||||||
<a rel="me" href="https://freiburg.social/@squidfunk">
|
<a rel="me" href="https://freiburg.social/@squidfunk">
|
||||||
<span class="twemoji mastodon">
|
<span class="twemoji mastodon">
|
||||||
|
|
@ -15,4 +14,4 @@
|
||||||
</span>
|
</span>
|
||||||
<strong>Bluesky</strong>
|
<strong>Bluesky</strong>
|
||||||
</a>
|
</a>
|
||||||
{% endblock %}
|
{% endblock %}-->
|
||||||
Loading…
Add table
Add a link
Reference in a new issue