首次提交

This commit is contained in:
DelLevin-Home
2026-01-13 21:18:06 +08:00
commit ee4fd4cd36
48 changed files with 1030 additions and 0 deletions

BIN
favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

523
index.html Normal file
View File

@@ -0,0 +1,523 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=5">
<title>DELLEVIN</title>
<meta name="description" content="99青年后端开发者略懂前端">
<meta name="keywords" content="Java,Spring,个人博客,微信小程序,博客">
<meta name="format-detection" content="telephone=no">
<link rel="shortcut icon" href="./favicon.ico">
<link rel="stylesheet" href="static/css/index.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery.fancybox@2.1.5/source/jquery.fancybox.css">
<script type="text/javascript">
if (!!window.ActiveXObject || "ActiveXObject" in window) { //is IE?
alert('朋友,上古浏览器不支持呢~');
}
</script>
</head>
<body>
<div id="body-wrap">
<nav class="not_index_bg" id="nav" style="background-image:url()">
<div id="page_site-info">
<div id="site-title">
<span class="blogtitle"></span>
<script src="https://cdn.jsdelivr.net/npm/typed.js@2.0.11"></script>
<script>
var typed = new Typed(".blogtitle", {
strings: ['求知若饥,虚心若愚', 'Stay Hungry Stay Foolish'],
startDelay: 300,
typeSpeed: 100,
loop: true,
backSpeed: 50,
showCursor: true
});
</script>
</div>
</div>
</nav>
<main id="content-outer">
<div class="layout_page" id="content-inner">
<div class="aside_content" id="aside_content">
<div class="card-widget card-info">
<div class="card-content">
<div class="card-info-avatar is-center">
<img class="avatar-img"
src="https://img.ittoolman.com/2024/10/23/e2378b86dee7d.png"
alt="avatar">
<div class="author-info__name">Del Levin</div>
<div class="author-info__description">99青年后端开发者略懂前端, <s>学生</s>,缺乏社会的毒打</div>
</div>
<div class="card-info-social-icons is-center">
<a class="social-icon" href="https://github.com/dellevin" target="_blank">
<i class="fa fa-github"></i>
</a>
<a class="social-icon" href="https://weibo.com/u/6094785105" target="_blank">
<i class="fa fa-weibo"></i>
</a>
<a class="social-icon" href="https://steamcommunity.com/profiles/76561199155776053/" target="_blank">
<i class="fa fa-steam"></i>
</a>
<a class="social-icon" href="https://t.me/levin092" target="_blank">
<i class="fa fa-telegram"></i>
</a>
</div>
</div>
</div>
<!--
<div class="card-widget card-announcement">
<div class="card-content">
<div class="item-headline">
<i class="fa fa-bullhorn" aria-hidden="true"></i>
<span>一言</span>
</div>
<div id="hitokoto"></div>
</div>
</div> -->
<div class="card-widget card-announcement">
<div class="card-content">
<div class="item-headline">
<i class="fa fa-connectdevelop" aria-hidden="true"></i>
<span style="font-weight: 1000;">联系方式</span>
</div>
<div class="selectable">
<span style="font-weight: 1000;">微信 </span> E-Levin_
</br>
<span style="font-weight: 1000;">扣扣 </span> 1754084631
</br>
<span style="font-weight: 1000;">邮箱 </span>dellevin99@gmail.com
</div>
</div>
</div>
<div class="card-widget card-announcement">
<div class="card-content">
<div class="item-headline">
<i class="fa fa-pagelines" aria-hidden="true"></i>
<span>诗词</span>
</div>
<div id="jinrishici-sentence"></div>
</div>
</div>
<div class="card-widget card-announcement">
<div class="card-content">
<div class="item-headline">
<i class="fa fa-calendar" aria-hidden="true"></i>
<span>经历</span>
</div>
<div>
<div class="left-div left-time">
<ul id="line">
<li>
<div class="focus"></div>
<div>未来还须努力
</div>
<div>2024至今</div>
</li>
<li>
<div class="focus"></div>
<div>大学毕业了
</div>
<div>2023.07</div>
</li>
<li>
<div class="focus"></div>
<div>购买了第一台服务器</div>
<div>2020.02.02</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- <div class="card-widget card-webinfo">
<div class="card-content">
<div class="item-headline">
<i class="fa fa-line-chart" aria-hidden="true"></i>
<span>站点信息</span>
</div>
<div class="webinfo">
<div class="webinfo-item">
<div class="webinfo-site-uv-name">本站访客数 :</div>
<div class="webinfo-site-uv-count" id="busuanzi_value_site_uv"></div>
</div>
<div class="webinfo-item">
<div class="webinfo-site-name">本站总访问量 :</div>
<div class="webinfo-site-pv-count" id="busuanzi_value_site_pv"></div>
</div>
</div>
</div>
</div> -->
</div>
<article id="page">
<div class="article-container">
<h2>音乐</h2>
<meting-js server="netease" type="playlist" id="6901399940" autoplay="false" list-max-height=180px>
</meting-js>
<hr>
<h2>自述 · 平凡</h2>
<div>
你好啊!我叫张昊洋,河北衡水人,土生土长的北方汉子,毕业于一所不知名的二本院校。信息管理与信息系统专业。
自学java、vue、linux以及mysql等技术会些PS图片、PR、AE视频制作也做过系统剪过网线搞过plc耍过单片机修过服务器
运营过公众号和网站等等。可谓是会,但只会一点点。别人都觉得我是个大佬,其实我就是个小菜鸡。平时也爱玩玩游戏看看书,
写写小工具什么的混迹于各大网络论坛并在各个博主下面直呼“大佬666”。博客也在断断续续中更新。主要是记录生活随笔和碰到的技术难题。
目前呢是买了两个域名ittoolman.top和ittoolman.com一个国外服务器。至于为什么喜欢ittoolman这个呢这就说来话长了。
</br>
之前的域名是wonder1999.com这个那是我大学第一次买域名和服务器一切都好似有着希望。后来随着会的技术越来越多我也不吝啬展示自己的能力。
帮了很多人,也做过很多事情,我感觉我像一个工具人一样,召之即来挥之即去。慢慢的,我像一个机器人一样的生活,清澈的眼神多了些许的浑浊。这就是
ittoolman这个域名的由来。
</br>
如今的我已经工作了,我很庆幸我还是对技术有着极大的热情,虽然藉藉无名,但是我还是一直会保持着对技术的热爱,对生活的热爱的。
</div>
<hr>
<h2>我的网站</h2>
<div class="auto-resize flex-container">
<a class="projectItem a" target="_blank" href="https://www.ittoolman.top/">
<div class="projectItemLeft">
<h1>Github博客</h1>
<p>技术随笔</p>
</div>
<div class="projectItemRight">
<img src="./static/img/blog1.png" alt="">
</div>
</a>
<a class="projectItem a" target="_blank" href="https://blog.ittoolman.com/">
<div class="projectItemLeft">
<h1>博客</h1>
<p>记录生活</p>
</div>
<div class="projectItemRight">
<img src="./static/img/blog.png" alt="">
</div>
</a>
<a class="projectItem a" target="_blank" href="https://img.ittoolman.com/">
<div class="projectItemLeft">
<h1>图床</h1>
<p>兰空图床</p>
</div>
<div class="projectItemRight">
<img src="./static/img/2.png" alt="">
</div>
</a>
<a class="projectItem a" target="_blank" href="https://alist.ittoolman.com">
<div class="projectItemLeft">
<h1>alist云盘</h1>
<p>存一些数据</p>
</div>
<div class="projectItemRight">
<img src="./static/img/3.png" alt="">
</div>
</a>
<!--<a class="projectItem a" target="_blank" href="https://webdav.ittoolman.com">-->
<!-- <div class="projectItemLeft">-->
<!-- <h1>webdav</h1>-->
<!-- <p>webdav站点</p>-->
<!-- </div>-->
<!-- <div class="projectItemRight">-->
<!-- <img src="./static/img/web.png" alt="">-->
<!-- </div>-->
<!--</a>-->
</div>
<hr>
<h2>技能</h2>
<div class="skill">
<div class="skillsImg">
<img src="./static/img/skills/java.png" alt="">
<div class="skillsImgText">Java</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/spring-boot.png" alt="">
<div class="skillsImgText">spring</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/vue.png" alt="">
<div class="skillsImgText">Vue</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/git.png" alt="">
<div class="skillsImgText">git</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/javascript.png" alt="">
<div class="skillsImgText">javascript</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/html.png" alt="">
<div class="skillsImgText">Html</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/typescript.png" alt="">
<div class="skillsImgText">typescript</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/python.png" alt="">
<div class="skillsImgText">python</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/pytorch.png" alt="">
<div class="skillsImgText">pytorch</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Docker.png" alt="">
<div class="skillsImgText">Docker</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/windows.png" alt="">
<div class="skillsImgText">windows</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Linux.png" alt="">
<div class="skillsImgText">Linux</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/cent-os.png" alt="">
<div class="skillsImgText">centos</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/ubuntu.png" alt="">
<div class="skillsImgText">ubuntu</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/debian.png" alt="">
<div class="skillsImgText">debian</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/MySQL.png" alt="">
<div class="skillsImgText">MySQL</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/electron.png" alt="">
<div class="skillsImgText">electron</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Redis.png" alt="">
<div class="skillsImgText">Redis</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/maven.png" alt="">
<div class="skillsImgText">maven</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Nginx.png" alt="">
<div class="skillsImgText">Nginx</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Nodejs.png" alt="">
<div class="skillsImgText">Nodejs</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Apache.png" alt="">
<div class="skillsImgText">Apache</div>
</div>
<div class="skillsImg">
<img src="./static/img/skills/Tomcat.png" alt="">
<div class="skillsImgText">Tomcat</div>
</div>
</div>
<hr>
<h2>常用工具</h2>
<div class="skill">
<div class="skillsImg">
<img src="./static/img/tools/postman.png" alt="">
<div class="skillsImgText">postman</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/icons8-intellij-idea.png" alt="">
<div class="skillsImgText">idea</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/pycharm.png" alt="">
<div class="skillsImgText">pycharm</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/vscode.png" alt="">
<div class="skillsImgText">vscode</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/hbuilderx.png" alt="">
<div class="skillsImgText">hbuilderx</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/navicate.png" alt="">
<div class="skillsImgText">navicate</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/cmder.png" alt="">
<div class="skillsImgText">cmder</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/Typora.png" alt="">
<div class="skillsImgText">Typora</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/Xshell.png" alt="">
<div class="skillsImgText">Xshell</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/VMware.png" alt="">
<div class="skillsImgText">VMware</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/github.png" alt="">
<div class="skillsImgText">github</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/photoshop.png" alt="">
<div class="skillsImgText">photoshop</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/premiere.png" alt="">
<div class="skillsImgText">premiere</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/Ae.png" alt="">
<div class="skillsImgText">Ae</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/1.png" alt="">
<div class="skillsImgText">CheatEngine</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/x64dbg.png" alt="">
<div class="skillsImgText">x64dbg</div>
</div>
<div class="skillsImg">
<img src="./static/img/tools/music.png" alt="">
<div class="skillsImgText">netease</div>
</div>
</div>
<hr>
<h2>收藏的网站</h2>
<div class="tool">
<a href="https://www.bilibili.com/" target="_blank" rel="noopener noreferrer">bilibili、</a>
<a href="https://adzhp.cn/" target="_blank" rel="noopener noreferrer">爱达杂货铺、</a>
<a href="http://www.gzlib.org/" target="_blank" rel="noopener noreferrer">贵州数字图书馆、</a>
<a href="https://www.bookstack.cn/" target="_blank" rel="noopener noreferrer">书栈网</a>
<a href="https://hot.imsyy.top/#/" target="_blank" rel="noopener noreferrer">今日热榜</a>
</div>
</div>
</article>
</div>
</main>
<footer id="footer">
<div id="footer-wrap">
<div class="copyright">&copy;2020 - 2024 BY Del Levin</div>
</div>
</footer>
</div>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery.fancybox@2.1.5/source/jquery.fancybox.js"></script>
<script src="https://cdn.jsdelivr.net/npm/instant.page@3.0.0/instantpage.js" type="module"></script>
<script src="https://cdn.jsdelivr.net/npm/lazysizes@5.2.0/lazysizes.min.js" async></script>
<!-- aplayer、meting -->
<!-- require APlayer -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
<!-- nplayer -->
<script src="https://unpkg.com/nplayer@latest/dist/index.min.js"></script>
<!-- 一言、今日诗词 -->
<script src="https://v1.hitokoto.cn/?encode=js&select=%23hitokoto" defer></script>
<script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
<!--鼠标点击效果-->
<script src="https://cdn.jsdelivr.net/gh/TRHX/CDN-for-itrhx.com@3.0.8/js/maodian.js"></script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
const urlWithParams = `https://47.121.199.144/8081/sys_api/api/markIP?url=${encodeURIComponent(window.location.href)}`;
fetch(urlWithParams)
.then(response => {
if (!response.ok) {
throw new Error('Network response was not ok');
}
return response.json(); // 如果返回的是 JSON 数据
})
.then(data => {
// console.log('Response data:', data);
})
.catch(error => {
console.error('There has been a problem with your fetch operation:', error);
});
});
console.clear();
console.log("%c 有朋自远方来, 不亦说乎.", "background:#24272A; color:#ffffff", "");
(function ($) {
$.fn.snow = function (options) {
var $flake = $('<div id="snowbox" />').css({ 'position': 'absolute', 'z-index': '9999', 'top': '-50px' }).html('&#10052;'),
documentHeight = $(document).height(),
documentWidth = $(document).width(),
defaults = {
minSize: 10,
maxSize: 20,
newOn: 1000,
flakeColor: "#AFDAEF" /* 此处可以定义雪花颜色,若要白色可以改为#FFFFFF */
},
options = $.extend({}, defaults, options);
var interval = setInterval(function () {
var startPositionLeft = Math.random() * documentWidth - 100,
startOpacity = 0.5 + Math.random(),
sizeFlake = options.minSize + Math.random() * options.maxSize,
endPositionTop = documentHeight - 200,
endPositionLeft = startPositionLeft - 500 + Math.random() * 500,
durationFall = documentHeight * 10 + Math.random() * 5000;
$flake.clone().appendTo('body').css({
left: startPositionLeft,
opacity: startOpacity,
'font-size': sizeFlake,
color: options.flakeColor
}).animate({
top: endPositionTop,
left: endPositionLeft,
opacity: 0.2
}, durationFall, 'linear', function () {
$(this).remove()
});
}, options.newOn);
};
})(jQuery);
$(function () {
$.fn.snow({
minSize: 5, /* 定义雪花最小尺寸 */
maxSize: 40,/* 定义雪花最大尺寸 */
newOn: 700 /* 定义密集程度,数字越小越密集 */
});
});
// 浏览器标题
// var OriginTitle = document.title;
// var titleTime;
// document.addEventListener('visibilitychange', function () {
// if (document.hidden) {
// // $('[rel="icon"]').attr('href', "/funny.ico");
// document.title = '╭(°A°`)╮ 不要走 ~';
// clearTimeout(titleTime);
// }
// else {
// $('[rel="icon"]').attr('href', "/favicon.ico");
// document.title = '(ฅ>ω<*ฅ) 噫,你回来辣 ~' + OriginTitle;
// titleTime = setTimeout(function () {
// document.title = OriginTitle;
// }, 2000);
// }
// });
</script>
</body>
</html>

