<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Darshan Gowda</title>
<link rel="shortcut icon" type="image/png" href="https://blogger.googleusercontent.com/img/a/AVvXsEiRJn7JpXgkA59G7g_UD25kaZG3vPIbXFhtDlEvZfUReY-2GpVmWUFKutDChrbhQM_8pafJzWlbcI2eFHSNXOuwM3Y-G4eob_v2nq0GfT5ORjMewsXkqLSq13F0enucPZSatao6djfrpuLF-9bOtGwH1tp6Ejj0M8IHiMPn_uzJWBw55IGqOmHRrcHveQ=s512"/>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"><link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.min.css'>
</head>
<style>body{margin:0;height:100%;}
body,footer,.hero-body{background-color:rgb(10,25,47)!important;}
a{color:inherit;}
a:hover{text-decoration:none;color:inherit;}
p{color:rgb(136,146,176);}
.title{color:rgba(139,180,216,0.94);}
.sidebar{background-color:rgb(23,42,69);display:flex;align-items:center;flex-direction:column;border-radius:5px;color:rgb(136,146,176);opacity:1;}
.image-overlay{background:url('https://i.imgur.com/SsVBVWk.png') 20%;opacity:0.5;}
.sidebar-image{width:150px;border-radius:100%;margin-top:1rem;text-shadow:2px 2px 4px #000000;}
.sidebar-link{font-size:0.8rem;text-transform:uppercase;color:rgba(139,180,216,0.94);}
.sidebar-link:hover{color:rgb(230,241,255);}
.header-name{font-weight:600;color:rgb(230,241,255);}
.column-header{border-bottom:2px rgb(45,57,82) solid;margin-bottom:1rem;}
.column-header > h1{font-family:'Lato',sans-serif;font-weight:100;color:white;}
.icon,.sidebar-link{transition-duration:250ms;}
.icon:hover{color:white;}
.terminal-bar{background-color:#eae8e9;border-top-left-radius:5px;border-top-right-radius:5px;display:flex;position:relative;}
.dark-mode{background-image:linear-gradient(180deg,#464248 0%,#3b383d 100%);border-bottom:1px solid rgba(66,66,66,0.5);}
.dark-mode-text{color:#bdb9bf!important;}
.icon-btn{border-radius:50%;margin-top:7px;height:15px;width:15px;margin-bottom:0.5rem;}
.terminal-bar > div.icon-btn:first-child{margin-left:0.6rem;}
.terminal-bar > div.icon-btn:not(:first-child){margin-left:0.5rem;}
.terminal-bar > div.icon-btn:last-child{margin-right:0.6rem;}
.close{background-color:#fa615c;}
.max{background-color:#3fc950;}
.min{background-color:#ffbd48;}
.terminal-window{border-bottom-right-radius:5px;border-bottom-left-radius:5px;height:254px;padding:.5rem 0rem 0rem .5rem;display:flex;flex-direction:column;}
.primary-bg{background-color:rgb(23,42,69);}
.shadow{-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.55);-moz-box-shadow:0 5px 10px rgba(0,0,0,0.55);box-shadow:0 3px 15px rgba(0,0,0,0.2);}
.terminal-bar-text{position:absolute;margin-top:3px;color:#383838;width:100%;text-align:center;font-weight:500;}
.has-equal-height{height:100%;display:flex;flex-direction:column;}
.terminal-output{overflow-y:hidden;overflow:auto;}
.column-child{flex:1;}
.terminal-line,.dummy-keyboard{position:relative;font-family:'Anonymous Pro',monospace;font-size:.9rem;color:#b7c5d2;}
.directory{color:#75e1e7;font-weight:500;}
.success{color:#8dd39e;}
.code,.error,.fa-heart{color:#d7566a;}
.fa-heart{padding-top:0.5rem;}
.dummy-keyboard{outline:none;border:none;background-color:transparent;}
::-webkit-scrollbar{display:none;}
@media screen and (max-width:768px){.resume{padding-bottom:0.5rem;}}
.Crdt{opacity:0;}</style>
<body>
<section class="hero is-fullheight">
<div class="hero-body">
<div class="container">
<div class="columns">
<div class="column is-3 is-flex">
<div class="column-child sidebar shadow">
<div class="sidebar-header has-text-centered">
<img
src="https://blogger.googleusercontent.com/img/a/AVvXsEiRJn7JpXgkA59G7g_UD25kaZG3vPIbXFhtDlEvZfUReY-2GpVmWUFKutDChrbhQM_8pafJzWlbcI2eFHSNXOuwM3Y-G4eob_v2nq0GfT5ORjMewsXkqLSq13F0enucPZSatao6djfrpuLF-9bOtGwH1tp6Ejj0M8IHiMPn_uzJWBw55IGqOmHRrcHveQ=s512" alt="Avatar"
class="sidebar-image">
<h2 class="header-name">Darshan Gowda</h2>
<h5>Pro Templates</h5>
<div class="social-icons">
<a href="https://twitter.com/"><i class="fab fa-twitter icon"></i></a>
<a href="https://telegram.me/"><i class="fab fa-telegram icon"></i></a>
<a href="https://github.com/"><i class="fab fa-github icon"></i></a>
<a href="https://www.instagram.com/prince___dg"><i class="fab fa-instagram icon"></i></a>
<a href="https://www.linkedin.com/in/"><i class="fab fa-linkedin icon"></i></a>
</div>
<a class="Crdt" href="https://www.protemplates.in">ProTemplates</a>
</div>
</div>
</div>
<div class="column is-flex">
<div class="column-child terminal shadow">
<div class="terminal-bar dark-mode">
<div class="icon-btn close"></div>
<div class="icon-btn min"></div>
<div class="icon-btn max"></div>
<div class="terminal-bar-text is-hidden-mobile dark-mode-text">Enter Commands</div>
</div>
<div class="terminal-window primary-bg" onclick="document.getElementById('dummyKeyboard').focus();">
<div class="terminal-output" id="terminalOutput">
<div class="terminal-line">
<span class="help-msg">Welcome to Darshan's portfolio — Type <span class="code">help</span>
for a list of supported commands.</span>
</div>
</div>
<div class="terminal-line">
<span class="success">➜</span> <span class="directory">~</span> <span class="user-input"
id="userInput"></span>
<input type="text" id="dummyKeyboard" class="dummy-keyboard">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<script src='https://use.fontawesome.com/releases/v5.3.1/js/all.js'></script>
<script>window.onload = () => {
const myInput = document.getElementById("dummyKeyboard");
myInput.onpaste = (e) => e.preventDefault();
};
const COMMANDS = {
help: 'Supported commands: <span class="code">about</span>, <span class="code">experience</span>, <span class="code">education</span>, <span class="code">skills</span>, <span class="code">acknowledges</span>, <span class="code">contact</span>, <span class="code">resume</span>',
about:
"Hello 👋<br>I'm Darshan Gowda.<br> An 17 years Sales Manager and After Sales Supporter currently living in India.",
skills:
'<span class="code">Skill:</span>Template Distributer, HTML, Content licensing,..<br>',
education:
"Karnataka, India<br> BCA , 2nd Year",
experience: "No Experience🥲 Me iz Nub",
acknowledges:
"<a href='https://bughunter.withgoogle.com/profile/12edf378-705d-4ef8-ae44-2fc5ab8bbb69' class='success link'>Google Honorable Mention</a> , <a href='https://www.nokia.com/responsible-disclosure/' class='success link'>Nokia HOF On December 2020</a> , <a href='https://access.redhat.com/articles/66234' class='success link'>RedHat HOF 2021</a> , <a href='https://security.intuit.com/responsible-disclosure-acknowledgements' class='success link'>intuit HOF</a> , <a href='https://security.olx.com/security-hall-of-fame.html' class='success link'>OLX HOF 2021</a> , <a href='https://fabaf.in/responsible-disclosure/' class='success link'>Fabaf HOF</a> , <a href='https://www.blackberry.com/us/en/services/blackberry-product-security-incident-response' class='success link'>Blackberry HOF 2021</a> , <a href='https://www.powerassist.nl/security-hall-of-fame' class='success link'>Powerassist HOF</a> , <a href='./Lenovo.pdf' class='success link'>Lenovo Certificate of Appreciation </a> , <a href='./Nykaa.pdf' class='success link'>Nykaa Certificate of Appreciation </a> , <a class='success link'>Thanked By Sky.eu</a> , <a href='https://www.basf.com/global/en/legal/responsible-disclosure-statement.html' class='success link'>BASF HOF 2021</a> ",
contact:
"You can contact me on any of following links:<br><a href='https://telegram.dog/protemplates' class='success link'>Telegram</a>, <a href='https://www.instagram.com/' class='success link'>Instagram</a>, <a href='https://www.twitter.com/' class='success link'>Twitter</a>",
};
const userInput = document.getElementById("userInput");
const terminalOutput = document.getElementById("terminalOutput");
const inputfield = document.getElementById("dummyKeyboard");
inputfield.addEventListener("keypress", (e) => {
if (e.key === "Enter") {
let input = e.target.value;
input = input.toLowerCase();
if (input.length === 0) {
return;
}
let output;
output = `<div class="terminal-line"><span class="success">➜</span> <span class="directory">~</span> ${input}</div>`;
if (!COMMANDS.hasOwnProperty(input)) {
output += `<div class="terminal-line">no such command: ${input}</div>`;
console.log("Oops! no such command");
} else {
output += COMMANDS[input];
}
terminalOutput.innerHTML = `${terminalOutput.innerHTML}<div class="terminal-line">${output}</div>`;
terminalOutput.scrollTop = terminalOutput.scrollHeight;
e.target.value = "";
}
});</script>
</body>
</html>
Coder Portfolio Blogger Template
Coder Portfolio Blogger Template
-
Deskripsi
-
Publisher
KAAF Multimedia