This commit is contained in:
Joey Kimsey
2025-01-23 20:42:16 -05:00
parent 48e385af94
commit 3fcc5aee52
17 changed files with 265 additions and 375 deletions

View File

@ -135,6 +135,5 @@ define( 'TP_DEFAULT_LOGO', 'images/logo.png');
define( 'DEFAULT_SESSION_PREFIX', 'TP_' );
// Token
define( 'DEFAULT_TOKEN_NAME', 'TP_SESSION_TOKEN' );
define( 'HOUDINI_SITENAME', 'Joey Kimsey' );
# Tell the app; all constants have been loaded
define( 'TEMPUS_PROJECT_CONSTANTS_LOADED', true );

View File

@ -0,0 +1,64 @@
<?php
/**
* app/controllers/hermes.php
*
* This is the hermes controller.
*
* @version 3.0
* @author Joey Kimsey <Joey@thetempusproject.com>
* @link https://TheTempusProject.com
* @license https://opensource.org/licenses/MIT [MIT LICENSE]
*/
namespace TheTempusProject\Controllers;
use TheTempusProject\Hermes\Functions\Redirect;
use TheTempusProject\Bedrock\Functions\Session;
use TheTempusProject\Bedrock\Functions\Check;
use TheTempusProject\Bedrock\Functions\Input;
use TheTempusProject\Hermes\Functions\Route as Routes;
use TheTempusProject\Houdini\Classes\Issues;
use TheTempusProject\Houdini\Classes\Views;
use TheTempusProject\Houdini\Classes\Components;
use TheTempusProject\Houdini\Classes\Template;
use TheTempusProject\Classes\Controller;
use TheTempusProject\Classes\Forms;
use TheTempusProject\TheTempusProject as App;
class Downloads extends Controller {
public function index() {
Session::flash( 'success', 'Unknown download.' );
return Redirect::to( 'home/index' );
}
public function resume( $extension = 'none' ) {
if ( ! in_array( $extension, ['docx','pdf','md','txt'] ) ) {
Session::flash( 'success', 'Unknown download.' );
return Redirect::to( 'home/index' );
}
$file = APP_ROOT_DIRECTORY . 'downloads' . DIRECTORY_SEPARATOR . 'JoeyKimsey-resume-2025.' . $extension;
// Check if the file exists
if (file_exists($file)) {
// Set headers to force the download
header('Content-Description: File Transfer');
header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename="' . basename($file) . '"');
header('Expires: 0');
header('Cache-Control: must-revalidate');
header('Pragma: public');
header('Content-Length: ' . filesize($file));
// Clear the output buffer
ob_clean();
flush();
// Read and output the file
readfile($file);
exit;
} else {
Session::flash( 'success', 'Unknown download.' );
return Redirect::to( 'home/index' );
}
}
}

View File