507
static/css/index.css Normal file
View File

@@ -0,0 +1,507 @@
* {
box-sizing: border-box;
}
html {
height: 100%;
}
body {
position: relative;
min-height: 100%;
background: #eee;
color: #4c4948;
font-size: 14px;
font-family: Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, "Microsoft JhengHei", "MicrMicrosoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif;
line-height: 2;
}
body {
margin: 0;
}
h1, h2, h3, h4, h5, h6 {
position: relative;
margin: 1rem 0 .7rem;
color: #344c67;
font-weight: 700
}
hr:before {
position: absolute;
top: -10px;
left: 5%;
z-index: 1;
color: #49b1f5;
content: '\f0c4';
font: normal normal normal 14px/1 FontAwesome;
font-size: 20px;
transition: all 1s ease-in-out;
}
hr {
position: relative;
margin: 2rem auto;
width: calc(100% - 4px);
border: 2px dashed #a4d8fa;
background: #fff;
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
}
body, li, span, p {
/* cursor: url(https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/cursor/texto.cur),auto; */
}
a {
background-color: transparent;
/* cursor: url(https://cdn.jsdelivr.net/gh/honjun/cdn@1.6/img/cursor/ayuda.cur),auto; */
}
strong{
color: #FF0066;
}
#body-wrap {
position: relative;
display: box;
display: flex;
box-flex: 1;
flex: 1 auto;
-webkit-box-orient: vertical;
flex-direction: column;
transition: all .5s;
}
#nav.not_index_bg {
height: 15rem;
}
#nav {
position: relative;
margin-top: -2rem;
width: 100%;
background-color: #49b1f5;
background-attachment: local;
background-position: center;
background-size: cover;
}
#page_site-info {
position: absolute;
top: 7rem;
width: 100%;
}
#site-title {
color: #eee;
text-align: center;
text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, .15);
line-height: 1.5;
font-weight: 700;
font-size: 1.3rem;
animation: titlescale 1s;
}
main {
display: block;
}
#content-outer {
-webkit-box-flex: 1;
-moz-box-flex: 1;
-o-box-flex: 1;
box-flex: 1;
-webkit-flex: 1 auto;
-ms-flex: 1 auto;
flex: 1 auto;
}
h1 {
font-size: 2em;
margin: .67em 0;
}
.layout_page {
display: flex;
-webkit-box-align: start;
align-items: flex-start;
margin: 0 auto;
padding: 0 5px;
max-width: 1400px;
}
#page{
margin-top: 10px;
width: 75%;
border-radius: 3px;
background: #fff;
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06);
transition: all .3s;
}
#page{
padding: 20px 44px 44px;
}
#aside_content {
width: 25%;
}
#aside_content .card-widget {
overflow: hidden;
margin: 10px 0;
border-radius: 3px;
background: #fff;
-webkit-box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06);
box-shadow: 0 4px 8px 6px rgba(7, 17, 27, .06);
-webkit-transition: all .3s;
-moz-transition: all .3s;
-o-transition: all .3s;
-ms-transition: all .3s;
transition: all .3s;
}
#aside_content .card-content {
padding: 1rem 1.2rem;
}
.skillbar {
position: relative;
display: block;
max-width: 360px;
margin: 15px 10px;
background: #eee;
height: 30px;
border-radius: 35px;
-moz-border-radius: 35px;
-webkit-border-radius: 35px;
-webkit-transition: 0.4s linear;
-moz-transition: 0.4s linear;
-o-transition: 0.4s linear;
transition: 0.4s linear;
-webkit-transition-property: width, background-color;
-moz-transition-property: width, background-color;
-o-transition-property: width, background-color;
transition-property: width, background-color;
}
.skillbar .skillbar-title {
position: absolute;
top: 0;
left: 0;
width: 110px;
font-size: 0.9rem;
color: #ffffff;
border-radius: 35px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
}
.skillbar .skillbar-title span {
display: block;
background: rgba(0, 0, 0, 0.15);
padding: 0 20px;
height: 30px;
line-height: 30px;
border-radius: 35px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
}
.skillbar .skill-bar-percent {
position: absolute;
right: 10px;
top: 0;
font-size: 12px;
height: 30px;
line-height: 30px;
color: #ffffff;
color: rgba(0, 0, 0, 0.5);
}
.tool a {
color: #FF0066;
}
.is-center {
text-align: center;
}
#aside_content .card-info img {
display: inline-block;
padding: 5px;
width: 120px;
height: 120px;
border-radius: 70px;
vertical-align: top;
transition: all .3s;
}
img {
max-width: 100%;
transition: all .2s;
}
.avatar-img {
animation: avatar_turn_around 2s linear infinite;
}
#aside_content .card-info .author-info__name {
font-weight: 500;
font-size: 1.1rem;
}
aside_content .card-info .author-info__description {
margin-top: -.3rem;
}
#aside_content .card-info .card-info-social-icons {
margin: .3rem 0 -.3rem;
}
#aside_content .card-info .card-info-social-icons .social-icon {
margin: 0 .5rem;
color: #4c4948;
font-size: 1.5rem;
}
#aside_content .item-headline {
font-size: .8rem;
}
#aside_content .item-headline span {
margin-left: .5rem;
}
#aside_content .card-webinfo .webinfo {
padding: .2rem 1rem;
}
#aside_content .card-webinfo .webinfo .webinfo-item {
display: block;
padding: 4px 0 0;
}
#aside_content .card-webinfo .webinfo .webinfo-item div:first-child {
display: inline-block;
}
#aside_content .card-webinfo .webinfo .webinfo-item div:last-child {
display: inline-block;
float: right;
}
#footer {
position: relative;
margin-top: 1rem;
background-attachment: local;
background-position: bottom;
background-size: cover;
}
#footer-wrap {
position: relative;
padding: 2rem 1rem;
text-align: center;
}
#footer, .layout_page, .layout_post {
-webkit-animation: main 1s;
-moz-animation: main 1s;
-o-animation: main 1s;
-ms-animation: main 1s;
animation: main 1s;
}
@media screen and (min-width: 768px){
#site-title {
font-size: 2rem;
}
}
@media screen and (max-width: 768px){
.layout_page {
padding: 0 5px !important;
}
#page {
margin: 0;
padding: 1.8rem 1.3rem;
}
}
@media screen and (max-width: 900px){
#page{
width: 100% !important;
}
#aside_content{
width: 100% !important;
}
.layout_page {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-o-box-orient: vertical;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
}
@media screen and (min-width: 900px){
#aside_content .card-widget {
margin-right: 15px;
}
}
::-webkit-scrollbar {
width: 2px;
height: 2px
}
::-webkit-scrollbar-thumb {
background: linear-gradient(to right, #FF0066 0%, #FF00CC 100%); width: 85%
}
::-webkit-scrollbar-track {
background-color: transparent
}
/* ---------------- */
html {
--item_bg_color: rgb(102,175,239,0.8);
--item_left_title_color: #000000;
--item_left_text_color: #000000;
--card_filter: 0px;
-webkit-user-select: none; /* Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */
}
.selectable {
-webkit-user-select: text; /* Safari */
-moz-user-select: text; /* Firefox */
-ms-user-select: text; /* Internet Explorer/Edge */
user-select: text; /* Non-prefixed version, currently supported by Chrome, Opera and Firefox */
}
.projectItem {
min-width: 200px;
text-decoration: none;
margin: 7px;
display: flex;
background-color: var(--item_bg_color);
border-radius: 8px;
padding: 15px;
height: 95px;
width: calc(22% - 25px);
backdrop-filter: blur(var(--card_filter));-webkit-backdrop-filter: blur(var(--card_filter));
-webkit-backdrop-filter: blur(var(--card_filter));-webkit-backdrop-filter: blur(var(--card_filter));
transition: opacity 0.3s ease, background-color 0.3s ease, border 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
}
.projectItem:hover {
box-shadow: 0 8px 16px -4px #2c2d300c;
transform: translateY(-2px);
transition: box-shadow 0.3s ease, transform 0.2s ease;
}
.projectItem:hover .projectItemLeft {
width: 100%;
transition: width 0.4s ease;
}
.projectItem:hover .projectItemRight {
width: 0%;
transition: width 0.4s ease;
}
.projectItem:hover .projectItemRight img {
transform: rotate(40deg);
transition: transform 0.4s ease;
}
.projectItem.pressed {
transform: scale(0.9);
}
.projectItemLeft p {
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
font-size: 12px;
margin-top: 15px;
color: var(--item_left_text_color);
}
.projectItemLeft h1 {
font-weight: normal;
font-size: 16px;
margin: 0px;
transition: font-size 0.4s ease;
color: var(--item_left_title_color);
}
.projectItemLeft {
transition: width 0.4s ease;
height: 100%;
width: 80%;
}
.projectItemRight {
overflow: hidden;
transition: width 0.4s ease;
display: flex;
justify-content: center;
align-items: center;
width: 20%;
height: 100%;
}
.projectItemRight img {
height: 38px;
width: 39px;
}
.auto-resize.flex-container {
display: flex;
flex-wrap: wrap;
gap: 15px;
}
.left-div {
flex-shrink: 0;
width: 100%;
border-radius: 13px;
margin-top: 10px;
backdrop-filter: blur(var(--card_filter));
-webkit-backdrop-filter: blur(var(--card_filter));
}
#line {
width: 100%;
height: 200px;
font-size: 13px;
padding-left: 8px;
scroll-snap-type: y mandatory;
overflow-y: scroll;
}
#line li {
list-style: none;
position: relative;
padding: 15px 0px 0px 15px;
border-left: 2px solid #d5d5d5;
border-radius: 0;
scroll-snap-align: end;
color: var(--main_text_color);
}
#line li:first-child .focus:first-child {
background-color: #aaffcd;
animation: focus 1.8s ease infinite;
}
#line::-webkit-scrollbar {
display: none;
}
.skill {
display: flex;
flex-wrap: wrap;
padding-bottom: 20px;
gap: 40px;
}
.skillsImg {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 38px;
width: 38px;
position: relative;
margin-bottom: 20px;
}
.skillsImg img {
max-width: 100%;
max-height: 100%;
}
.skillsImgText {
text-align: center;
margin-top: 0;
font-weight: 800;
position: absolute;
bottom: -80%;
left: 50%;
transform: translateX(-50%);
}

BIN
static/img/2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

BIN
static/img/3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

BIN
static/img/blog.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

BIN
static/img/blog1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
static/img/skills/Linux.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
static/img/skills/MySQL.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/img/skills/Nginx.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
static/img/skills/Redis.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
static/img/skills/git.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

BIN
static/img/skills/html.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/img/skills/java.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
static/img/skills/maven.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 937 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
static/img/skills/vue.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/img/tools/1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
static/img/tools/Ae.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
static/img/tools/Typora.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
static/img/tools/VMware.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
static/img/tools/Xshell.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
static/img/tools/cmder.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 787 B

BIN
static/img/tools/github.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
static/img/tools/music.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 264 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

BIN
static/img/tools/vscode.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
static/img/tools/x64dbg.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
static/img/web.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB