------------------------------------------------------------
commit 485d25db7e2e1bc9df9d8f6c095397a19ff05794
Author: root <root@hub.scroll.pub> Date: Sat Nov 9 14:28:18 2024 +0000 Deleted index.scroll diff --git a/index.scroll b/index.scroll deleted file mode 100644 index b26d9b5..0000000 --- a/index.scroll +++ /dev/null @@ -1,504 +0,0 @@ -<!DOCTYPE html> -<html class="dark:bg-gray-900"> - <head> - <title>Niklas Babel | Home</title> -<meta name="description" content="Niklas Babel is a trampolinist, ramped up his marketing and tech skills. He is a scrum master, a head of digital and technical advisor to the CEO of Berlin Cuisine and now burning boats as chief of staff." /> - <meta name="viewport" content="width=device-width,initial-scale=1"> - <meta name="csrf-param" content="authenticity_token" /> -<meta name="csrf-token" content="FA7NyeQa1yHMjDGOGKNSc_ZamsTWfcygRa1z4yf1yVg_74NKI1Wdak3uDfRNaZKwXhVZbsBK_srR6V5qYxaucA" /> - - - <!-- Preconnect to external domains --> - <link rel="preconnect" href="https://cdn.jsdelivr.net"> - <link rel="preconnect" href="https://cdnjs.cloudflare.com"> - <link rel="preconnect" href="https://fonts.googleapis.com"> - <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> - <link href="https://fonts.googleapis.com/css2?family=Gloria+Hallelujah&display=swap" rel="stylesheet"> - - <!-- Favicon and manifest --> - <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"> - <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> - <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> - <link rel="manifest" href="/site.webmanifest"> - <meta name="msapplication-TileColor" content="#da532c"> - <meta name="theme-color" content="#ffffff"> - - <!-- tailwind components --> - <link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.1/dist/full.min.css" rel="stylesheet" type="text/css" /> - <link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.5/flowbite.min.css" rel="stylesheet" /> - - <!-- app styles --> - <link rel="stylesheet" href="/assets/tailwind-89ea1f4366c08ab4f4fc4a29699e0d81f332a490ae11162497a8b297401638fe.css" data-turbo-track="reload" /> - <link rel="stylesheet" href="/assets/application-733425ced672ed3b55d69c7c882f9c86b2fad8da11c91ea7b086c75f97be1c05.css" data-turbo-track="reload" /> - - <script type="importmap" data-turbo-track="reload">{ - "imports": { - "application": "/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js", - "@hotwired/turbo-rails": "/assets/turbo.min-f3765a09513ca1417099ce92257ef54b9d4cf3a7addc7dcbb1d6d848d307ee8a.js", - "@hotwired/stimulus": "/assets/stimulus.min-dd364f16ec9504dfb72672295637a1c8838773b01c0b441bd41008124c407894.js", - "@hotwired/stimulus-loading": "/assets/stimulus-loading-3576ce92b149ad5d6959438c6f291e2426c86df3b874c525b30faad51b0d96b3.js", - "@rails/actioncable": "/assets/actioncable.esm-b66d83871f0a453b10ba8b4c147c2bafa655caaa5d13fa34e9bf361c1c2aedb7.js", - "chartkick": "/assets/chartkick-8eb76e6cbdb540d495739fce84049fd038e59e7fd55c9e08e47b0b5a74b62db4.js", - "Chart.bundle": "/assets/Chart.bundle-f8cbd12f96f40621d748f50e7c4b03245673e70081388fcc60ff79094413d16c.js", - "flowbite": "https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.turbo.min.js", - "actiontext": "/assets/actiontext-78de0ebeae470799f9ec25fd0e20ae2d931df88c2ff9315918d1054a2fca2596.js", - "trix": "/assets/trix-686ab55c2aea8035a7f728b61ec7afedfe857f70d6279ab453da775b7469e9e8.js", - "@rails/activestorage": "/assets/activestorage.esm-b3f7f0a5ef90530b509c5e681c4b3ef5d5046851e5b70d57fdb45e32b039c883.js", - "@rails/actiontext": "/assets/actiontext.esm-328ef022563f73c1b9b45ace742bd21330da0f6bd6c1c96d352d52fc8b8857e5.js", - "@activeadmin/activeadmin": "https://ga.jspm.io/npm:@activeadmin/activeadmin@4.0.0-beta5/dist/active_admin.js", - "@popperjs/core": "https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js", - "@rails/ujs": "https://ga.jspm.io/npm:@rails/ujs@7.1.2/app/assets/javascripts/rails-ujs.esm.js", - "controllers/application": "/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js", - "controllers/clipboard_controller": "/assets/controllers/clipboard_controller-5375627f6aac94714e34f41891d2552d457c0eb7e1545fb3f83475ddb72ce7b1.js", - "controllers/header_controller": "/assets/controllers/header_controller-cdd60f06016bf52646c3d32775068485ebfe20b4eb9eb54472389536c80d1272.js", - "controllers/hello_controller": "/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js", - "controllers": "/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js", - "controllers/service_catalogs_controller": "/assets/controllers/service_catalogs_controller-c6dd291010e27181ca6521419b2fc153e7a346ca0ff7e6e3b2be7fc1f9a2c78a.js", - "controllers/video_tooltip_controller": "/assets/controllers/video_tooltip_controller-4cc0b43705cc80e2bae282dbdac86ed5589d524f77a3e68fb1904343717a5bb5.js", - "channels/consumer": "/assets/channels/consumer-e499b626f1d691b5bdf7d83ff61cee46531b74e527aa0c2b78a229dc34d465ab.js", - "channels": "/assets/channels/index-04024382391bb910584145d8113cf35ef376b55d125bb4516cebeb14ce788597.js" - } -}</script> -<link rel="modulepreload" href="/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js"> -<link rel="modulepreload" href="/assets/turbo.min-f3765a09513ca1417099ce92257ef54b9d4cf3a7addc7dcbb1d6d848d307ee8a.js"> -<link rel="modulepreload" href="/assets/stimulus.min-dd364f16ec9504dfb72672295637a1c8838773b01c0b441bd41008124c407894.js"> -<link rel="modulepreload" href="/assets/stimulus-loading-3576ce92b149ad5d6959438c6f291e2426c86df3b874c525b30faad51b0d96b3.js"> -<link rel="modulepreload" href="/assets/actioncable.esm-b66d83871f0a453b10ba8b4c147c2bafa655caaa5d13fa34e9bf361c1c2aedb7.js"> -<link rel="modulepreload" href="/assets/chartkick-8eb76e6cbdb540d495739fce84049fd038e59e7fd55c9e08e47b0b5a74b62db4.js"> -<link rel="modulepreload" href="/assets/Chart.bundle-f8cbd12f96f40621d748f50e7c4b03245673e70081388fcc60ff79094413d16c.js"> -<link rel="modulepreload" href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.turbo.min.js"> -<link rel="modulepreload" href="/assets/actiontext-78de0ebeae470799f9ec25fd0e20ae2d931df88c2ff9315918d1054a2fca2596.js"> -<link rel="modulepreload" href="/assets/trix-686ab55c2aea8035a7f728b61ec7afedfe857f70d6279ab453da775b7469e9e8.js"> -<link rel="modulepreload" href="/assets/activestorage.esm-b3f7f0a5ef90530b509c5e681c4b3ef5d5046851e5b70d57fdb45e32b039c883.js"> -<link rel="modulepreload" href="/assets/actiontext.esm-328ef022563f73c1b9b45ace742bd21330da0f6bd6c1c96d352d52fc8b8857e5.js"> -<link rel="modulepreload" href="https://ga.jspm.io/npm:@activeadmin/activeadmin@4.0.0-beta5/dist/active_admin.js"> -<link rel="modulepreload" href="https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js"> -<link rel="modulepreload" href="https://ga.jspm.io/npm:@rails/ujs@7.1.2/app/assets/javascripts/rails-ujs.esm.js"> -<link rel="modulepreload" href="/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js"> -<link rel="modulepreload" href="/assets/controllers/clipboard_controller-5375627f6aac94714e34f41891d2552d457c0eb7e1545fb3f83475ddb72ce7b1.js"> -<link rel="modulepreload" href="/assets/controllers/header_controller-cdd60f06016bf52646c3d32775068485ebfe20b4eb9eb54472389536c80d1272.js"> -<link rel="modulepreload" href="/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js"> -<link rel="modulepreload" href="/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js"> -<link rel="modulepreload" href="/assets/controllers/service_catalogs_controller-c6dd291010e27181ca6521419b2fc153e7a346ca0ff7e6e3b2be7fc1f9a2c78a.js"> -<link rel="modulepreload" href="/assets/controllers/video_tooltip_controller-4cc0b43705cc80e2bae282dbdac86ed5589d524f77a3e68fb1904343717a5bb5.js"> -<link rel="modulepreload" href="/assets/channels/consumer-e499b626f1d691b5bdf7d83ff61cee46531b74e527aa0c2b78a229dc34d465ab.js"> -<link rel="modulepreload" href="/assets/channels/index-04024382391bb910584145d8113cf35ef376b55d125bb4516cebeb14ce788597.js"> -<script type="module">import "application"</script> - - <!-- Tag: Simple Analytics --> - <script async defer src="https://scripts.simpleanalyticscdn.com/latest.js"></script> -<noscript><img src="https://queue.simpleanalyticscdn.com/noscript.gif" alt="" referrerpolicy="no-referrer-when-downgrade" /></noscript> - <!-- Tag: PostHog --> - <script> - !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init push capture register register_once register_for_session unregister unregister_for_session getFeatureFlag getFeatureFlagPayload isFeatureEnabled reloadFeatureFlags updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures on onFeatureFlags onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep identify setPersonProperties group resetGroups setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags reset get_distinct_id getGroups get_session_id get_session_replay_url alias set_config startSessionRecording stopSessionRecording sessionRecordingStarted loadToolbar get_property getSessionProperty createPersonProfile opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing clear_opt_in_out_capturing debug".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]); - posthog.init('phc_8Lo4nZ5h8texFVLDMAbXQXBcqZQkTcU1Uylwh4uSRhT',{api_host:'https://eu.i.posthog.com', person_profiles: 'identified_only' // or 'always' to create profiles for anonymous users as well - }) -</script> - - <meta name="turbo-cache-control" content="no-cache"> - <script src="/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js" data-turbo-track="reload" defer="defer" type="module"></script> - - - </head> - - <body class="dark:bg-gray-900 dark:text-white"> - <main class="container mx-auto mt-14 px-6"> - - - <header class="py-4 px-2 bg-white dark:bg-gray-900" data-controller="header"> - <nav class="flex items-center justify-between flex-wrap"> - <div class="flex items-center flex-no-shrink text-white mr-6"> - - <a class="flex items-center hover:opacity-80" href="/"> - <span class="pl-6 font-semibold text-xl tracking-tight text-primary-600 dark:text-primary-400">Niklas Babel</span> - <!-- - <ul class="font-sm flex flex-row space-x-4 text-neutral-600 ml-4 dark:text-neutral-300 hidden md:flex"> - <li> - <a class="flex items-center transition-all hover:text-neutral-800 dark:hover:text-neutral-100" rel="noopener noreferrer" target="_blank" href="https://x.com/niklasbabel/"> - <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path></svg> - <p class="ml-2">follow me</p> - </a> - </li> - <li> - <a class="flex items-center transition-all hover:text-neutral-800 dark:hover:text-neutral-100" rel="noopener noreferrer" target="_blank" href="https://niklasbabel.com/"> - <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path></svg> - <p class="ml-2">get email updates</p> - </a> - </li> - </ul> - --> -</a> </div> - <div class="block sm:hidden mb-4"> - <button class="navbar-burger flex items-center px-3 py-2 border rounded text-black dark:text-white border-black dark:border-white hover:text-gray-500 dark:hover:text-gray-300 hover:border-gray-500 dark:hover:border-gray-300" data-action="click->header#toggleMobileNav"> - <svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> - <title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/> - </svg> - </button> - </div> - - <div id="main-nav" class="w-full flex-grow sm:flex text-right sm:w-auto hidden" data-header-target="mainNav"> - <div class="text-sm sm:flex-grow"> - - -<!-- - - - - - - - ---> - <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/blog">Blog</a> - <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/photos">Photos</a> --> - <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/bucket_list_items">Bucket List</a> - - <span class="text-gray-300 dark:text-gray-600 pl-4">|</span> - <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/service_catalogs">Services</a> --> - <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/login">Login</a> --> - <!-- <a class="ml-8 whitespace-nowrap text-base font-medium inline-flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-primary-600 hover:bg-primary-700 dark:bg-primary-500 dark:hover:bg-primary-600" href="/signup">Signup</a> --> - </div> - </div> - </nav> -</header> - -<!-- smooth scroll nav links --> -<script type="text/javascript"> - document.querySelectorAll('a[href^="#"]').forEach(anchor => { - anchor.addEventListener('click', function (e) { - e.preventDefault(); - - document.querySelector(this.getAttribute('href')).scrollIntoView({ - behavior: 'smooth' - }); - }); - }); -</script> - - -<div class="relative bg-white dark:bg-gray-900 overflow-hidden" data-controller="video-tooltip"> - - <div class="relative pt-6 pb-16 sm:pb-20 lg:pb-28"> - <main class="container mx-auto mt-8 px-4 sm:mt-8 md:mt-8 lg:mt-8 xl:mt-8 sm:px-6"> - - <div class="lg:grid lg:grid-cols-12 lg:gap-8"> - <div class="sm:text-center md:max-w-2xl md:mx-auto lg:col-span-6 lg:text-left"> - <h1> - <span class="mt-1 block text-4xl tracking-tight font-extrabold sm:text-4xl xl:text-5xl"> - <span class="block text-gray-900 dark:text-white">hey, i'm Niklas <span class="wave">✌️</span></span> - </span> - </h1> - - <div class="mt-8 flex flex-col sm:flex-row justify-between text-sm"> - <p class="text-neutral-600 dark:text-neutral-400 mb-2 sm:mb-0"> - <span class="font-bold text-neutral-900 dark:text-neutral-100"> - Berlin, SAT 15:25:23 PM - </span> - </p> - </div> - <div class="mt-8 flex items-center space-x-2 text-sm"> - <p class="text-neutral-600 dark:text-neutral-400">Press</p> - <div class="flex items-center justify-center w-6 h-6 rounded border border-neutral-200 bg-neutral-50 dark:border-neutral-700 dark:bg-neutral-800"> - <span class="font-medium text-neutral-900 dark:text-neutral-100">C</span> - </div> - <p class="text-neutral-600 dark:text-neutral-400">to copy my email address</p> - </div> - - <!-- Toast Message Clipboard --> - <div data-controller="clipboard" data-clipboard-text-value="dm@niklasbabel.com"> - <div class="hidden fixed top-4 left-1/2 transform -translate-x-1/2 bg-green-500 text-white px-4 py-2 rounded-full shadow-lg flex items-center space-x-2 transition-all duration-300" data-clipboard-target="notification" style="opacity: 0; transform: translate(-50%, -10px);"> - <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> - <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> -</svg> <span class="text-sm font-medium">Email address copied!</span> -</div></div> <!-- End of Toast Message Clipboard --> - - <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> - From gymnast to tech enthusiast, I've worn many hats on my journey. - As a Scrum Master, I honed my project management skills before juggled even more hats for the CEO of a german catering company called Berlin Cuisine. - </p> - <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> - My passion lies in the intersection of business, marketing, and technology. I excel at managing projects of all scales, fostering business growth, and mentoring individuals. - </p> - - <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> - Some years ago I used to do <a href="https://www.youtube.com/watch?v=357wuTvFFN0" class="underline video-link" data-video-id="357wuTvFFN0" data-video-type="youtube" target="_blank" rel="noopener noreferrer">Trampolining</a> and competed at the national level. - I also did some <a href="https://vimeo.com/207008518" class="underline video-link" data-video-id="207008518" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Gymnastics</a>. - These days I do indoor-spinning and enjoy&nbsp;<a href="https://vimeo.com/109638308" class="underline video-link" data-video-id="109638308" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Diving</a> - and <a href="https://vimeo.com/248393339" class="underline video-link" data-video-id="248393339" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Skiing</a>. - </p> - - <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> - Now on my mission to become an entrepreneur and specializing in that. - </p> - - <!-- Image for mobile and tablet views --> - <div class="mt-8 lg:hidden"> - <img class="w-full rounded-lg" alt="Niklas Babel" src="/assets/niklasbabel-64fbe9d35dded4a1467ea91001e733244fff319633a47761a21b834b63205e85.jpg" /> - </div> - - <div class="group mt-8 relative"> - <div class="absolute -top-2 left-2"> - <div class="flex space-x-2 flex-none items-center justify-center leading-none transition-all font-semibold px-2 py-1 text-xs opacity-100 rounded text-gray-700 hover:text-gray-1000 bg-white border border-gray-400 border-opacity-30 dark:border-gray-700 dark:hover:border-gray-600 dark:bg-white dark:bg-opacity-10 dark:text-gray-200 dark:hover:text-white hover:border-opacity-50"> - <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> - <circle cx="12" cy="12" r="2"></circle> - <path d="M16.24 7.76a6 6 0 0 1 0 8.49m-8.48-.01a6 6 0 0 1 0-8.49m11.31-2.82a10 10 0 0 1 0 14.14m-14.14 0a10 10 0 0 1 0-14.14"></path> - </svg> - <span>Latest blog post</span> - </div> - </div> - <a class="flex w-full items-center justify-between rounded border border-neutral-200 bg-neutral-50 px-3 py-4 dark:border-neutral-700 dark:bg-neutral-800" href="/blog/culture-eats-executives"> - <div class="flex flex-col"> - <p class="font-medium text-neutral-900 dark:text-neutral-100">Culture eats Executives for Breakfast</p> - </div> - <div class="transform text-neutral-700 transition-transform duration-300 group-hover:-rotate-12 dark:text-neutral-300"> - <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> - <path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path> - </svg> - </div> -</a> </div> - - <div class="group mt-8"> - <a class="flex w-full items-center justify-between rounded border border-neutral-200 bg-neutral-50 px-3 py-4 dark:border-neutral-700 dark:bg-neutral-800" href="/now"> - <div class="flex flex-col"> - <p class="font-medium text-neutral-900 dark:text-neutral-100">Now Now Now</p> - </div> - <div class="transform text-neutral-700 transition-transform duration-300 group-hover:-rotate-12 dark:text-neutral-300"> - <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> - <path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path> - </svg> - </div> -</a> </div> - - </div> - - <!-- Image for desktop view --> - <div class="mt-12 relative sm:max-w-lg sm:mx-auto lg:mt-0 lg:max-w-none lg:mx-0 lg:col-span-6 lg:flex lg:items-center"> - <div class="relative mx-auto w-full lg:max-w-md hidden lg:block"> - <img class="w-full rounded-lg" alt="Niklas Babel" src="/assets/niklasbabel-64fbe9d35dded4a1467ea91001e733244fff319633a47761a21b834b63205e85.jpg" /> - </div> - </div> - </div> - </main> - </div> -</div> - -<section class="polaroid-gallery"> - <div class="container mx-auto px-2 sm:px-4 py-4 sm:py-8"> - <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 sm:gap-6 max-w-3xl mx-auto"> - - <div class="polaroid-item transform" style="transform: rotate(-3deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Double Rainbow" srcset="/assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg 300w, /assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Double Rainbow</p> - </div> - </div> - <div class="polaroid-item transform" style="transform: rotate(2deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Snowstorm, 2020" srcset="/assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg 300w, /assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Snowstorm, 2020</p> - </div> - </div> - <div class="polaroid-item transform" style="transform: rotate(-1.5deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Spy Tower, 2021" srcset="/assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg 300w, /assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Spy Tower, 2021</p> - </div> - </div> - <div class="polaroid-item transform" style="transform: rotate(3.5deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Berlin, Drachenberg" srcset="/assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg 300w, /assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Berlin, Drachenberg</p> - </div> - </div> - <div class="polaroid-item transform" style="transform: rotate(-2.5deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Railroad, 2020" srcset="/assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg 300w, /assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Railroad, 2020</p> - </div> - </div> - <div class="polaroid-item transform" style="transform: rotate(2.5deg);"> - <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> - <div class="aspect-w-1 aspect-h-1 mb-2"> - <img class="object-cover w-full h-full" alt="Teufelsberg, 2020" srcset="/assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg 300w, /assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg" /> - </div> - <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Teufelsberg, 2020</p> - </div> - </div> - </div> - </div> -</section> - -<style> - .polaroid-gallery { - perspective: 1000px; - } - - .polaroid-item { - transition: transform 0.3s ease; - transform-style: preserve-3d; - perspective: 1000px; - } - - .polaroid-item:hover { - transform: rotate(0deg) scale(1.05) !important; - } - - .polaroid-content { - transform-style: preserve-3d; - backface-visibility: hidden; - transition: transform 0.3s ease; - } - - @media (max-width: 640px) { - .polaroid-gallery .grid { - grid-template-columns: 1fr !important; - } - - .polaroid-item { - width: 100% !important; - max-width: 300px; - margin: 0 auto 20px; - } - - .polaroid-content { - transform: rotate(0deg) !important; - } - } - - .font-handwriting { - font-family: "Gloria Hallelujah", cursive; - font-weight: 400; - font-style: normal; - } - - @keyframes spinAround { - from { - transform: rotate(0deg) translate(120px) scale(0.7); - } - to { - transform: rotate(360deg) translate(120px) scale(0.7); - } - } - - @keyframes rotate { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } - } -</style> - -<style> - .wave { - animation-name: wave-animation; - animation-duration: 5.5s; - animation-iteration-count: infinite; - transform-origin: 70% 70%; - display: inline-block; - } - - @keyframes wave-animation { - 0% { transform: rotate( 0.0deg); } - 10% { transform: rotate(14.0deg); } - 20% { transform: rotate(-8.0deg); } - 30% { transform: rotate(14.0deg); } - 40% { transform: rotate(-4.0deg); } - 50% { transform: rotate(10.0deg); } - 60% { transform: rotate( 0.0deg); } - } - - .video-tooltip { - position: absolute; - z-index: 1000; - background-color: white; - border: 1px solid #ccc; - border-radius: 4px; - padding: 10px; - box-shadow: 0 2px 5px rgba(0,0,0,0.2); - display: none; - } - - .video-tooltip iframe { - width: 300px; - height: 169px; - } -</style> - - <footer class="mt-20 mb-4 text-center text-sm text-gray-500 dark:text-gray-400"> - <div class="border-t border-gray-100 dark:border-gray-800"> - <div class="relative px-4 sm:px-8 lg:px-12 py-12"> - <div class="mx-auto max-w-2xl lg:max-w-5xl"> - <div class="lg:flex lg:items-center lg:justify-between lg:space-x-4"> - <div class="text-left lg:max-w-xl"> - <h3 class="flex items-center text-base font-medium text-gray-900 dark:text-gray-100"> - <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-6 w-6 flex-none text-gray-500 dark:text-gray-400"> - <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"></path> - </svg> - <span class="ml-3">Get my newsletter</span> - </h3> - <p class="mt-2 text-sm text-gray-600 dark:text-gray-400"> - A newsletter on my journey through tech, business, and personal growth. Subscribe for exclusive insights, project updates, and first access to upcoming content. - </p> - </div> - - <div class="mt-6 lg:mt-0 lg:flex-shrink-0"> - <iframe src="https://embeds.beehiiv.com/cbe9fefa-b8e7-4874-a677-7e89d66406dc?slim=true" data-test-id="beehiiv-embed" height="52" frameborder="0" scrolling="no" style="margin: 0; border-radius: 0px !important; background-color: transparent;"></iframe> - </div> - </div> - </div> - </div> - </div> - - <ul class="flex flex-row justify-center items-center space-x-4"> - <li> - <h4 class="text-xs font-semibold text-gray-1000 text-opacity-40 dark:text-white">Online</h4> - </li> - <li> - <a target="_blank" rel="noopener noreferrer" class="flex items-center justify-center space-x-3 rounded-md px-2 py-1.5 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-200 hover:text-gray-900 dark:hover:bg-gray-700 dark:hover:text-gray-200" href="https://x.com/niklasbabel/"> - <span class="flex items-center justify-center w-4"> - <svg viewBox="0 0 16 14" xmlns="http://www.w3.org/2000/svg" width="16" height="14" fill="currentColor"><path d="M14.3617 3.35401C14.3687 3.49999 14.3713 3.64777 14.3713 3.79376C14.3713 8.29039 11.0696 13.4737 5.03217 13.4737C3.17739 13.4737 1.45304 12.9105 0 11.9445C0.859457 12.0522 1.73097 11.9833 2.56473 11.7418C3.39849 11.5003 4.17814 11.0908 4.85913 10.5369C4.17428 10.5235 3.51059 10.2886 2.96085 9.86516C2.41112 9.44169 2.00282 8.85078 1.79304 8.17505C2.28527 8.27044 2.79186 8.25042 3.27565 8.11647C2.53271 7.96035 1.8647 7.54285 1.38482 6.9347C0.904951 6.32655 0.642734 5.56518 0.642609 4.77959V4.73724C1.09843 5.00001 1.60823 5.14614 2.12957 5.16347C1.4338 4.6828 0.941284 3.94507 0.752536 3.10088C0.563788 2.25669 0.693041 1.36968 1.11391 0.620882C1.93808 1.67201 2.96639 2.53173 4.13207 3.14418C5.29774 3.75663 6.5747 4.10813 7.88 4.17584C7.82353 3.92137 7.79523 3.66107 7.79565 3.39996C7.79565 2.9534 7.88054 2.51121 8.04548 2.09865C8.21041 1.68609 8.45215 1.31124 8.7569 0.995511C9.06165 0.679784 9.42344 0.429363 9.82159 0.258552C10.2197 0.0877414 10.6465 -0.00011384 11.0774 4.51813e-06C11.5265 -0.000754465 11.9709 0.0941183 12.3832 0.278738C12.7954 0.463357 13.1667 0.733786 13.4739 1.07325C14.2088 0.922489 14.9136 0.643368 15.5583 0.247815C15.3131 1.03559 14.8001 1.70424 14.1148 2.12937C14.7654 2.04944 15.4009 1.86901 16 1.5941C15.5599 2.27755 15.005 2.87363 14.3617 3.35401V3.35401Z"></path></svg> - </span> - <span class="flex-1">Twitter</span> - <span class="flex items-center justify-center w-4 text-black text-opacity-40 dark:text-white"><svg width="10" height="9" viewBox="0 0 10 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00195 6.32617V0.824219C9.00195 0.490234 8.79102 0.267578 8.45117 0.267578L2.94922 0.279297C2.62109 0.279297 2.41016 0.519531 2.41016 0.794922C2.41016 1.07031 2.65039 1.30469 2.92578 1.30469H4.66602L7.45508 1.19922L6.39453 2.13672L1.16211 7.38086C1.05664 7.48633 0.998047 7.61523 0.998047 7.73828C0.998047 8.01367 1.24414 8.27734 1.53125 8.27734C1.66602 8.27734 1.78906 8.22461 1.89453 8.11914L7.13281 2.875L8.07617 1.81445L7.96484 4.48047V6.34961C7.96484 6.61914 8.19922 6.86523 8.48633 6.86523C8.76172 6.86523 9.00195 6.63672 9.00195 6.32617Z" fill="currentColor"></path></svg></span> - </a> - </li> - <li> - <a target="_blank" rel="noopener noreferrer" class="flex items-center justify-center space-x-3 rounded-md px-2 py-1.5 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-200 hover:text-gray-900 dark:hover:bg-gray-700 dark:hover:text-gray-200" href="https://github.com/niklasbabel/"> - <span class="flex items-center justify-center w-4"> - <svg viewBox="0 0 17 16" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.06478 0C3.61133 0 0 3.6722 0 8.20248C0 11.8266 2.31081 14.9013 5.51518 15.9859C5.91823 16.0618 6.06622 15.808 6.06622 15.5913C6.06622 15.3957 6.05875 14.7496 6.05528 14.0642C3.81164 14.5604 3.3382 13.0963 3.3382 13.0963C2.97134 12.1483 2.44275 11.8961 2.44275 11.8961C1.71103 11.387 2.49791 11.3975 2.49791 11.3975C3.30775 11.4552 3.73417 12.2428 3.73417 12.2428C4.45347 13.4968 5.62083 13.1343 6.08103 12.9247C6.15342 12.3947 6.36245 12.0325 6.59305 11.8278C4.80178 11.6204 2.91872 10.9171 2.91872 7.77405C2.91872 6.87851 3.23377 6.14679 3.74966 5.57235C3.66593 5.36561 3.38987 4.53148 3.8278 3.40163C3.8278 3.40163 4.50501 3.18118 6.04619 4.24243C6.68951 4.0607 7.37942 3.96953 8.06478 3.96644C8.75018 3.96953 9.44062 4.0607 10.0851 4.24243C11.6244 3.18118 12.3007 3.40163 12.3007 3.40163C12.7397 4.53148 12.4635 5.36561 12.3798 5.57235C12.8969 6.14679 13.2098 6.87851 13.2098 7.77405C13.2098 10.9245 11.3231 11.6182 9.52728 11.8213C9.81657 12.0758 10.0743 12.575 10.0743 13.3403C10.0743 14.4377 10.065 15.321 10.065 15.5913C10.065 15.8096 10.2101 16.0653 10.6189 15.9848C13.8216 14.899 16.1294 11.8254 16.1294 8.20248C16.1294 3.6722 12.5187 0 8.06478 0Z"></path></svg> - </span> - <span class="flex-1">GitHub</span> - <span class="flex items-center justify-center w-4 text-black text-opacity-40 dark:text-white"><svg width="10" height="9" viewBox="0 0 10 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00195 6.32617V0.824219C9.00195 0.490234 8.79102 0.267578 8.45117 0.267578L2.94922 0.279297C2.62109 0.279297 2.41016 0.519531 2.41016 0.794922C2.41016 1.07031 2.65039 1.30469 2.92578 1.30469H4.66602L7.45508 1.19922L6.39453 2.13672L1.16211 7.38086C1.05664 7.48633 0.998047 7.61523 0.998047 7.73828C0.998047 8.01367 1.24414 8.27734 1.53125 8.27734C1.66602 8.27734 1.78906 8.22461 1.89453 8.11914L7.13281 2.875L8.07617 1.81445L7.96484 4.48047V6.34961C7.96484 6.61914 8.19922 6.86523 8.48633 6.86523C8.76172 6.86523 9.00195 6.63672 9.00195 6.32617Z" fill="currentColor"></path></svg></span> - </a> - </li> - </ul> - - <ul class="flex flex-row justify-center items-center space-x-2 mt-4 mb-2 text-xs text-gray-500 dark:text-gray-400"> - <li> - <a href="/privacy" class="hover:text-gray-700 dark:hover:text-gray-300">Privacy Policy</a> - </li> - <li>•</li> - <li> - <a href="/imprint" class="hover:text-gray-700 dark:hover:text-gray-300">Imprint</a> - </li> - </ul> -</footer> - </main> - - <script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8dfe78cb4c57db9b',t:'MTczMTE2MjMyMy4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script><script defer src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon='{"rayId":"8dfe78cb4c57db9b","version":"2024.10.4","r":1,"token":"f3df9f0f83e54b85b50941967ad8d241","serverTiming":{"name":{"cfExtPri":true,"cfL4":true,"cfSpeedBrain":true,"cfCacheStatus":true}}}' crossorigin="anonymous"></script> -</body> - -</html> ------------------------------------------------------------
commit 5bd0c0835f530b8518173ae83a687fc2fef5ff25
Author: ffff:94.134.88.222 <ffff:94.134.88.222@hub.scroll.pub> Date: Sat Nov 9 14:25:33 2024 +0000 Updated index.scroll diff --git a/index.scroll b/index.scroll index 6b06f2f..b26d9b5 100644 --- a/index.scroll +++ b/index.scroll @@ -1,5 +1,504 @@ -buildHtml +<!DOCTYPE html> +<html class="dark:bg-gray-900"> + <head> + <title>Niklas Babel | Home</title> +<meta name="description" content="Niklas Babel is a trampolinist, ramped up his marketing and tech skills. He is a scrum master, a head of digital and technical advisor to the CEO of Berlin Cuisine and now burning boats as chief of staff." /> + <meta name="viewport" content="width=device-width,initial-scale=1"> + <meta name="csrf-param" content="authenticity_token" /> +<meta name="csrf-token" content="FA7NyeQa1yHMjDGOGKNSc_ZamsTWfcygRa1z4yf1yVg_74NKI1Wdak3uDfRNaZKwXhVZbsBK_srR6V5qYxaucA" /> + -theme roboto + <!-- Preconnect to external domains --> + <link rel="preconnect" href="https://cdn.jsdelivr.net"> + <link rel="preconnect" href="https://cdnjs.cloudflare.com"> + <link rel="preconnect" href="https://fonts.googleapis.com"> + <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> + <link href="https://fonts.googleapis.com/css2?family=Gloria+Hallelujah&display=swap" rel="stylesheet"> -Hello World my name is + <!-- Favicon and manifest --> + <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"> + <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> + <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> + <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> + <link rel="manifest" href="/site.webmanifest"> + <meta name="msapplication-TileColor" content="#da532c"> + <meta name="theme-color" content="#ffffff"> + + <!-- tailwind components --> + <link href="https://cdn.jsdelivr.net/npm/daisyui@4.10.1/dist/full.min.css" rel="stylesheet" type="text/css" /> + <link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.5/flowbite.min.css" rel="stylesheet" /> + + <!-- app styles --> + <link rel="stylesheet" href="/assets/tailwind-89ea1f4366c08ab4f4fc4a29699e0d81f332a490ae11162497a8b297401638fe.css" data-turbo-track="reload" /> + <link rel="stylesheet" href="/assets/application-733425ced672ed3b55d69c7c882f9c86b2fad8da11c91ea7b086c75f97be1c05.css" data-turbo-track="reload" /> + + <script type="importmap" data-turbo-track="reload">{ + "imports": { + "application": "/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js", + "@hotwired/turbo-rails": "/assets/turbo.min-f3765a09513ca1417099ce92257ef54b9d4cf3a7addc7dcbb1d6d848d307ee8a.js", + "@hotwired/stimulus": "/assets/stimulus.min-dd364f16ec9504dfb72672295637a1c8838773b01c0b441bd41008124c407894.js", + "@hotwired/stimulus-loading": "/assets/stimulus-loading-3576ce92b149ad5d6959438c6f291e2426c86df3b874c525b30faad51b0d96b3.js", + "@rails/actioncable": "/assets/actioncable.esm-b66d83871f0a453b10ba8b4c147c2bafa655caaa5d13fa34e9bf361c1c2aedb7.js", + "chartkick": "/assets/chartkick-8eb76e6cbdb540d495739fce84049fd038e59e7fd55c9e08e47b0b5a74b62db4.js", + "Chart.bundle": "/assets/Chart.bundle-f8cbd12f96f40621d748f50e7c4b03245673e70081388fcc60ff79094413d16c.js", + "flowbite": "https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.turbo.min.js", + "actiontext": "/assets/actiontext-78de0ebeae470799f9ec25fd0e20ae2d931df88c2ff9315918d1054a2fca2596.js", + "trix": "/assets/trix-686ab55c2aea8035a7f728b61ec7afedfe857f70d6279ab453da775b7469e9e8.js", + "@rails/activestorage": "/assets/activestorage.esm-b3f7f0a5ef90530b509c5e681c4b3ef5d5046851e5b70d57fdb45e32b039c883.js", + "@rails/actiontext": "/assets/actiontext.esm-328ef022563f73c1b9b45ace742bd21330da0f6bd6c1c96d352d52fc8b8857e5.js", + "@activeadmin/activeadmin": "https://ga.jspm.io/npm:@activeadmin/activeadmin@4.0.0-beta5/dist/active_admin.js", + "@popperjs/core": "https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js", + "@rails/ujs": "https://ga.jspm.io/npm:@rails/ujs@7.1.2/app/assets/javascripts/rails-ujs.esm.js", + "controllers/application": "/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js", + "controllers/clipboard_controller": "/assets/controllers/clipboard_controller-5375627f6aac94714e34f41891d2552d457c0eb7e1545fb3f83475ddb72ce7b1.js", + "controllers/header_controller": "/assets/controllers/header_controller-cdd60f06016bf52646c3d32775068485ebfe20b4eb9eb54472389536c80d1272.js", + "controllers/hello_controller": "/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js", + "controllers": "/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js", + "controllers/service_catalogs_controller": "/assets/controllers/service_catalogs_controller-c6dd291010e27181ca6521419b2fc153e7a346ca0ff7e6e3b2be7fc1f9a2c78a.js", + "controllers/video_tooltip_controller": "/assets/controllers/video_tooltip_controller-4cc0b43705cc80e2bae282dbdac86ed5589d524f77a3e68fb1904343717a5bb5.js", + "channels/consumer": "/assets/channels/consumer-e499b626f1d691b5bdf7d83ff61cee46531b74e527aa0c2b78a229dc34d465ab.js", + "channels": "/assets/channels/index-04024382391bb910584145d8113cf35ef376b55d125bb4516cebeb14ce788597.js" + } +}</script> +<link rel="modulepreload" href="/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js"> +<link rel="modulepreload" href="/assets/turbo.min-f3765a09513ca1417099ce92257ef54b9d4cf3a7addc7dcbb1d6d848d307ee8a.js"> +<link rel="modulepreload" href="/assets/stimulus.min-dd364f16ec9504dfb72672295637a1c8838773b01c0b441bd41008124c407894.js"> +<link rel="modulepreload" href="/assets/stimulus-loading-3576ce92b149ad5d6959438c6f291e2426c86df3b874c525b30faad51b0d96b3.js"> +<link rel="modulepreload" href="/assets/actioncable.esm-b66d83871f0a453b10ba8b4c147c2bafa655caaa5d13fa34e9bf361c1c2aedb7.js"> +<link rel="modulepreload" href="/assets/chartkick-8eb76e6cbdb540d495739fce84049fd038e59e7fd55c9e08e47b0b5a74b62db4.js"> +<link rel="modulepreload" href="/assets/Chart.bundle-f8cbd12f96f40621d748f50e7c4b03245673e70081388fcc60ff79094413d16c.js"> +<link rel="modulepreload" href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.turbo.min.js"> +<link rel="modulepreload" href="/assets/actiontext-78de0ebeae470799f9ec25fd0e20ae2d931df88c2ff9315918d1054a2fca2596.js"> +<link rel="modulepreload" href="/assets/trix-686ab55c2aea8035a7f728b61ec7afedfe857f70d6279ab453da775b7469e9e8.js"> +<link rel="modulepreload" href="/assets/activestorage.esm-b3f7f0a5ef90530b509c5e681c4b3ef5d5046851e5b70d57fdb45e32b039c883.js"> +<link rel="modulepreload" href="/assets/actiontext.esm-328ef022563f73c1b9b45ace742bd21330da0f6bd6c1c96d352d52fc8b8857e5.js"> +<link rel="modulepreload" href="https://ga.jspm.io/npm:@activeadmin/activeadmin@4.0.0-beta5/dist/active_admin.js"> +<link rel="modulepreload" href="https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js"> +<link rel="modulepreload" href="https://ga.jspm.io/npm:@rails/ujs@7.1.2/app/assets/javascripts/rails-ujs.esm.js"> +<link rel="modulepreload" href="/assets/controllers/application-368d98631bccbf2349e0d4f8269afb3fe9625118341966de054759d96ea86c7e.js"> +<link rel="modulepreload" href="/assets/controllers/clipboard_controller-5375627f6aac94714e34f41891d2552d457c0eb7e1545fb3f83475ddb72ce7b1.js"> +<link rel="modulepreload" href="/assets/controllers/header_controller-cdd60f06016bf52646c3d32775068485ebfe20b4eb9eb54472389536c80d1272.js"> +<link rel="modulepreload" href="/assets/controllers/hello_controller-549135e8e7c683a538c3d6d517339ba470fcfb79d62f738a0a089ba41851a554.js"> +<link rel="modulepreload" href="/assets/controllers/index-2db729dddcc5b979110e98de4b6720f83f91a123172e87281d5a58410fc43806.js"> +<link rel="modulepreload" href="/assets/controllers/service_catalogs_controller-c6dd291010e27181ca6521419b2fc153e7a346ca0ff7e6e3b2be7fc1f9a2c78a.js"> +<link rel="modulepreload" href="/assets/controllers/video_tooltip_controller-4cc0b43705cc80e2bae282dbdac86ed5589d524f77a3e68fb1904343717a5bb5.js"> +<link rel="modulepreload" href="/assets/channels/consumer-e499b626f1d691b5bdf7d83ff61cee46531b74e527aa0c2b78a229dc34d465ab.js"> +<link rel="modulepreload" href="/assets/channels/index-04024382391bb910584145d8113cf35ef376b55d125bb4516cebeb14ce788597.js"> +<script type="module">import "application"</script> + + <!-- Tag: Simple Analytics --> + <script async defer src="https://scripts.simpleanalyticscdn.com/latest.js"></script> +<noscript><img src="https://queue.simpleanalyticscdn.com/noscript.gif" alt="" referrerpolicy="no-referrer-when-downgrade" /></noscript> + <!-- Tag: PostHog --> + <script> + !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init push capture register register_once register_for_session unregister unregister_for_session getFeatureFlag getFeatureFlagPayload isFeatureEnabled reloadFeatureFlags updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures on onFeatureFlags onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep identify setPersonProperties group resetGroups setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags reset get_distinct_id getGroups get_session_id get_session_replay_url alias set_config startSessionRecording stopSessionRecording sessionRecordingStarted loadToolbar get_property getSessionProperty createPersonProfile opt_in_capturing opt_out_capturing has_opted_in_capturing has_opted_out_capturing clear_opt_in_out_capturing debug".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]); + posthog.init('phc_8Lo4nZ5h8texFVLDMAbXQXBcqZQkTcU1Uylwh4uSRhT',{api_host:'https://eu.i.posthog.com', person_profiles: 'identified_only' // or 'always' to create profiles for anonymous users as well + }) +</script> + + <meta name="turbo-cache-control" content="no-cache"> + <script src="/assets/application-5490942a91890b45fa25c654610b3a405dfafb6b72bec93738788a72ac29d167.js" data-turbo-track="reload" defer="defer" type="module"></script> + + + </head> + + <body class="dark:bg-gray-900 dark:text-white"> + <main class="container mx-auto mt-14 px-6"> + + + <header class="py-4 px-2 bg-white dark:bg-gray-900" data-controller="header"> + <nav class="flex items-center justify-between flex-wrap"> + <div class="flex items-center flex-no-shrink text-white mr-6"> + + <a class="flex items-center hover:opacity-80" href="/"> + <span class="pl-6 font-semibold text-xl tracking-tight text-primary-600 dark:text-primary-400">Niklas Babel</span> + <!-- + <ul class="font-sm flex flex-row space-x-4 text-neutral-600 ml-4 dark:text-neutral-300 hidden md:flex"> + <li> + <a class="flex items-center transition-all hover:text-neutral-800 dark:hover:text-neutral-100" rel="noopener noreferrer" target="_blank" href="https://x.com/niklasbabel/"> + <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path></svg> + <p class="ml-2">follow me</p> + </a> + </li> + <li> + <a class="flex items-center transition-all hover:text-neutral-800 dark:hover:text-neutral-100" rel="noopener noreferrer" target="_blank" href="https://niklasbabel.com/"> + <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path></svg> + <p class="ml-2">get email updates</p> + </a> + </li> + </ul> + --> +</a> </div> + <div class="block sm:hidden mb-4"> + <button class="navbar-burger flex items-center px-3 py-2 border rounded text-black dark:text-white border-black dark:border-white hover:text-gray-500 dark:hover:text-gray-300 hover:border-gray-500 dark:hover:border-gray-300" data-action="click->header#toggleMobileNav"> + <svg class="fill-current h-3 w-3" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> + <title>Menu</title><path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/> + </svg> + </button> + </div> + + <div id="main-nav" class="w-full flex-grow sm:flex text-right sm:w-auto hidden" data-header-target="mainNav"> + <div class="text-sm sm:flex-grow"> + + +<!-- + + + + + + + +--> + <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/blog">Blog</a> + <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/photos">Photos</a> --> + <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/bucket_list_items">Bucket List</a> + + <span class="text-gray-300 dark:text-gray-600 pl-4">|</span> + <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/service_catalogs">Services</a> --> + <!-- <a class="ml-8 whitespace-nowrap text-base font-medium text-gray-500 hover:text-gray-900 dark:text-gray-400 dark:hover:text-white" href="/login">Login</a> --> + <!-- <a class="ml-8 whitespace-nowrap text-base font-medium inline-flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-primary-600 hover:bg-primary-700 dark:bg-primary-500 dark:hover:bg-primary-600" href="/signup">Signup</a> --> + </div> + </div> + </nav> +</header> + +<!-- smooth scroll nav links --> +<script type="text/javascript"> + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + + document.querySelector(this.getAttribute('href')).scrollIntoView({ + behavior: 'smooth' + }); + }); + }); +</script> + + +<div class="relative bg-white dark:bg-gray-900 overflow-hidden" data-controller="video-tooltip"> + + <div class="relative pt-6 pb-16 sm:pb-20 lg:pb-28"> + <main class="container mx-auto mt-8 px-4 sm:mt-8 md:mt-8 lg:mt-8 xl:mt-8 sm:px-6"> + + <div class="lg:grid lg:grid-cols-12 lg:gap-8"> + <div class="sm:text-center md:max-w-2xl md:mx-auto lg:col-span-6 lg:text-left"> + <h1> + <span class="mt-1 block text-4xl tracking-tight font-extrabold sm:text-4xl xl:text-5xl"> + <span class="block text-gray-900 dark:text-white">hey, i'm Niklas <span class="wave">✌️</span></span> + </span> + </h1> + + <div class="mt-8 flex flex-col sm:flex-row justify-between text-sm"> + <p class="text-neutral-600 dark:text-neutral-400 mb-2 sm:mb-0"> + <span class="font-bold text-neutral-900 dark:text-neutral-100"> + Berlin, SAT 15:25:23 PM + </span> + </p> + </div> + <div class="mt-8 flex items-center space-x-2 text-sm"> + <p class="text-neutral-600 dark:text-neutral-400">Press</p> + <div class="flex items-center justify-center w-6 h-6 rounded border border-neutral-200 bg-neutral-50 dark:border-neutral-700 dark:bg-neutral-800"> + <span class="font-medium text-neutral-900 dark:text-neutral-100">C</span> + </div> + <p class="text-neutral-600 dark:text-neutral-400">to copy my email address</p> + </div> + + <!-- Toast Message Clipboard --> + <div data-controller="clipboard" data-clipboard-text-value="dm@niklasbabel.com"> + <div class="hidden fixed top-4 left-1/2 transform -translate-x-1/2 bg-green-500 text-white px-4 py-2 rounded-full shadow-lg flex items-center space-x-2 transition-all duration-300" data-clipboard-target="notification" style="opacity: 0; transform: translate(-50%, -10px);"> + <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> + <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path> +</svg> <span class="text-sm font-medium">Email address copied!</span> +</div></div> <!-- End of Toast Message Clipboard --> + + <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> + From gymnast to tech enthusiast, I've worn many hats on my journey. + As a Scrum Master, I honed my project management skills before juggled even more hats for the CEO of a german catering company called Berlin Cuisine. + </p> + <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> + My passion lies in the intersection of business, marketing, and technology. I excel at managing projects of all scales, fostering business growth, and mentoring individuals. + </p> + + <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> + Some years ago I used to do <a href="https://www.youtube.com/watch?v=357wuTvFFN0" class="underline video-link" data-video-id="357wuTvFFN0" data-video-type="youtube" target="_blank" rel="noopener noreferrer">Trampolining</a> and competed at the national level. + I also did some <a href="https://vimeo.com/207008518" class="underline video-link" data-video-id="207008518" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Gymnastics</a>. + These days I do indoor-spinning and enjoy&nbsp;<a href="https://vimeo.com/109638308" class="underline video-link" data-video-id="109638308" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Diving</a> + and <a href="https://vimeo.com/248393339" class="underline video-link" data-video-id="248393339" data-video-type="vimeo" target="_blank" rel="noopener noreferrer">Skiing</a>. + </p> + + <p class="mt-3 text-base text-gray-500 dark:text-gray-400 sm:mt-5 sm:text-xl lg:text-lg xl:text-xl"> + Now on my mission to become an entrepreneur and specializing in that. + </p> + + <!-- Image for mobile and tablet views --> + <div class="mt-8 lg:hidden"> + <img class="w-full rounded-lg" alt="Niklas Babel" src="/assets/niklasbabel-64fbe9d35dded4a1467ea91001e733244fff319633a47761a21b834b63205e85.jpg" /> + </div> + + <div class="group mt-8 relative"> + <div class="absolute -top-2 left-2"> + <div class="flex space-x-2 flex-none items-center justify-center leading-none transition-all font-semibold px-2 py-1 text-xs opacity-100 rounded text-gray-700 hover:text-gray-1000 bg-white border border-gray-400 border-opacity-30 dark:border-gray-700 dark:hover:border-gray-600 dark:bg-white dark:bg-opacity-10 dark:text-gray-200 dark:hover:text-white hover:border-opacity-50"> + <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> + <circle cx="12" cy="12" r="2"></circle> + <path d="M16.24 7.76a6 6 0 0 1 0 8.49m-8.48-.01a6 6 0 0 1 0-8.49m11.31-2.82a10 10 0 0 1 0 14.14m-14.14 0a10 10 0 0 1 0-14.14"></path> + </svg> + <span>Latest blog post</span> + </div> + </div> + <a class="flex w-full items-center justify-between rounded border border-neutral-200 bg-neutral-50 px-3 py-4 dark:border-neutral-700 dark:bg-neutral-800" href="/blog/culture-eats-executives"> + <div class="flex flex-col"> + <p class="font-medium text-neutral-900 dark:text-neutral-100">Culture eats Executives for Breakfast</p> + </div> + <div class="transform text-neutral-700 transition-transform duration-300 group-hover:-rotate-12 dark:text-neutral-300"> + <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path> + </svg> + </div> +</a> </div> + + <div class="group mt-8"> + <a class="flex w-full items-center justify-between rounded border border-neutral-200 bg-neutral-50 px-3 py-4 dark:border-neutral-700 dark:bg-neutral-800" href="/now"> + <div class="flex flex-col"> + <p class="font-medium text-neutral-900 dark:text-neutral-100">Now Now Now</p> + </div> + <div class="transform text-neutral-700 transition-transform duration-300 group-hover:-rotate-12 dark:text-neutral-300"> + <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M2.07102 11.3494L0.963068 10.2415L9.2017 1.98864H2.83807L2.85227 0.454545H11.8438V9.46023H10.2955L10.3097 3.09659L2.07102 11.3494Z" fill="currentColor"></path> + </svg> + </div> +</a> </div> + + </div> + + <!-- Image for desktop view --> + <div class="mt-12 relative sm:max-w-lg sm:mx-auto lg:mt-0 lg:max-w-none lg:mx-0 lg:col-span-6 lg:flex lg:items-center"> + <div class="relative mx-auto w-full lg:max-w-md hidden lg:block"> + <img class="w-full rounded-lg" alt="Niklas Babel" src="/assets/niklasbabel-64fbe9d35dded4a1467ea91001e733244fff319633a47761a21b834b63205e85.jpg" /> + </div> + </div> + </div> + </main> + </div> +</div> + +<section class="polaroid-gallery"> + <div class="container mx-auto px-2 sm:px-4 py-4 sm:py-8"> + <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4 sm:gap-6 max-w-3xl mx-auto"> + + <div class="polaroid-item transform" style="transform: rotate(-3deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Double Rainbow" srcset="/assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg 300w, /assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-berlin-double-rainbow-4636327463e3e8568c832244d0ba66686779349fd488f9e9b3a928d2f1f322f7.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Double Rainbow</p> + </div> + </div> + <div class="polaroid-item transform" style="transform: rotate(2deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Snowstorm, 2020" srcset="/assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg 300w, /assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-niklas-babel-snowstorm-2020-96835039159328e3c3913417a8432281ee1b02147c78cac320803e8e59bc9f48.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Snowstorm, 2020</p> + </div> + </div> + <div class="polaroid-item transform" style="transform: rotate(-1.5deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Spy Tower, 2021" srcset="/assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg 300w, /assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunday-spy-tower-sunday-2021-f522752fae03d35dd031aaaf00035e32184ef31995e19153c78887f5f537f163.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Spy Tower, 2021</p> + </div> + </div> + <div class="polaroid-item transform" style="transform: rotate(3.5deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Berlin, Drachenberg" srcset="/assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg 300w, /assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunset-drachenberg-berlin-5e0978e2208b95a9117b4fac8345b2d49ec083c845526ad52123773e0d41f082.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Berlin, Drachenberg</p> + </div> + </div> + <div class="polaroid-item transform" style="transform: rotate(-2.5deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Railroad, 2020" srcset="/assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg 300w, /assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-sunset-railroad-berlin-2020-925684d108207160675272081b332687b1d9c173ea6e265cfff01432bfd32ef9.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Railroad, 2020</p> + </div> + </div> + <div class="polaroid-item transform" style="transform: rotate(2.5deg);"> + <div class="polaroid-content bg-white p-3 shadow-md hover:shadow-xl"> + <div class="aspect-w-1 aspect-h-1 mb-2"> + <img class="object-cover w-full h-full" alt="Teufelsberg, 2020" srcset="/assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg 300w, /assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg 600w" sizes="(max-width: 640px) 300px, 600px" src="/assets/image-teufelsberg-aerial-perspective-2020-643e74ae145f67b5dc3056a06bdc2a9079da3feefb1ad4cfef5d76810c206301.jpg" /> + </div> + <p class="text-center text-gray-700 font-handwriting text-lg mt-2 gloria-hallelujah-regular">Teufelsberg, 2020</p> + </div> + </div> + </div> + </div> +</section> + +<style> + .polaroid-gallery { + perspective: 1000px; + } + + .polaroid-item { + transition: transform 0.3s ease; + transform-style: preserve-3d; + perspective: 1000px; + } + + .polaroid-item:hover { + transform: rotate(0deg) scale(1.05) !important; + } + + .polaroid-content { + transform-style: preserve-3d; + backface-visibility: hidden; + transition: transform 0.3s ease; + } + + @media (max-width: 640px) { + .polaroid-gallery .grid { + grid-template-columns: 1fr !important; + } + + .polaroid-item { + width: 100% !important; + max-width: 300px; + margin: 0 auto 20px; + } + + .polaroid-content { + transform: rotate(0deg) !important; + } + } + + .font-handwriting { + font-family: "Gloria Hallelujah", cursive; + font-weight: 400; + font-style: normal; + } + + @keyframes spinAround { + from { + transform: rotate(0deg) translate(120px) scale(0.7); + } + to { + transform: rotate(360deg) translate(120px) scale(0.7); + } + } + + @keyframes rotate { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } + } +</style> + +<style> + .wave { + animation-name: wave-animation; + animation-duration: 5.5s; + animation-iteration-count: infinite; + transform-origin: 70% 70%; + display: inline-block; + } + + @keyframes wave-animation { + 0% { transform: rotate( 0.0deg); } + 10% { transform: rotate(14.0deg); } + 20% { transform: rotate(-8.0deg); } + 30% { transform: rotate(14.0deg); } + 40% { transform: rotate(-4.0deg); } + 50% { transform: rotate(10.0deg); } + 60% { transform: rotate( 0.0deg); } + } + + .video-tooltip { + position: absolute; + z-index: 1000; + background-color: white; + border: 1px solid #ccc; + border-radius: 4px; + padding: 10px; + box-shadow: 0 2px 5px rgba(0,0,0,0.2); + display: none; + } + + .video-tooltip iframe { + width: 300px; + height: 169px; + } +</style> + + <footer class="mt-20 mb-4 text-center text-sm text-gray-500 dark:text-gray-400"> + <div class="border-t border-gray-100 dark:border-gray-800"> + <div class="relative px-4 sm:px-8 lg:px-12 py-12"> + <div class="mx-auto max-w-2xl lg:max-w-5xl"> + <div class="lg:flex lg:items-center lg:justify-between lg:space-x-4"> + <div class="text-left lg:max-w-xl"> + <h3 class="flex items-center text-base font-medium text-gray-900 dark:text-gray-100"> + <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="h-6 w-6 flex-none text-gray-500 dark:text-gray-400"> + <path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"></path> + </svg> + <span class="ml-3">Get my newsletter</span> + </h3> + <p class="mt-2 text-sm text-gray-600 dark:text-gray-400"> + A newsletter on my journey through tech, business, and personal growth. Subscribe for exclusive insights, project updates, and first access to upcoming content. + </p> + </div> + + <div class="mt-6 lg:mt-0 lg:flex-shrink-0"> + <iframe src="https://embeds.beehiiv.com/cbe9fefa-b8e7-4874-a677-7e89d66406dc?slim=true" data-test-id="beehiiv-embed" height="52" frameborder="0" scrolling="no" style="margin: 0; border-radius: 0px !important; background-color: transparent;"></iframe> + </div> + </div> + </div> + </div> + </div> + + <ul class="flex flex-row justify-center items-center space-x-4"> + <li> + <h4 class="text-xs font-semibold text-gray-1000 text-opacity-40 dark:text-white">Online</h4> + </li> + <li> + <a target="_blank" rel="noopener noreferrer" class="flex items-center justify-center space-x-3 rounded-md px-2 py-1.5 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-200 hover:text-gray-900 dark:hover:bg-gray-700 dark:hover:text-gray-200" href="https://x.com/niklasbabel/"> + <span class="flex items-center justify-center w-4"> + <svg viewBox="0 0 16 14" xmlns="http://www.w3.org/2000/svg" width="16" height="14" fill="currentColor"><path d="M14.3617 3.35401C14.3687 3.49999 14.3713 3.64777 14.3713 3.79376C14.3713 8.29039 11.0696 13.4737 5.03217 13.4737C3.17739 13.4737 1.45304 12.9105 0 11.9445C0.859457 12.0522 1.73097 11.9833 2.56473 11.7418C3.39849 11.5003 4.17814 11.0908 4.85913 10.5369C4.17428 10.5235 3.51059 10.2886 2.96085 9.86516C2.41112 9.44169 2.00282 8.85078 1.79304 8.17505C2.28527 8.27044 2.79186 8.25042 3.27565 8.11647C2.53271 7.96035 1.8647 7.54285 1.38482 6.9347C0.904951 6.32655 0.642734 5.56518 0.642609 4.77959V4.73724C1.09843 5.00001 1.60823 5.14614 2.12957 5.16347C1.4338 4.6828 0.941284 3.94507 0.752536 3.10088C0.563788 2.25669 0.693041 1.36968 1.11391 0.620882C1.93808 1.67201 2.96639 2.53173 4.13207 3.14418C5.29774 3.75663 6.5747 4.10813 7.88 4.17584C7.82353 3.92137 7.79523 3.66107 7.79565 3.39996C7.79565 2.9534 7.88054 2.51121 8.04548 2.09865C8.21041 1.68609 8.45215 1.31124 8.7569 0.995511C9.06165 0.679784 9.42344 0.429363 9.82159 0.258552C10.2197 0.0877414 10.6465 -0.00011384 11.0774 4.51813e-06C11.5265 -0.000754465 11.9709 0.0941183 12.3832 0.278738C12.7954 0.463357 13.1667 0.733786 13.4739 1.07325C14.2088 0.922489 14.9136 0.643368 15.5583 0.247815C15.3131 1.03559 14.8001 1.70424 14.1148 2.12937C14.7654 2.04944 15.4009 1.86901 16 1.5941C15.5599 2.27755 15.005 2.87363 14.3617 3.35401V3.35401Z"></path></svg> + </span> + <span class="flex-1">Twitter</span> + <span class="flex items-center justify-center w-4 text-black text-opacity-40 dark:text-white"><svg width="10" height="9" viewBox="0 0 10 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00195 6.32617V0.824219C9.00195 0.490234 8.79102 0.267578 8.45117 0.267578L2.94922 0.279297C2.62109 0.279297 2.41016 0.519531 2.41016 0.794922C2.41016 1.07031 2.65039 1.30469 2.92578 1.30469H4.66602L7.45508 1.19922L6.39453 2.13672L1.16211 7.38086C1.05664 7.48633 0.998047 7.61523 0.998047 7.73828C0.998047 8.01367 1.24414 8.27734 1.53125 8.27734C1.66602 8.27734 1.78906 8.22461 1.89453 8.11914L7.13281 2.875L8.07617 1.81445L7.96484 4.48047V6.34961C7.96484 6.61914 8.19922 6.86523 8.48633 6.86523C8.76172 6.86523 9.00195 6.63672 9.00195 6.32617Z" fill="currentColor"></path></svg></span> + </a> + </li> + <li> + <a target="_blank" rel="noopener noreferrer" class="flex items-center justify-center space-x-3 rounded-md px-2 py-1.5 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-200 hover:text-gray-900 dark:hover:bg-gray-700 dark:hover:text-gray-200" href="https://github.com/niklasbabel/"> + <span class="flex items-center justify-center w-4"> + <svg viewBox="0 0 17 16" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.06478 0C3.61133 0 0 3.6722 0 8.20248C0 11.8266 2.31081 14.9013 5.51518 15.9859C5.91823 16.0618 6.06622 15.808 6.06622 15.5913C6.06622 15.3957 6.05875 14.7496 6.05528 14.0642C3.81164 14.5604 3.3382 13.0963 3.3382 13.0963C2.97134 12.1483 2.44275 11.8961 2.44275 11.8961C1.71103 11.387 2.49791 11.3975 2.49791 11.3975C3.30775 11.4552 3.73417 12.2428 3.73417 12.2428C4.45347 13.4968 5.62083 13.1343 6.08103 12.9247C6.15342 12.3947 6.36245 12.0325 6.59305 11.8278C4.80178 11.6204 2.91872 10.9171 2.91872 7.77405C2.91872 6.87851 3.23377 6.14679 3.74966 5.57235C3.66593 5.36561 3.38987 4.53148 3.8278 3.40163C3.8278 3.40163 4.50501 3.18118 6.04619 4.24243C6.68951 4.0607 7.37942 3.96953 8.06478 3.96644C8.75018 3.96953 9.44062 4.0607 10.0851 4.24243C11.6244 3.18118 12.3007 3.40163 12.3007 3.40163C12.7397 4.53148 12.4635 5.36561 12.3798 5.57235C12.8969 6.14679 13.2098 6.87851 13.2098 7.77405C13.2098 10.9245 11.3231 11.6182 9.52728 11.8213C9.81657 12.0758 10.0743 12.575 10.0743 13.3403C10.0743 14.4377 10.065 15.321 10.065 15.5913C10.065 15.8096 10.2101 16.0653 10.6189 15.9848C13.8216 14.899 16.1294 11.8254 16.1294 8.20248C16.1294 3.6722 12.5187 0 8.06478 0Z"></path></svg> + </span> + <span class="flex-1">GitHub</span> + <span class="flex items-center justify-center w-4 text-black text-opacity-40 dark:text-white"><svg width="10" height="9" viewBox="0 0 10 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.00195 6.32617V0.824219C9.00195 0.490234 8.79102 0.267578 8.45117 0.267578L2.94922 0.279297C2.62109 0.279297 2.41016 0.519531 2.41016 0.794922C2.41016 1.07031 2.65039 1.30469 2.92578 1.30469H4.66602L7.45508 1.19922L6.39453 2.13672L1.16211 7.38086C1.05664 7.48633 0.998047 7.61523 0.998047 7.73828C0.998047 8.01367 1.24414 8.27734 1.53125 8.27734C1.66602 8.27734 1.78906 8.22461 1.89453 8.11914L7.13281 2.875L8.07617 1.81445L7.96484 4.48047V6.34961C7.96484 6.61914 8.19922 6.86523 8.48633 6.86523C8.76172 6.86523 9.00195 6.63672 9.00195 6.32617Z" fill="currentColor"></path></svg></span> + </a> + </li> + </ul> + + <ul class="flex flex-row justify-center items-center space-x-2 mt-4 mb-2 text-xs text-gray-500 dark:text-gray-400"> + <li> + <a href="/privacy" class="hover:text-gray-700 dark:hover:text-gray-300">Privacy Policy</a> + </li> + <li>•</li> + <li> + <a href="/imprint" class="hover:text-gray-700 dark:hover:text-gray-300">Imprint</a> + </li> + </ul> +</footer> + </main> + + <script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8dfe78cb4c57db9b',t:'MTczMTE2MjMyMy4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script><script defer src="https://static.cloudflareinsights.com/beacon.min.js/vcd15cbe7772f49c399c6a5babf22c1241717689176015" integrity="sha512-ZpsOmlRQV6y907TI0dKBHq9Md29nnaEIPlkf84rnaERnq6zvWvPUqr2ft8M1aS28oN72PdrCzSjY4U6VaAw1EQ==" data-cf-beacon='{"rayId":"8dfe78cb4c57db9b","version":"2024.10.4","r":1,"token":"f3df9f0f83e54b85b50941967ad8d241","serverTiming":{"name":{"cfExtPri":true,"cfL4":true,"cfSpeedBrain":true,"cfCacheStatus":true}}}' crossorigin="anonymous"></script> +</body> + +</html> ------------------------------------------------------------
commit c1c0d6b080cf032eb9cf42683a6e849ad921e684
Author: root <root@hub.scroll.pub> Date: Fri Nov 8 15:28:56 2024 +0000 Deleted log.txt diff --git a/log.txt b/log.txt deleted file mode 100644 index e69de29..0000000 ------------------------------------------------------------
commit 73627d342930a46c4f746bef9888bd92a9991468
Author: ffff:72.253.209.30 <ffff:72.253.209.30@hub.scroll.pub> Date: Fri Nov 8 15:28:19 2024 +0000 Updated log.txt diff --git a/log.txt b/log.txt new file mode 100644 index 0000000..e69de29 ------------------------------------------------------------
commit 2454d24bbdba6a0946dafb4a6b314a4db4d75ef8
Author: ffff:72.253.209.30 <ffff:72.253.209.30@hub.scroll.pub> Date: Fri Nov 8 15:28:15 2024 +0000 Updated index.scroll diff --git a/index.scroll b/index.scroll index b6f1c67..6b06f2f 100644 --- a/index.scroll +++ b/index.scroll @@ -2,4 +2,4 @@ buildHtml theme roboto -Hello world my name is +Hello World my name is ------------------------------------------------------------
commit deb01d2519042d3550430dfab7b3b68cb68c09d7
Author: ffff:72.253.209.30 <ffff:72.253.209.30@hub.scroll.pub> Date: Fri Nov 8 15:28:08 2024 +0000 Updated index.scroll diff --git a/index.scroll b/index.scroll index 4442ed6..b6f1c67 100644 --- a/index.scroll +++ b/index.scroll @@ -1,4 +1,5 @@ buildHtml + theme roboto -Hello World my name is \ No newline at end of file +Hello world my name is ------------------------------------------------------------
commit f50b7aeda0866583530eb1f180a339ac8f7eeb2e
Author: ffff:72.253.209.30 <ffff:72.253.209.30@hub.scroll.pub> Date: Fri Nov 8 15:26:32 2024 +0000 Updated .gitignore diff --git a/.gitignore b/.gitignore index aa0ab78..afa85ad 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ +.DS_Store *.html *.txt *.xml ------------------------------------------------------------
commit 7118bff68b4b2ff80321ac3cd6979e27fb7f39f0
Author: root <root@hub.scroll.pub> Date: Fri Nov 8 15:26:04 2024 +0000 Deleted log.txt diff --git a/log.txt b/log.txt deleted file mode 100644 index e69de29..0000000 ------------------------------------------------------------
commit 0f6866c958d3e6d31f063f037f8fdf7a30502fcd
Author: ffff:66.75.90.209 <ffff:66.75.90.209@hub.scroll.pub> Date: Thu Nov 7 23:15:05 2024 +0000 Updated log.txt diff --git a/log.txt b/log.txt new file mode 100644 index 0000000..e69de29 ------------------------------------------------------------
commit bae9780b761ef03020de04944435f0db626158ce
Author: root <root@hub.scroll.pub> Date: Fri Oct 25 18:29:16 2024 +0000 initial blank_template template diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..aa0ab78 --- /dev/null +++ b/.gitignore @@ -0,0 +1,5 @@ +*.html +*.txt +*.xml +*.css +*.js \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..4442ed6 --- /dev/null +++ b/index.scroll @@ -0,0 +1,4 @@ +buildHtml +theme roboto + +Hello World my name is \ No newline at end of file