@ -29,22 +29,19 @@ class Home extends Controller {
self::$title = '{SITENAME}';
self::$pageDescription = 'This is the homepage of your new Tempus Project Installation. Thank you for installing. find more info at https://thetempusproject.com';
$optionValues = [
(object) [ "post" => "XXXXXXXX", "option" => "Full-Stack Developer" ],
(object) [ "post" => "XXXXXXXX", "option" => "DevOps Engineer" ],
(object) [ "post" => "XXXXXXXX", "option" => "Web Developer" ],
(object) [ "post" => "XXXXXXXX", "option" => "App Developer" ],
(object) [ "post" => "XXXXXXXX", "option" => "Senior PHP Developer" ],
(object) [ "post" => "XXXXXXXX", "option" => "Server/Waiter" ],
(object) [ "post" => "XXXXXXXX", "option" => "Cook" ],
(object) [ "post" => "XXXXXXXX", "option" => "Farm-Hand" ],
(object) [ "post" => "XXXXXXXX", "option" => "Dish-Boy" ],
(object) [ "post" => "XXXXXXXX", "option" => "Brother" ],
(object) [ "post" => "XXXXXXXX", "option" => "Son" ],
(object) [ "post" => "XXXXXXXX", "option" => "Friend" ],
(object) [ "post" => "XXXXXXXX", "option" => "Student" ],
(object) [ "post" => "XXXXXXXX", "option" => "Polymath" ],
(object) [ "post" => "XXXXXXXX", "option" => "Geek" ],
(object) [ "post" => "XXXXXXXX", "option" => "Nerd" ],
(object) [ "post" => "python-dev", "option" => "Python Developer" ],
(object) [ "post" => "ecommerce-coder", "option" => "eCommerce Coder" ],
(object) [ "post" => "php-experience", "option" => "PHP Developer" ],
(object) [ "post" => "ai-experience", "option" => "GPT-Agent" ],
(object) [ "post" => "operations-experience", "option" => "DevOps Engineer" ],
(object) [ "post" => "lua-dev", "option" => "Lua Developer" ],
(object) [ "post" => "version-control", "option" => "Git Goblin" ],
(object) [ "post" => "laravel-experience", "option" => "Laravel Developer" ],
(object) [ "post" => "database-experience", "option" => "Database Admin" ],
(object) [ "post" => "education", "option" => "Student" ],
(object) [ "post" => "full-stack-developer", "option" => "Full-Stack Developer" ],
(object) [ "post" => "stripe-certified-developer", "option" => "Stripe Certified Developer" ],
];
shuffle($optionValues);
Views::view( 'index', $optionValues );

View File

@ -1,3 +0,0 @@
<?php
// the idea is that this will be info pages for the plugin various/info
?>

View File

@ -42,9 +42,8 @@
<header class="p-3 text-bg-dark">
<div class="container">
<div class="d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start">
<img src="{ROOT_URL}{LOGO}" class="bi me-2" width="40" height="32" role="img" aria-label="{SITENAME} Logo">
<a href="/" class="d-flex align-items-center mb-2 mb-lg-0 text-white text-decoration-none">
{SITENAME}
<img src="{ROOT_URL}{LOGO}" class="rounded" height="48" alt="{SITENAME} Logo" aria-label="{SITENAME} Logo">
</a>
{topNavLeft}
<div class="text-end d-flex align-items-center">

View File

@ -1,9 +1,13 @@
<div class="offset-4 col--4 text-center mt-3" role="group" aria-label="Resume Downloads">
<div class="btn-group text-center" role="group" aria-label="Resume Downloads">
<h3 class="px-3">Download</h3>
<a href="/downloads/JoeyKimsey-resume.docx" class="btn btn-primary" role="button">Word</a>
<a href="/downloads/JoeyKimsey-resume.pdf" class="btn btn-primary" role="button">PDF</a>
<a href="/downloads/JoeyKimsey-resume.md" class="btn btn-primary" role="button">Markdown</a>
<a href="/downloads/JoeyKimsey-resume.txt" class="btn btn-primary" role="button">Text</a>
<div class="my-3 row" role="group" aria-label="Resume Downloads">
<!-- Adjusted the col-3 div -->
<div class="col-3 d-flex align-items-center justify-content-end">
<h3>Download</h3>
</div>
<!-- Button group -->
<div class="btn-group btn-group-justified col-6" role="group" aria-label="Resume Downloads">
<a href="/downloads/resume/docx" class="btn btn-primary" role="button" target="_blank" download>Word</a>
<a href="/downloads/resume/pdf" class="btn btn-primary" role="button" target="_blank" download>PDF</a>
<a href="/downloads/resume/md" class="btn btn-primary" role="button" target="_blank" download>Markdown</a>
<a href="/downloads/resume/txt" class="btn btn-primary" role="button" target="_blank" download>Text</a>
</div>
</div>

View File

@ -1,10 +1,10 @@
<div class="mb-3 row" role="group" aria-label="Resume View Type">
<div class="btn-group btn-group-justified mb-3 col-6 offset-3" role="group" aria-label="Resume View Type">
<div class="btn-group btn-group-justified col-6 offset-3" role="group" aria-label="Resume View Type">
<a href="?view=tiimeline" class="btn btn-primary" role="button">Timeline</a>
<a href="?" class="btn btn-primary" role="button">Standard</a>
</div>
<div class="form-check form-switch mb-3 col-3 d-flex align-items-center">
<div class="form-check form-switch col-3 d-flex align-items-center">
<input class="form-check-input" type="checkbox" role="switch" name="hidebs" id="hidebs" value="true">
<label class="form-check-label ps-2" for="hidebs">Hide the BS</label>
<label class="form-check-label ps-2" for="hidebs">Hide the Fluff</label>
</div>
</div>

View File

@ -1,12 +1,9 @@
<div class="container context-main-bg p-3 my-4">
<!-- Hero Section -->
<div class="text-center py-5 rounded context-third-bg">
<h1 class="fw-bold">Let's Build Something Amazing Together</h1>
<p class="lead text-muted">Im a full-stack developer specializing in backend development. Whether you're looking for freelance support, a long-term contractor, or a full-time developer, Im here to help!</p>
<button class="btn btn-primary btn-lg mt-3">Get in Touch</button>
<p class="lead text-muted">I'm a full-stack developer specializing in backend development. Whether you're looking for freelance support, a long-term contractor, or a full-time developer, I'm here to help!</p>
<a href="#hire-me" class="btn btn-primary btn-lg mt-3">Get in Touch</a>
</div>
<!-- Work Preferences -->
@ -31,16 +28,16 @@
<div class="mt-5 ps-3">
<h2>Pricing</h2>
<p class="text-muted">
My standard rate is <strong>$75/hour</strong> with a two-hour minimum. For larger or repeat projects, Im open to flexible arrangements. Lets discuss your project to find a solution that works for both of us.
My standard rate is <strong>$75/hour</strong> with a two-hour minimum. For larger or repeat projects, I'm open to flexible arrangements. Let's discuss your project to find a solution that works for both of us.
</p>
</div>
<!-- Contact Form -->
<div class="mt-5 ps-3">
<h2>Contact Me</h2>
<p class="text-muted">To respect privacy, I dont share personal contact details publicly. Please fill out the form below or connect with me on LinkedIn. I typically respond within 24 hours.</p>
<p class="text-muted">To respect privacy, I don't share personal contact details publicly. Please fill out the form below or connect with me on LinkedIn. I typically respond within 24 hours.</p>
<form action="" method="post" class="row g-3">
<form action="" method="post" class="row g-3" id="hire-me">
<div class="col-md-6">
<label for="name" class="form-label">Name</label>
<input type="text" class="form-control" id="name" name="name" placeholder="Your Full Name">

View File

@ -2,10 +2,8 @@
<div class="p-4 mb-4 rounded-3 context-main context-main-bg">
<div class="container text-center">
<div class="jumbotron text-center pb-5">
<h1 class="display-5 fw-bold">Joey Kimsey</h1>
<p class="fs-4">
I tried to put something clever here, but when I didn't understand it later I changed it to:<br>
There are too many stories to tell here but explore a few below.
There are too many stories to tell them all on one site. Feel free to explore a few of those stories below.
</p>
<div class="col-4 offset-4 mb-3">
<select class="form-control dropdown-big" id="postSelector">
@ -29,25 +27,9 @@
available on this site. If anything here peaks your interest, or you just want to talk more about a project, feel free to contact me here and I should respond relatively quickly.
</p>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon text-dark" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon text-dark" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
<div class="card context-main context-main-bg col-8 offset-2 mb-5">
<div class="row g-0 px-3">
<div class="col-md-4">
@ -104,7 +86,7 @@
<p class="card-text">
One of the downfalls I have as a developer is failing to save my failures. (trust me, its less philosophical than it sounds) Many times when I finish projects, or call it quits, the code is
either resigned to its life in production where I would prefer it not to be publicly available, or It goes to the big backup disk in the sky. When you factor in my immense respect
for lawyers and the whimsically worded writs they have me sign; I am left with limited examples to share. Fortunately II have some long running project examples which are available for download and review.
for lawyers and the whimsically worded writs they have me sign; I am left with limited examples to share. Fortunately I have some long running project examples which are available for download and review.
</p>
</div>
</div>

View File

@ -1,52 +0,0 @@
<div class="col-sm-6 col-md-4 col-sm-offset-3 col-md-offset-4">
<div class="card">
<!-- Default panel contents -->
<div class="card-header">Material Design Switch Demos</div>
<!-- List group -->
<ul class="list-group">
<li class="list-group-item">
Bootstrap Switch Default
<div class="material-switch float-right">
<input id="someSwitchOptionDefault" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionDefault" class="label-default"></label>
</div>
</li>
<li class="list-group-item">
Bootstrap Switch Primary
<div class="material-switch float-right">
<input id="someSwitchOptionPrimary" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionPrimary" class="label-primary"></label>
</div>
</li>
<li class="list-group-item">
Bootstrap Switch Success
<div class="material-switch float-right">
<input id="someSwitchOptionSuccess" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionSuccess" class="label-success"></label>
</div>
</li>
<li class="list-group-item">
Bootstrap Switch Info
<div class="material-switch float-right">
<input id="someSwitchOptionInfo" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionInfo" class="label-info"></label>
</div>
</li>
<li class="list-group-item">
Bootstrap Switch Warning
<div class="material-switch float-right">
<input id="someSwitchOptionWarning" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionWarning" class="label-warning"></label>
</div>
</li>
<li class="list-group-item">
Bootstrap Switch Danger
<div class="material-switch float-right">
<input id="someSwitchOptionDanger" name="someSwitchOption001" type="checkbox"/>
<label for="someSwitchOptionDanger" class="label-danger"></label>
</div>
</li>
</ul>
</div>
</div>

View File

@ -1,159 +0,0 @@
<div class="row">
<div class="col-lg-12">
<div class="container text-center">
<div class="jumbotron text-center">
<h1>Joey Kimsey</h1>
<p>I tried to put something clever here, but when I didn't understand it later I changed it to:<br>
There are too many stories to tell here but explore a few below.</p>
<select class="form-control dropdown-big" style="width: auto; display: inline-block; margin-bottom: 20px;">
{LOOP}
<option>{option}</option>
{/LOOP}
</select>
<p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
</div>
<p>Thanks for taking the time to learn more about me! Forgive the implied redundancy, but my name is Joey Kimsey, and I professionally describe myself as a web developer. On this site you will find a few
brief writings on my career and personal life as well as links to various projects and other services. At this time I don't find much value in the social media platforms. While I do have them, they serve
more as a reservation in my name than an active party.</p>
<p>I would love to change the landscape of social media, but alas, I feel we need to give up "free" for "fees" lest we become the product.</p>
<p>I live on inbox-zero, and for anyone willing to suffer my google assistant on the first call, I'm always available by phone. With that said, I do not make my personal email or phone number publicly
available on this site. If anything here peaks your interest, or you just want to talk more about a project, feel free to contact me here and I should respond relatively quickly.</p>
</div>
</div>
</div>
<div class="media">
<div class="media-left">
<div id="carousel-career" class="carousel slide" data-ride="carousel" style="width: 150px; height: 150px;">
<ol class="carousel-indicators">
<li data-target="#carousel-career" data-slide-to="0" class="active"></li>
<li data-target="#carousel-career" data-slide-to="1"></li>
<li data-target="#carousel-career" data-slide-to="2"></li>
<li data-target="#carousel-career" data-slide-to="3"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="/images/ba.png" alt="First slide">
</div>
<div class="item">
<img src="/images/ione.png" alt="Second">
</div>
<div class="item">
<img src="/images/emeals.png" alt="eMeals">
</div>
<div class="item">
<img src="/images/springbot.png" alt="Springbot">
</div>
</div>
<a href="#carousel-career" class="left carousel-control" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a href="#carousel-career" class="right carousel-control" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
<div class="media-body media-middle">
<h4 class="media-heading">My Career</h4>
<p>From IPB to ChatGPT and everything in-between; I have worked with, and on, many platforms. What I would refer to as my "professional experience" spans 7 years but my experience
in this field spans another decade at least. Learn more when you view my Resume. It can be viewed, downloaded, and expounded upon via my blog. Feel free to explore and follow up with any questions.</p>
</div>
</div>
<div class="media">
<div class="media-body media-middle">
<h4 class="media-heading">My Products</h4>
<p>One of the downfalls I have as a developer is failing to save my failures. (trust me, its less philosophical than it sounds) Many times when I finish projects, or call it quits, the code is
either resigned to its life in production where I would prefer it not to be publicly available, or It goes to the big backup disk in the sky. When you factor in my immense respect
for lawyers and the whimsically worded writs they have me sign; I am left with limited examples to share. Fortunately II have some long running project examples which are available for download and review.</p>
</div>
<div class="media-right">
<div id="carousel-products" class="carousel slide" data-ride="carousel" style="width: 150px; height: 150px;">
<ol class="carousel-indicators">
<li data-target="#carousel-products" data-slide-to="0" class="active"></li>
<li data-target="#carousel-products" data-slide-to="1"></li>
<li data-target="#carousel-products" data-slide-to="2"></li>
<li data-target="#carousel-products" data-slide-to="3"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="/images/AAA_M_Additions.png" alt="First slide">
</div>
<div class="item">
<img src="/images/bedrock.jpg" alt="Second slide">
</div>
<div class="item">
<img src="/images/canary.jpg" alt="Third slide">
</div>
<div class="item">
<img src="/images/houdini.jpg" alt="Third slide">
</div>
</div>
<a href="#carousel-products" class="left carousel-control" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a href="#carousel-products" class="right carousel-control" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</div>
<div class="media">
<div class="media-left">
<div id="carousel-projects" class="carousel slide" data-ride="carousel" style="width: 150px; height: 150px;">
<ol class="carousel-indicators">
<li data-target="#carousel-projects" data-slide-to="0" class="active"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="/images/tte.png" alt="First slide">
</div>
</div>
</div>
</div>
<div class="media-body media-middle">
<h4 class="media-heading">My Projects</h4>
<p>At any given time I have at least a half dozen projects in various stages of completion. As most could attest; interests peak and
wain as moods and times change. Here you can find a brief overview of the various projects I am devoting some level of attention to.
Not guaranteed acuate, and not guaranteed complete, but you're here anyways, so take a peak behind the homepage </p>
</div>
</div>
<div class="media">
<div class="media-body media-middle">
<h4 class="media-heading">Contact Me</h4>
<p>While II do not make my phone number or email available, you can still reach out about anything using my contact form here.</p>
</div>
<div class="media-right">
<a href="/contact">
<img class="media-object" src="/images/vacation.jpg" alt="still-working" style="width: 150px; height: 150px;">
</a>
</div>
</div>

View File

@ -1,104 +0,0 @@
<div class="wp-webdeasy-comment-editor">
<div class="toolbar">
<div class="line">
<div class="box">
<span class="editor-btn icon smaller" data-action="bold" data-tag-name="b" title="Bold">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/bold.png"/>
</span>
<span class="editor-btn icon smaller" data-action="italic" data-tag-name="i" title="Italic">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/italic.png"/>
</span>
<span class="editor-btn icon smaller" data-action="underline" data-tag-name="u" title="Underline">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/underline.png"/>
</span>
<span class="editor-btn icon smaller" data-action="strikeThrough" data-tag-name="strike" title="Strike through">
<img src="https://img.icons8.com/fluency-systems-filled/30/000000/strikethrough.png"/>
</span>
</div>
<div class="box">
<span class="editor-btn icon has-submenu">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/align-left.png"/>
<div class="submenu">
<span class="editor-btn icon" data-action="justifyLeft" data-style="textAlign:left" title="Justify left">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/align-left.png"/>
</span>
<span class="editor-btn icon" data-action="justifyCenter" data-style="textAlign:center" title="Justify center">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/align-center.png"/>
</span>
<span class="editor-btn icon" data-action="justifyRight" data-style="textAlign:right" title="Justify right">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/align-right.png"/>
</span>
<span class="editor-btn icon" data-action="formatBlock" data-style="textAlign:justify" title="Justify block">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/align-justify.png"/>
</span>
</div>
</span>
<span class="editor-btn icon" data-action="insertOrderedList" data-tag-name="ol" title="Insert ordered list">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/numbered-list.png"/>
</span>
<span class="editor-btn icon" data-action="insertUnorderedList" data-tag-name="ul" title="Insert unordered list">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/bulleted-list.png"/>
</span>
<span class="editor-btn icon" data-action="outdent" title="Outdent" data-required-tag="li">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/outdent.png"/>
</span>
<span class="editor-btn icon" data-action="indent" title="Indent">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/indent.png"/>
</span>
</div>
<div class="box">
<span class="editor-btn icon" data-action="insertHorizontalRule" title="Insert horizontal rule">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/horizontal-line.png"/>
</span>
</div>
</div>
<div class="line">
<div class="box">
<span class="editor-btn icon smaller" data-action="undo" title="Undo">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/undo--v1.png"/>
</span>
<span class="editor-btn icon" data-action="removeFormat" title="Remove format">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/remove-format.png"/>
</span>
</div>
<div class="box">
<span class="editor-btn icon smaller" data-action="createLink" title="Insert Link">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/add-link.png"/>
</span>
<span class="editor-btn icon smaller" data-action="unlink" data-tag-name="a" title="Unlink">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/delete-link.png"/>
</span>
</div>
<div class="box">
<span class="editor-btn icon" data-action="toggle-view" title="Show HTML-Code">
<img src="https://img.icons8.com/fluency-systems-filled/48/000000/source-code.png"/>
</span>
</div>
</div>
</div>
<div class="content-area">
<div class="visuell-view" contenteditable>
<p style="text-align: center;">Welcome to my <b>WYSIWYG</b> Editor <i>(What you see is what you get)</i>!</p>
<p style="text-align: center;">It's only made of <u>HTML5</u>, <i><u>CSS3</u> </i>and pure <u>JavaScript</u>, <strike>no framework</strike>!</p>
<hr>
<p style="text-align: center;"><b>See for yourself! 😃</b></p>
<p style="text-align: center;"><b>Tutorial available <a href="https://webdeasy.de/en/program-your-own-wysiwyg-editor-in-10-minutes/?referer=cp-YoVmBx">here</a>! 😋</b></p>
</div>
<textarea class="html-view"></textarea>
</div>
</div>
<div class="modal">
<div class="modal-bg"></div>
<div class="modal-wrapper">
<div class="close"></div>
<div class="modal-content" id="modalCreateLink">
<h3>Insert Link</h3>
<input type="text" id="linkValue" placeholder="Link (example: https://webdeasy.de/)">
<div class="row">
<input type="checkbox" id="new-tab">
<label for="new-tab">Open in new Tab?</label>
</div>
<button class="done">Done</button>
</div>
</div>
</div>