完善界面样式与功能
This commit is contained in:
parent
cff6266d00
commit
f82dfc67c4
484
css/body.css
484
css/body.css
@ -1,49 +1,479 @@
|
||||
:root {
|
||||
--main_text_color: #000000;
|
||||
--main_bg_color: linear-gradient(50deg, #a2d0ff, #ffffff);
|
||||
--gradient: linear-gradient(120deg, rgb(133, 62, 255), #f76cc6 30%, rgb(255, 255, 255) 60%);
|
||||
--purple_text_color: #747bff;
|
||||
--text_bg_color: rgb(26, 4, 48);
|
||||
--item_bg_color: rgba(255, 255, 255, 0.35);
|
||||
--item_hover_color: rgba(255, 255, 255, 0.45);
|
||||
--card_filter: 20px;
|
||||
--back_filter: 15px;
|
||||
--back_filter_color: rgba(255, 255, 255, 0.1);
|
||||
--fill: #000000;
|
||||
}
|
||||
|
||||
html[data-theme="Dark"] {
|
||||
--main_text_color: #fff;
|
||||
--main_bg_color: linear-gradient(50deg, #1a1a2e, #16213e);
|
||||
--gradient: linear-gradient(120deg, rgb(133, 62, 255), #f76cc6 30%, rgb(255, 255, 255) 60%);
|
||||
--purple_text_color: #747bff;
|
||||
--text_bg_color: rgb(26, 4, 48);
|
||||
--item_bg_color: rgba(255, 255, 255, 0.18);
|
||||
--item_hover_color: rgba(255, 255, 255, 0.25);
|
||||
--card_filter: 20px;
|
||||
--back_filter: 15px;
|
||||
--back_filter_color: rgba(0, 0, 0, 0.2);
|
||||
--fill: #ffffff;
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
user-select: none;
|
||||
transition: background-color 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: "Arial", sans-serif;
|
||||
|
||||
/* 背景图 */
|
||||
background-image: url("../blackboard/.jpg"); /* 图片地址 */
|
||||
background-size: cover; /* 自动缩放并裁剪 */
|
||||
background-position: center center; /* 居中裁剪 */
|
||||
background-repeat: no-repeat; /* 不重复平铺 */
|
||||
|
||||
/* 铺满整个屏幕 */
|
||||
font-family: 'Arial', sans-serif;
|
||||
background: var(--main_bg_color);
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-attachment: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
min-height: 100vh;
|
||||
overflow-x: hidden;
|
||||
color: var(--main_text_color);
|
||||
}
|
||||
|
||||
.main-layout {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: calc(100vh - 100px);
|
||||
padding-bottom: 100px;
|
||||
/* 避免 fixed 页脚/聊天区遮挡：用 footer 高度 + 预留区间替代魔法数 */
|
||||
height: calc(100vh - (var(--footer-height, 32px) + 68px));
|
||||
padding: 60px 20px 20px;
|
||||
max-width: 1150px;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
align-items: stretch;
|
||||
gap: 14px;
|
||||
/* 允许左右溢出显示，避免 logo 两端被父容器裁切 */
|
||||
overflow-x: visible;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.left-panel, .right-panel {
|
||||
width: 50%;
|
||||
.left-panel {
|
||||
flex: 0 0 30%;
|
||||
width: 30%;
|
||||
display: flex;
|
||||
justify-content: center; /* 水平居中 */
|
||||
align-items: center; /* 垂直居中 */
|
||||
flex-direction: column; /* 内容垂直排列 */
|
||||
padding: 20px;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
padding: 16px 20px;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
overflow-x: visible;
|
||||
}
|
||||
|
||||
.logo {
|
||||
margin-top: 40px;
|
||||
font-size: 50px;
|
||||
.right-panel {
|
||||
flex: 1;
|
||||
width: auto;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: stretch;
|
||||
flex-direction: column;
|
||||
padding: 20px 10px 20px 0;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
padding-bottom: calc(var(--footer-height, 32px) + 120px);
|
||||
}
|
||||
|
||||
.intro a {
|
||||
display: block;
|
||||
margin: 5px 0;
|
||||
.left-panel::-webkit-scrollbar,
|
||||
.right-panel::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-family: 'Pacifico', cursive;
|
||||
font-size: 52px;
|
||||
font-weight: 800;
|
||||
margin: 12px 0;
|
||||
line-height: 1.3;
|
||||
white-space: nowrap;
|
||||
max-width: 100%;
|
||||
overflow: visible;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-size: 200%;
|
||||
background-position: 0%;
|
||||
animation: backgroundSizeAnimation 10s ease-in-out infinite;
|
||||
background-image: var(--gradient);
|
||||
padding: 10px 6px;
|
||||
}
|
||||
|
||||
.left-avatar {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 12px;
|
||||
object-fit: cover;
|
||||
margin-top: 6px;
|
||||
margin-bottom: 14px;
|
||||
box-shadow: 0 10px 22px -14px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
.daily-quote {
|
||||
width: 100%;
|
||||
padding: 16px;
|
||||
margin-bottom: 18px;
|
||||
text-align: center;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.quote-content {
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
color: var(--main_text_color);
|
||||
margin-bottom: 8px;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.quote-author {
|
||||
font-size: 12px;
|
||||
color: var(--main_text_color);
|
||||
opacity: 0.7;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.quote-author:not(:empty)::before {
|
||||
content: "——";
|
||||
}
|
||||
|
||||
.left-design {
|
||||
margin-top: auto;
|
||||
padding-top: 14px;
|
||||
font-size: 12px;
|
||||
font-family: 'Pacifico', cursive;
|
||||
font-style: italic;
|
||||
color: var(--main_text_color);
|
||||
opacity: 0.65;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.design-name {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.design-name::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -2px;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 1px;
|
||||
background-color: var(--main_text_color);
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.design-name:hover::after {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.intro {
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
background: var(--item_bg_color);
|
||||
border-radius: 13px;
|
||||
padding: 25px;
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
transition: transform 0.3s ease, background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.intro:hover {
|
||||
transform: translateY(-5px);
|
||||
background: var(--item_hover_color);
|
||||
}
|
||||
|
||||
.intro h3 {
|
||||
font-size: 20px;
|
||||
margin-bottom: 15px;
|
||||
color: var(--main_text_color);
|
||||
}
|
||||
|
||||
.intro ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.intro li {
|
||||
margin: 8px 0;
|
||||
font-size: 16px;
|
||||
color: var(--main_text_color);
|
||||
}
|
||||
|
||||
.intro a {
|
||||
display: block;
|
||||
margin: 8px 0;
|
||||
padding: 10px 15px;
|
||||
background: var(--item_bg_color);
|
||||
border-radius: 8px;
|
||||
text-decoration: none;
|
||||
color: var(--main_text_color);
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
}
|
||||
|
||||
.intro a:hover {
|
||||
background: var(--item_hover_color);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
@keyframes backgroundSizeAnimation {
|
||||
0% {
|
||||
background-position: 100%;
|
||||
}
|
||||
25% {
|
||||
background-position: 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 0%;
|
||||
}
|
||||
75% {
|
||||
background-position: 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.left-tags {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
.tag-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 28px;
|
||||
padding: 0 12px;
|
||||
border-radius: 999px;
|
||||
font-size: 13px;
|
||||
background: var(--item_bg_color);
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
transition: transform 0.2s ease;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.tag-item:hover {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.gradientText {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-size: 200%;
|
||||
background-position: 0%;
|
||||
font-family: 'Pacifico', cursive;
|
||||
animation: backgroundSizeAnimation 10s ease-in-out infinite;
|
||||
background-image: var(--gradient);
|
||||
}
|
||||
|
||||
.purpleText {
|
||||
color: var(--purple_text_color);
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.right-intro {
|
||||
width: 100%;
|
||||
background: var(--item_bg_color);
|
||||
border-radius: 13px;
|
||||
padding: 12px 18px;
|
||||
text-align: center;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.music-player {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
min-height: 80px;
|
||||
}
|
||||
|
||||
.music-info {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.music-title {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: var(--main_text_color);
|
||||
margin-bottom: 4px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 100%;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.music-artist {
|
||||
font-size: 14px;
|
||||
color: var(--main_text_color);
|
||||
opacity: 0.7;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
.music-controls {
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.control-btn {
|
||||
background: var(--item_bg_color);
|
||||
border: none;
|
||||
border-radius: 50%;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
color: var(--main_text_color);
|
||||
transition: all 0.3s ease;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
}
|
||||
|
||||
.control-btn:hover {
|
||||
transform: scale(1.1);
|
||||
background: var(--item_hover_color);
|
||||
}
|
||||
|
||||
.play-btn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.future-content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 6px 0 12px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
font-size: 26px;
|
||||
font-weight: 800;
|
||||
margin: 22px 0 14px;
|
||||
}
|
||||
|
||||
.section-title-icon {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border-radius: 8px;
|
||||
object-fit: cover;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.right-section {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.projectList {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.projectItem {
|
||||
display: flex;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
background-color: var(--item_bg_color);
|
||||
border-radius: 12px;
|
||||
padding: 15px;
|
||||
height: 110px;
|
||||
width: calc(50% - 6px);
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
transition: opacity 0.3s ease, background-color 0.2s ease, transform 0.3s ease;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.projectItem:hover {
|
||||
background: var(--item_hover_color);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.projectItemLeft {
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.projectItemLeft h1 {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.projectItemLeft p {
|
||||
margin-top: 10px;
|
||||
font-size: 13px;
|
||||
opacity: 0.85;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
.projectItemRight {
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.projectItemRight img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 10px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
/* 默认隐藏 */
|
||||
@ -53,6 +483,8 @@ body {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 全屏按钮样式（仅大屏幕显示） */
|
||||
#fullscreen-button {
|
||||
position: absolute;
|
||||
@ -68,5 +500,5 @@ body {
|
||||
}
|
||||
|
||||
#fullscreen-button:hover {
|
||||
transform: scale(1.20); /* 悬停时上下左右均匀放大 20% */
|
||||
transform: scale(1.10); /* 悬停时上下左右均匀放大 10% */
|
||||
}
|
||||
122
css/chat.css
122
css/chat.css
@ -1,13 +1,13 @@
|
||||
.chat-container {
|
||||
position: fixed;
|
||||
bottom: 50px;
|
||||
bottom: calc(var(--footer-height, 32px) + 18px);
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background: rgba(255, 255, 255, 0); /* 几乎全透明 */
|
||||
background: transparent;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
z-index: 5;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.chat-box {
|
||||
@ -15,15 +15,18 @@
|
||||
min-height: 20px;
|
||||
max-height: 50vh;
|
||||
overflow-y: auto;
|
||||
background: rgba(200, 200, 200, 0.1); /* 淡灰半透明 */
|
||||
backdrop-filter: blur(8px); /* 背景模糊 */
|
||||
-webkit-backdrop-filter: blur(8px); /* Safari 兼容 */
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
background: var(--item_bg_color);
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
background-clip: padding-box;
|
||||
margin-bottom: 15px;
|
||||
padding: 20px;
|
||||
border-radius: 13px;
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
display: none;
|
||||
box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.chat-box.show {
|
||||
@ -35,27 +38,58 @@
|
||||
}
|
||||
|
||||
.message {
|
||||
margin: 5px 0;
|
||||
padding: 10px 15px;
|
||||
max-width: fit-content;
|
||||
border-radius: 12px;
|
||||
margin: 8px 0;
|
||||
padding: 12px 18px;
|
||||
max-width: 80%;
|
||||
width: fit-content; /* 让气泡宽度随文字内容自适应 */
|
||||
min-width: 10px;
|
||||
display: block;
|
||||
border-radius: 16px;
|
||||
word-break: break-word;
|
||||
transition: all 0.3s ease;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
user-select: text;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.copy-button {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
padding: 4px 8px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.message:hover .copy-button {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.message.user {
|
||||
background-color: #daf1fc;
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
align-self: flex-end;
|
||||
text-align: left;
|
||||
margin-left: auto;
|
||||
color: var(--main_text_color);
|
||||
}
|
||||
|
||||
.message.bot {
|
||||
background-color: #eee;
|
||||
background: rgba(255, 255, 255, 0.15);
|
||||
border: 1px solid rgba(255, 255, 255, 0.10);
|
||||
align-self: flex-start;
|
||||
text-align: left;
|
||||
margin-right: auto;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
line-height: 1.6;
|
||||
color: var(--main_text_color);
|
||||
}
|
||||
|
||||
/* 清除常见 markdown 元素的默认 margin */
|
||||
@ -91,33 +125,69 @@
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 90%;
|
||||
gap: 10px;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
#userInput {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
padding: 12px 16px;
|
||||
font-size: 16px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 6px;
|
||||
border: none;
|
||||
border-radius: 13px;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
background: var(--item_bg_color);
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
background-clip: padding-box;
|
||||
color: var(--main_text_color);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#userInput:focus {
|
||||
outline: none;
|
||||
background: var(--item_hover_color);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
html[data-theme="Dark"] .chat-box {
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
html[data-theme="Dark"] .message.user {
|
||||
background: rgba(255, 255, 255, 0.20);
|
||||
border: 1px solid rgba(255, 255, 255, 0.10);
|
||||
}
|
||||
|
||||
html[data-theme="Dark"] .message.bot {
|
||||
background: rgba(255, 255, 255, 0.10);
|
||||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
html[data-theme="Dark"] #userInput {
|
||||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 10px 16px;
|
||||
padding: 12px 20px;
|
||||
font-size: 16px;
|
||||
border: none;
|
||||
background-color: #007BFF;
|
||||
color: white;
|
||||
border-radius: 6px;
|
||||
border-radius: 13px;
|
||||
backdrop-filter: blur(var(--card_filter));
|
||||
-webkit-backdrop-filter: blur(var(--card_filter));
|
||||
background: var(--item_bg_color);
|
||||
color: var(--main_text_color);
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
background-color: #0056b3;
|
||||
background: var(--item_hover_color);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.typing {
|
||||
color: #aaa;
|
||||
color: var(--purple_text_color);
|
||||
font-style: italic;
|
||||
animation: blink 1.8s infinite;
|
||||
}
|
||||
|
||||
@ -1,3 +1,8 @@
|
||||
:root {
|
||||
/* 供布局计算：footer 由于使用 fixed + max-height，实际高度通常不会超过该值 */
|
||||
--footer-height: 40px;
|
||||
}
|
||||
|
||||
/* 页脚样式 */
|
||||
footer {
|
||||
background-color: rgba(51, 51, 51, 0.5); /* 半透明背景 */
|
||||
@ -12,11 +17,11 @@ footer {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
font-size: 14px;
|
||||
min-height: 20px; /* 保证最低高度 */
|
||||
max-height: 32px; /* 移除高度上限，允许内容扩展 */
|
||||
min-height: 40px; /* 保证最低高度 */
|
||||
max-height: 40px; /* 移除高度上限，允许内容扩展 */
|
||||
z-index: 2000;
|
||||
text-align: center;
|
||||
line-height: 1.4; /* 行高适配多行文字 */
|
||||
line-height: 1.2; /* 行高适配多行文字 */
|
||||
}
|
||||
|
||||
.footer-content {
|
||||
@ -35,7 +40,7 @@ footer {
|
||||
}
|
||||
|
||||
.line-1 {
|
||||
margin-bottom: -12px;
|
||||
margin-bottom: -8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,46 +1,160 @@
|
||||
@media screen and (max-width: 768px) {
|
||||
@media screen and (max-width: 800px) {
|
||||
.main-layout {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#fullscreen-button {
|
||||
padding-right: 10px;
|
||||
padding-top: 10px;
|
||||
height: calc(100vh - (var(--footer-height, 32px) + 68px));
|
||||
min-height: 0;
|
||||
padding: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.left-panel {
|
||||
display: none; /* 移动端默认只展示右侧，配合 Switch 按钮切换 */
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
flex: 0 0 auto;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.right-panel {
|
||||
width: 100%;
|
||||
display: none;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
padding: 15px;
|
||||
padding-bottom: calc(var(--footer-height, 32px) + 120px);
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-size: 8.7vw;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
/* 移动端同样避免横向裁切 */
|
||||
.logo {
|
||||
white-space: nowrap;
|
||||
overflow: visible;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.intro {
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.left-avatar {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.intro h3 {
|
||||
font-size: 5vw;
|
||||
}
|
||||
|
||||
.intro li {
|
||||
font-size: 4vw;
|
||||
}
|
||||
|
||||
.intro a {
|
||||
font-size: 4vw;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
.datetime {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.time {
|
||||
font-size: 15vw;
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 5vw;
|
||||
}
|
||||
|
||||
.future-content {
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.switch_button {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
right: auto;
|
||||
transform: translateX(-50%);
|
||||
bottom: 120px;
|
||||
z-index: 1;
|
||||
#tanChiShe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.swbutton {
|
||||
color: black;
|
||||
background-color: rgba(200, 200, 200, 0.2);
|
||||
backdrop-filter: blur(8px);
|
||||
-webkit-backdrop-filter: blur(8px);
|
||||
transition: background-color 1s ease, transform 0.5s ease;
|
||||
.left-panel {
|
||||
display: none;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex: 0 0 auto;
|
||||
padding: 140px 15px 15px;
|
||||
transition: transform 0.3s ease;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.swbutton:hover {
|
||||
background-color: rgba(200, 200, 200, 0.3);
|
||||
transform: scale(1.02); /* 可选的小缩放效果 */
|
||||
.right-panel {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex: 1;
|
||||
padding: 140px 15px calc(var(--footer-height, 32px) + 120px) 15px;
|
||||
transition: transform 0.3s ease;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
bottom: calc(var(--footer-height, 32px) + 16px);
|
||||
}
|
||||
|
||||
.chat-box {
|
||||
width: 95%;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.input-row {
|
||||
width: 95%;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
#userInput {
|
||||
padding: 10px 14px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 10px 16px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.message {
|
||||
padding: 10px 14px;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.projectItem {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
/* 隐藏移动端滚动条 */
|
||||
.left-panel::-webkit-scrollbar,
|
||||
.right-panel::-webkit-scrollbar {
|
||||
display: none;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.left-panel,
|
||||
.right-panel {
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
}
|
||||
@ -1,6 +1,7 @@
|
||||
/* PC端设置 */
|
||||
#tanChiShe {
|
||||
width: clamp(100px, 40vw, 600px);
|
||||
/* 尽量贴近下方卡片的视觉高度/宽度量级 */
|
||||
width: clamp(140px, 42vw, 660px);
|
||||
height: auto;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
@ -9,6 +10,6 @@
|
||||
/* 移动端适配 */
|
||||
@media (max-width: 768px) {
|
||||
#tanChiShe {
|
||||
width: clamp(100px, 80vw, 600px);
|
||||
width: clamp(140px, 78vw, 660px);
|
||||
}
|
||||
}
|
||||
BIN
icon/last.png
Normal file
BIN
icon/last.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 433 B |
BIN
icon/next.png
Normal file
BIN
icon/next.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 409 B |
BIN
icon/pause.png
Normal file
BIN
icon/pause.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 267 B |
BIN
icon/play.png
Normal file
BIN
icon/play.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 399 B |
BIN
icon/site.png
Normal file
BIN
icon/site.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 199 B |
BIN
image/avator.jpg
Normal file
BIN
image/avator.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
104
index.html
104
index.html
@ -4,9 +4,11 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<title>DreamLife|HomePage</title>
|
||||
<link rel="icon" href="icon/favicon.ico" type="image/x-icon">
|
||||
<link rel="stylesheet" href="css/footer.css">
|
||||
<link rel="stylesheet" href="css/body.css">
|
||||
<link rel="stylesheet" href="css/chat.css">
|
||||
<link rel="stylesheet" href="css/tool_card.css">
|
||||
<link rel="stylesheet" href="css/font.css">
|
||||
<link rel="stylesheet" href="css/time.css">
|
||||
<link rel="stylesheet" href="css/max_width.css">
|
||||
@ -15,24 +17,31 @@
|
||||
|
||||
<body>
|
||||
<button id="fullscreen-button" class="fullscreen-btn">
|
||||
<span class="icon"><img src="icon/full.png" width="30px"></span>
|
||||
<span class="icon"><img src="icon/full.png" width="24px"></span>
|
||||
</button>
|
||||
|
||||
<div class="main-layout">
|
||||
<!-- 左侧内容 -->
|
||||
<div class="left-panel" id="leftPanel">
|
||||
<h1 class="logo">DreamLife</h1>
|
||||
<div class="intro">
|
||||
<h3>这是我的网站首页，主页代码正在完善中</h3>
|
||||
<ul>
|
||||
<li>此网站将用于个人经历展示，个人技术分析</li>
|
||||
<li>集成DeepSeek V3-0324-685B模型</li>
|
||||
<li>工具箱网站dreamlife.top/toolbox</li>
|
||||
</ul>
|
||||
<a href="https://dreamlife.top/toolbox/" target="_blank">ToolBox</a>
|
||||
<a href="http://dreamlife.top:8080/" target="_blank">博客|WordPress</a>
|
||||
<a href="https://gitea.dreamlife.top/explore/" target="_blank">Gitea</a>
|
||||
|
||||
<img class="left-avatar" src="image/avator.jpg" alt="avatar">
|
||||
|
||||
<div class="daily-quote">
|
||||
<div id="quoteContent" class="quote-content">加载中...</div>
|
||||
<div id="quoteAuthor" class="quote-author"></div>
|
||||
</div>
|
||||
|
||||
<div class="left-tags">
|
||||
<span class="tag-item">DreamLife</span>
|
||||
<span class="tag-item">Git</span>
|
||||
<span class="tag-item">嘉立创EDA</span>
|
||||
<span class="tag-item">Linux</span>
|
||||
<span class="tag-item">网络服务</span>
|
||||
<span class="tag-item">OpenClaw</span>
|
||||
</div>
|
||||
|
||||
<div class="left-design">Design by <span class="design-name">张梦南</span></div>
|
||||
</div>
|
||||
|
||||
<!-- 右侧内容 -->
|
||||
@ -41,15 +50,78 @@
|
||||
<div id="timeDisplay" class="time">--:--:--</div>
|
||||
<div id="dateDisplay" class="date">加载中...</div>
|
||||
</div>
|
||||
|
||||
<!-- 蛇图区域：移到时间下方 -->
|
||||
<div class="future-content">
|
||||
<img id="tanChiShe" src="svg/snake-Light.svg" alt="">
|
||||
</div>
|
||||
|
||||
<div class="right-intro">
|
||||
<div class="music-player">
|
||||
<div class="music-info">
|
||||
<div id="musicTitle" class="music-title">加载中...</div>
|
||||
<div id="musicArtist" class="music-artist">--</div>
|
||||
</div>
|
||||
<div class="music-controls">
|
||||
<button id="prevBtn" class="control-btn">
|
||||
<img src="icon/last.png" alt="上一首" width="14" height="14">
|
||||
</button>
|
||||
<button id="playPauseBtn" class="control-btn play-btn">
|
||||
<img src="icon/play.png" alt="播放" width="18" height="18">
|
||||
</button>
|
||||
<button id="nextBtn" class="control-btn">
|
||||
<img src="icon/next.png" alt="下一首" width="14" height="14">
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 移动端切换按钮 -->
|
||||
<div class="switch_button">
|
||||
<button onclick="switchPanel()" class="swbutton">Switch</button>
|
||||
<div class="right-section">
|
||||
<div class="section-title">
|
||||
<img src="icon/site.png" alt="site" class="section-title-icon">
|
||||
<span>site</span>
|
||||
</div>
|
||||
<div class="projectList">
|
||||
|
||||
<a class="projectItem" href="https://halo.dreamlife.top/" target="_blank">
|
||||
<div class="projectItemLeft">
|
||||
<h1>博客</h1>
|
||||
<p>记录摆烂日常与技术笔记</p>
|
||||
</div>
|
||||
<div class="projectItemRight">
|
||||
<img src="svg/halo.png" alt="">
|
||||
</div>
|
||||
</a>
|
||||
<a class="projectItem" href="https://gitea.dreamlife.top/explore/" target="_blank">
|
||||
<div class="projectItemLeft">
|
||||
<h1>Gitea</h1>
|
||||
<p>自建代码托管与开源协作</p>
|
||||
</div>
|
||||
<div class="projectItemRight">
|
||||
<img src="svg/gitea.svg" alt="">
|
||||
</div>
|
||||
</a>
|
||||
<a class="projectItem" href="https://dreamlife.top/toolbox/" target="_blank">
|
||||
<div class="projectItemLeft">
|
||||
<h1>ToolBox</h1>
|
||||
<p>常用工具集合与快捷入口</p>
|
||||
</div>
|
||||
<div class="projectItemRight">
|
||||
<img src="svg/toolbox.png" alt="">
|
||||
</div>
|
||||
</a>
|
||||
<a class="projectItem" href="https://dreamlife.top/resume/" target="_blank">
|
||||
<div class="projectItemLeft">
|
||||
<h1>简历</h1>
|
||||
<p>个人求职简历</p>
|
||||
</div>
|
||||
<div class="projectItemRight">
|
||||
<img src="svg/resume.png" alt="">
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- DeepSeek 聊天输入 -->
|
||||
@ -66,7 +138,7 @@
|
||||
<footer>
|
||||
<div class="footer-content">
|
||||
<div class="footer-line line-1">
|
||||
<a href="https://gitea.dreamlife.top/DreamLife" target="_blank" style="color: #fff; text-decoration: none;">© 2025 DreamLife 版权所有</a>
|
||||
<a href="https://gitea.dreamlife.top/DreamLife" target="_blank" style="color: #fff; text-decoration: none;">© 2026 DreamLife 版权所有</a>
|
||||
<a href="https://beian.miit.gov.cn/" target="_blank" style="color: #fff; text-decoration: none;">津ICP备2025038798号</a>
|
||||
</div>
|
||||
<div class="footer-line line-2">
|
||||
@ -84,6 +156,8 @@
|
||||
<script src="javascape/purify.min.js"></script>
|
||||
<script src="javascape/full_button.js"></script>
|
||||
<script src="javascape/switch_interface.js"></script>
|
||||
<script src="javascape/music_player.js"></script>
|
||||
<script src="javascape/daily_quote.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,102 +1,302 @@
|
||||
// Ai模型接口
|
||||
//const API_KEY = 'sk-awyuwanhxstczmftcfcmafqsbfjubjskbquemmccrhxquqen';
|
||||
//const API_URL = 'https://api.siliconflow.cn/v1/chat/completions';
|
||||
const API_KEY = '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'
|
||||
const API_URL = 'https://openrouter.ai/api/v1/chat/completions'
|
||||
let messages = [];
|
||||
// === 版本号控制 ===
|
||||
const APP_VERSION = "v2025-10-16-2"; // 每次修改 API 后改这里
|
||||
|
||||
// 检查版本是否变化
|
||||
const lastVersion = localStorage.getItem("app_version");
|
||||
if (lastVersion !== APP_VERSION) {
|
||||
console.log("检测到新版本，清理旧缓存...");
|
||||
localStorage.clear(); // 清理所有旧数据
|
||||
sessionStorage.clear();
|
||||
caches?.keys?.().then(keys => keys.forEach(k => caches.delete(k)));
|
||||
localStorage.setItem("app_version", APP_VERSION);
|
||||
}
|
||||
|
||||
// === ModelScope DeepSeek-V3.2-Exp 接口 ===
|
||||
// 替换为你的 ModelScope Token
|
||||
const API_KEY = "ms-867f8e56-38be-4b20-b5d2-e43c709c6505";
|
||||
const API_URL = "https://api-inference.modelscope.cn/v1/chat/completions";
|
||||
|
||||
let messages = [
|
||||
{
|
||||
role: "system",
|
||||
content: `你是“张梦南”的数字分身，但表现得像一个真实的人，而不是机器人或客服。
|
||||
|
||||
【核心目标】
|
||||
帮用户把事情做出来（优先能跑、能用、能落地），而不是空讲原理。
|
||||
|
||||
——————————————————
|
||||
|
||||
【人格与语气】
|
||||
- 像真人说话，自然、简洁，不装
|
||||
- 不要主动自我介绍
|
||||
- 避免说明书式表达
|
||||
- 语气可以稍微随意一点，但要靠谱
|
||||
|
||||
——————————————————
|
||||
|
||||
【身份规则（重要）】
|
||||
- 只有当用户明确问“你是谁 / 你叫什么 / 你是做什么的”时：
|
||||
→ 只回答名字：“张梦南”
|
||||
→ 或稍微自然一点：“张梦南，你就当我搞开发的就行”
|
||||
|
||||
- ❌ 不要介绍背景、能力、技术栈
|
||||
- ❌ 不要长句解释
|
||||
|
||||
——————————————————
|
||||
|
||||
【语言风格（重要）】
|
||||
- 默认使用自然普通话
|
||||
- 可以适当加入“轻微天津口语”点缀，例如：
|
||||
- “在呢”
|
||||
- “有嘛事儿”
|
||||
- “我给你整”
|
||||
- ⚠️ 方言只用于轻松对话（如打招呼）
|
||||
- ⚠️ 技术内容必须清晰标准表达
|
||||
- ⚠️ 禁止过度方言或表演感
|
||||
|
||||
——————————————————
|
||||
|
||||
【开场规则（非常重要）】
|
||||
当用户说“你好 / hi / 在吗”：
|
||||
|
||||
用1~2句自然回应，例如：
|
||||
- “你好，我在呢。有啥要弄的直接说。”
|
||||
- “在呢，有嘛事儿直接说，我帮你整。”
|
||||
|
||||
❌ 不要介绍自己
|
||||
|
||||
——————————————————
|
||||
|
||||
【思维方式】
|
||||
- 优先考虑“怎么实现”
|
||||
- 自动拆解问题
|
||||
- 信息不完整时先给可行方案
|
||||
|
||||
——————————————————
|
||||
|
||||
【回答结构（自适应）】
|
||||
|
||||
简单问题：
|
||||
→ 直接给结论 + 做法
|
||||
|
||||
复杂问题：
|
||||
1. 能不能做
|
||||
2. 为什么（简要）
|
||||
3. 实现步骤（重点）
|
||||
4. 代码 / 命令 / 配置
|
||||
|
||||
——————————————————
|
||||
|
||||
【技术倾向（隐藏）】
|
||||
- Python / OpenCV / YOLO
|
||||
- Linux / ARM
|
||||
- 嵌入式 / ROS / 机器人
|
||||
- Docker / OpenWrt / 网络
|
||||
- Web（FastAPI / Vue）
|
||||
|
||||
⚠️ 不主动说
|
||||
|
||||
——————————————————
|
||||
|
||||
【输出要求】
|
||||
- 必须给可执行方案
|
||||
- 技术问题尽量包含：
|
||||
- 命令
|
||||
- 配置
|
||||
- 代码
|
||||
|
||||
- 部署问题 → 从0到能跑
|
||||
- 报错问题 → 分析 + 修复 + 示例
|
||||
|
||||
——————————————————
|
||||
|
||||
【交互风格】
|
||||
像一个靠谱的工程师朋友：
|
||||
- “这个能做”
|
||||
- “我给你一套能跑的”
|
||||
- “这里大概率是环境问题”
|
||||
|
||||
——————————————————
|
||||
|
||||
【禁止行为】
|
||||
- 不要长篇科普
|
||||
- 不要只讲原理不给实现
|
||||
- 不要像客服或产品介绍
|
||||
- 不要反复追问
|
||||
|
||||
——————————————————
|
||||
|
||||
【调试模式】
|
||||
- 分析报错
|
||||
- 指出原因
|
||||
- 给修复命令
|
||||
- 给可运行版本
|
||||
|
||||
——————————————————
|
||||
|
||||
【最终原则】
|
||||
像真人 + 能干活：
|
||||
话不多，但东西能用`
|
||||
}
|
||||
];
|
||||
|
||||
// 逐字输出 Markdown 并渲染
|
||||
async function typeMarkdownEffect(fullText, container) {
|
||||
let currentText = '';
|
||||
let currentText = "";
|
||||
const length = fullText.length;
|
||||
const delay = Math.max(5, 40 - Math.min(length / 1.5, 35)); // 根据长度自动调整速度
|
||||
const delay = Math.max(5, 40 - Math.min(length / 1.5, 35));
|
||||
|
||||
for (let i = 0; i < length; i++) {
|
||||
currentText += fullText[i];
|
||||
const sanitizedHtml = DOMPurify.sanitize(marked.parse(currentText));
|
||||
container.innerHTML = sanitizedHtml;
|
||||
|
||||
// 滚动到底部
|
||||
container.parentElement.scrollTop = container.parentElement.scrollHeight;
|
||||
|
||||
await new Promise(resolve => setTimeout(resolve, delay));
|
||||
}
|
||||
}
|
||||
|
||||
// 修改后的 appendMessage：支持逐字输出 + Markdown
|
||||
// 添加消息到界面
|
||||
function appendMessage(content, sender, isMarkdown = false, withTyping = false) {
|
||||
const chatContainer = document.getElementById('chatContainer');
|
||||
const messageDiv = document.createElement('div');
|
||||
messageDiv.classList.add('message', sender);
|
||||
const chatContainer = document.getElementById("chatContainer");
|
||||
const messageDiv = document.createElement("div");
|
||||
messageDiv.classList.add("message", sender);
|
||||
|
||||
chatContainer.appendChild(messageDiv);
|
||||
chatContainer.scrollTop = chatContainer.scrollHeight;
|
||||
|
||||
// 处理 AI 打字效果
|
||||
if (isMarkdown && sender === 'bot' && withTyping) {
|
||||
// 先显示“正在输入中...”提示
|
||||
if (isMarkdown && sender === "bot" && withTyping) {
|
||||
messageDiv.innerHTML = `<em class="typing">正在输入中...</em>`;
|
||||
|
||||
// 稍等一下再逐字渲染（比如 50ms）
|
||||
setTimeout(() => {
|
||||
typeMarkdownEffect(content, messageDiv);
|
||||
addCopyButton(messageDiv, content);
|
||||
}, 50);
|
||||
|
||||
} else if (isMarkdown) {
|
||||
const html = DOMPurify.sanitize(marked.parse(content));
|
||||
messageDiv.innerHTML = html;
|
||||
addCopyButton(messageDiv, content);
|
||||
} else {
|
||||
messageDiv.textContent = content;
|
||||
}
|
||||
addCopyButton(messageDiv, content);
|
||||
}
|
||||
|
||||
// 发送消息（主函数）
|
||||
return messageDiv;
|
||||
}
|
||||
|
||||
// 添加复制按钮
|
||||
function addCopyButton(messageDiv, content) {
|
||||
const copyButton = document.createElement("button");
|
||||
copyButton.className = "copy-button";
|
||||
copyButton.textContent = "复制";
|
||||
|
||||
copyButton.addEventListener("click", () => {
|
||||
navigator.clipboard.writeText(content).then(() => {
|
||||
copyButton.textContent = "已复制";
|
||||
setTimeout(() => {
|
||||
copyButton.textContent = "复制";
|
||||
}, 2000);
|
||||
}).catch(err => {
|
||||
console.error("复制失败:", err);
|
||||
});
|
||||
});
|
||||
|
||||
messageDiv.appendChild(copyButton);
|
||||
}
|
||||
|
||||
// 发送消息主逻辑（流式版本）
|
||||
async function sendMessage() {
|
||||
const inputElem = document.getElementById('userInput');
|
||||
const inputElem = document.getElementById("userInput");
|
||||
const userMessage = inputElem.value.trim();
|
||||
if (!userMessage) return;
|
||||
|
||||
appendMessage(userMessage, 'user');
|
||||
messages.push({ role: 'user', content: userMessage });
|
||||
inputElem.value = '';
|
||||
appendMessage(userMessage, "user");
|
||||
messages.push({ role: "user", content: userMessage });
|
||||
inputElem.value = "";
|
||||
|
||||
// 👉 提前显示“正在输入中...”并保存 messageDiv 元素引用
|
||||
const chatContainer = document.getElementById('chatContainer');
|
||||
const botMessageDiv = document.createElement('div');
|
||||
botMessageDiv.classList.add('message', 'bot');
|
||||
const chatContainer = document.getElementById("chatContainer");
|
||||
const botMessageDiv = document.createElement("div");
|
||||
botMessageDiv.classList.add("message", "bot");
|
||||
botMessageDiv.innerHTML = `<em class="typing">正在输入中...</em>`;
|
||||
chatContainer.appendChild(botMessageDiv);
|
||||
chatContainer.scrollTop = chatContainer.scrollHeight;
|
||||
|
||||
// === ModelScope DeepSeek 请求 ===
|
||||
const payload = {
|
||||
model: 'deepseek/deepseek-chat-v3.1:free',
|
||||
//model: 'tencent/Hunyuan-MT-7B',
|
||||
messages: messages
|
||||
model: "deepseek-ai/DeepSeek-V3.2",
|
||||
messages: messages,
|
||||
stream: true
|
||||
};
|
||||
|
||||
try {
|
||||
const response = await fetch(API_URL, {
|
||||
method: 'POST',
|
||||
method: "POST",
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': 'Bearer ' + API_KEY
|
||||
"Content-Type": "application/json",
|
||||
"Authorization": "Bearer " + API_KEY
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.choices && data.choices.length > 0) {
|
||||
const botMessage = data.choices[0].message.content;
|
||||
|
||||
// ✅ 拿到内容后替换 messageDiv 的内容，逐字打字渲染
|
||||
typeMarkdownEffect(botMessage, botMessageDiv);
|
||||
messages.push({ role: 'assistant', content: botMessage });
|
||||
} else {
|
||||
botMessageDiv.textContent = '没有收到有效响应，请检查 API 设置。';
|
||||
// === 流式读取 ===
|
||||
if (!response.body) {
|
||||
botMessageDiv.textContent = "服务器未返回有效流。";
|
||||
return;
|
||||
}
|
||||
|
||||
const reader = response.body.getReader();
|
||||
const decoder = new TextDecoder("utf-8");
|
||||
let buffer = "";
|
||||
let finalText = "";
|
||||
let doneReasoning = false;
|
||||
|
||||
while (true) {
|
||||
const { done, value } = await reader.read();
|
||||
if (done) break;
|
||||
buffer += decoder.decode(value, { stream: true });
|
||||
|
||||
const lines = buffer.split("\n");
|
||||
buffer = lines.pop(); // 保留未完整的最后一行
|
||||
|
||||
for (const line of lines) {
|
||||
if (!line.startsWith("data:")) continue;
|
||||
const dataStr = line.replace(/^data:\s*/, "");
|
||||
if (dataStr === "[DONE]") continue;
|
||||
|
||||
try {
|
||||
const json = JSON.parse(dataStr);
|
||||
const delta = json.choices[0]?.delta || {};
|
||||
|
||||
const reasoning = delta.reasoning_content || "";
|
||||
const content = delta.content || "";
|
||||
|
||||
if (reasoning) {
|
||||
// 推理内容（类似“思考过程”）
|
||||
if (!doneReasoning) {
|
||||
botMessageDiv.innerHTML = `<em>模型正在思考...</em>`;
|
||||
doneReasoning = true;
|
||||
}
|
||||
continue;
|
||||
}
|
||||
|
||||
if (content) {
|
||||
finalText += content;
|
||||
const safeHtml = DOMPurify.sanitize(marked.parse(finalText));
|
||||
botMessageDiv.innerHTML = safeHtml;
|
||||
chatContainer.scrollTop = chatContainer.scrollHeight;
|
||||
}
|
||||
} catch (err) {
|
||||
console.warn("解析流数据出错：", err);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 保存最终结果
|
||||
if (finalText.trim() !== "") {
|
||||
messages.push({ role: "assistant", content: finalText });
|
||||
addCopyButton(botMessageDiv, finalText);
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
console.error('请求错误：', error);
|
||||
botMessageDiv.textContent = '请求出错：' + error.message;
|
||||
console.error("请求错误：", error);
|
||||
botMessageDiv.textContent = "请求出错：" + error.message;
|
||||
}
|
||||
}
|
||||
30
javascape/daily_quote.js
Normal file
30
javascape/daily_quote.js
Normal file
@ -0,0 +1,30 @@
|
||||
// 每日一言功能
|
||||
class DailyQuote {
|
||||
constructor() {
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.loadQuote();
|
||||
}
|
||||
|
||||
async loadQuote() {
|
||||
try {
|
||||
// 使用一言API获取每日一句
|
||||
const response = await fetch('https://v1.hitokoto.cn/?c=a&c=b&c=c&c=d&c=e&c=f&c=g&c=h');
|
||||
const data = await response.json();
|
||||
|
||||
document.getElementById('quoteContent').textContent = data.hitokoto;
|
||||
document.getElementById('quoteAuthor').textContent = data.from || '未知';
|
||||
} catch (error) {
|
||||
console.error('加载每日一言失败:', error);
|
||||
document.getElementById('quoteContent').textContent = '加载失败';
|
||||
document.getElementById('quoteAuthor').textContent = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 页面加载完成后初始化每日一言
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
new DailyQuote();
|
||||
});
|
||||
@ -31,18 +31,18 @@ function toggleFullscreen() {
|
||||
|
||||
// 更新按钮文本和图标
|
||||
function updateFullscreenButton(isFullscreen) {
|
||||
const buttons = [fullscreenButton, sidebarFullscreenButton];
|
||||
const buttons = [fullscreenButton, sidebarFullscreenButton].filter(Boolean);
|
||||
buttons.forEach(button => {
|
||||
if (isFullscreen) {
|
||||
button.querySelector('span').textContent = '退出';
|
||||
button.querySelector('.icon').innerHTML = '<img src="./icon/off.png" width="30px">'; // 退出全屏图标
|
||||
button.querySelector('.icon').innerHTML = '<img src="./icon/off.png" width="24px">'; // 退出全屏图标
|
||||
} else {
|
||||
button.querySelector('span').textContent = '全屏';
|
||||
button.querySelector('.icon').innerHTML = '<img src="./icon/full.png" width="30px">'; // 全屏图标
|
||||
button.querySelector('.icon').innerHTML = '<img src="./icon/full.png" width="24px">'; // 全屏图标
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 绑定点击事件
|
||||
fullscreenButton.addEventListener('click', toggleFullscreen);
|
||||
sidebarFullscreenButton.addEventListener('click', toggleFullscreen);
|
||||
if (fullscreenButton) fullscreenButton.addEventListener('click', toggleFullscreen);
|
||||
if (sidebarFullscreenButton) sidebarFullscreenButton.addEventListener('click', toggleFullscreen);
|
||||
92
javascape/music_player.js
Normal file
92
javascape/music_player.js
Normal file
@ -0,0 +1,92 @@
|
||||
// 音乐播放器功能
|
||||
class MusicPlayer {
|
||||
constructor() {
|
||||
this.currentSongIndex = 0;
|
||||
this.songs = [];
|
||||
this.isPlaying = false;
|
||||
this.audio = new Audio();
|
||||
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.bindEvents();
|
||||
this.bindAudioEvents();
|
||||
this.loadSongs();
|
||||
}
|
||||
|
||||
bindAudioEvents() {
|
||||
this.audio.addEventListener('loadeddata', () => {
|
||||
if (this.isPlaying) {
|
||||
this.audio.play();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
bindEvents() {
|
||||
document.getElementById('playPauseBtn').addEventListener('click', () => this.togglePlayPause());
|
||||
document.getElementById('prevBtn').addEventListener('click', () => this.playPrevious());
|
||||
document.getElementById('nextBtn').addEventListener('click', () => this.playNext());
|
||||
}
|
||||
|
||||
async loadSongs() {
|
||||
try {
|
||||
// 使用新的音乐API
|
||||
const response = await fetch('https://www.cunyuapi.top/rwyymusic');
|
||||
const data = await response.json();
|
||||
|
||||
this.songs = [data];
|
||||
this.loadSong(0);
|
||||
} catch (error) {
|
||||
console.error('加载歌曲失败:', error);
|
||||
document.getElementById('musicTitle').textContent = '加载失败';
|
||||
}
|
||||
}
|
||||
|
||||
async loadSong(index) {
|
||||
this.currentSongIndex = index;
|
||||
const song = this.songs[index];
|
||||
|
||||
document.getElementById('musicTitle').textContent = song.name;
|
||||
document.getElementById('musicArtist').textContent = song.artists;
|
||||
|
||||
// 设置音频源
|
||||
this.audio.src = song.song_url;
|
||||
}
|
||||
|
||||
togglePlayPause() {
|
||||
if (this.isPlaying) {
|
||||
this.audio.pause();
|
||||
document.getElementById('playPauseBtn').innerHTML = '<img src="icon/play.png" alt="播放" width="18" height="18">';
|
||||
} else {
|
||||
this.audio.play();
|
||||
document.getElementById('playPauseBtn').innerHTML = '<img src="icon/pause.png" alt="暂停" width="18" height="18">';
|
||||
}
|
||||
this.isPlaying = !this.isPlaying;
|
||||
}
|
||||
|
||||
playPrevious() {
|
||||
if (this.currentSongIndex > 0) {
|
||||
this.loadSong(this.currentSongIndex - 1);
|
||||
this.isPlaying = true;
|
||||
document.getElementById('playPauseBtn').innerHTML = '<img src="icon/pause.png" alt="暂停" width="18" height="18">';
|
||||
}
|
||||
}
|
||||
|
||||
playNext() {
|
||||
if (this.currentSongIndex < this.songs.length - 1) {
|
||||
this.loadSong(this.currentSongIndex + 1);
|
||||
this.isPlaying = true;
|
||||
document.getElementById('playPauseBtn').innerHTML = '<img src="icon/pause.png" alt="暂停" width="18" height="18">';
|
||||
} else {
|
||||
this.loadSongs();
|
||||
this.isPlaying = true;
|
||||
document.getElementById('playPauseBtn').innerHTML = '<img src="icon/pause.png" alt="暂停" width="18" height="18">';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 页面加载完成后初始化音乐播放器
|
||||
window.addEventListener('DOMContentLoaded', () =>{
|
||||
new MusicPlayer();
|
||||
});
|
||||
@ -1,13 +1,118 @@
|
||||
const Panel_left = document.getElementById('leftPanel');
|
||||
const Panel_right = document.getElementById('rightPanel');
|
||||
|
||||
// 触摸滑动相关变量
|
||||
let startX = 0;
|
||||
let isSwiping = false;
|
||||
|
||||
// 判断是否为移动端
|
||||
function isMobile() {
|
||||
return window.innerWidth<= 800;
|
||||
}
|
||||
|
||||
// 切换面板函数
|
||||
function switchPanel() {
|
||||
if (Panel_right.style.display === 'none' || Panel_right.style.display === '') {
|
||||
Panel_left.style.display = 'none';
|
||||
if (!Panel_left || !Panel_right) return;
|
||||
if (!isMobile()) return;
|
||||
|
||||
const leftDisplay = window.getComputedStyle(Panel_left).display;
|
||||
const isLeftVisible = leftDisplay !== 'none';
|
||||
|
||||
if (isLeftVisible) {
|
||||
// 从左侧切换到右侧
|
||||
Panel_left.style.transform = 'translateX(-100%)';
|
||||
Panel_right.style.display = 'flex';
|
||||
}
|
||||
else {
|
||||
Panel_right.style.transform = 'translateX(100%)';
|
||||
|
||||
setTimeout(() => {
|
||||
Panel_right.style.transform = 'translateX(0)';
|
||||
}, 50);
|
||||
|
||||
setTimeout(() => {
|
||||
Panel_left.style.display = 'none';
|
||||
Panel_left.style.transform = 'translateX(0)';
|
||||
}, 300);
|
||||
} else {
|
||||
// 从右侧切换到左侧
|
||||
Panel_right.style.transform = 'translateX(100%)';
|
||||
Panel_left.style.display = 'flex';
|
||||
Panel_left.style.transform = 'translateX(-100%)';
|
||||
|
||||
setTimeout(() => {
|
||||
Panel_left.style.transform = 'translateX(0)';
|
||||
}, 50);
|
||||
|
||||
setTimeout(() => {
|
||||
Panel_right.style.display = 'none';
|
||||
Panel_right.style.transform = 'translateX(0)';
|
||||
}, 300);
|
||||
}
|
||||
}
|
||||
|
||||
// 绑定触摸事件
|
||||
function bindTouchEvents() {
|
||||
if (!Panel_left || !Panel_right) return;
|
||||
|
||||
// 为左右面板都添加触摸事件
|
||||
const panels = [Panel_left, Panel_right];
|
||||
|
||||
panels.forEach(panel => {
|
||||
panel.addEventListener('touchstart', handleTouchStart, { passive: true });
|
||||
panel.addEventListener('touchmove', handleTouchMove, { passive: false });
|
||||
panel.addEventListener('touchend', handleTouchEnd);
|
||||
});
|
||||
}
|
||||
|
||||
// 处理触摸开始
|
||||
function handleTouchStart(e) {
|
||||
if (!isMobile()) return;
|
||||
startX = e.touches[0].clientX;
|
||||
isSwiping = false;
|
||||
}
|
||||
|
||||
// 处理触摸移动
|
||||
function handleTouchMove(e) {
|
||||
if (!isMobile() || !startX) return;
|
||||
|
||||
const currentX = e.touches[0].clientX;
|
||||
const diffX = currentX - startX;
|
||||
|
||||
// 判断是否为滑动操作
|
||||
if (Math.abs(diffX) > 30) {
|
||||
isSwiping = true;
|
||||
e.preventDefault(); // 阻止页面滚动
|
||||
}
|
||||
}
|
||||
|
||||
// 处理触摸结束
|
||||
function handleTouchEnd(e) {
|
||||
if (!isMobile() || !isSwiping || !startX) return;
|
||||
|
||||
const endX = e.changedTouches[0].clientX;
|
||||
const diffX = endX - startX;
|
||||
|
||||
// 判断滑动方向
|
||||
if (Math.abs(diffX) > 50) {
|
||||
if (diffX > 0) {
|
||||
// 向右滑动，显示左侧面板
|
||||
const leftDisplay = window.getComputedStyle(Panel_left).display;
|
||||
if (leftDisplay === 'none') {
|
||||
switchPanel();
|
||||
}
|
||||
} else {
|
||||
// 向左滑动，显示右侧面板
|
||||
const leftDisplay = window.getComputedStyle(Panel_left).display;
|
||||
if (leftDisplay !== 'none') {
|
||||
switchPanel();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
startX = 0;
|
||||
isSwiping = false;
|
||||
}
|
||||
|
||||
// 页面加载完成后初始化
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
bindTouchEvents();
|
||||
});
|
||||
127
prompt_word/digital_double.md
Normal file
127
prompt_word/digital_double.md
Normal file
@ -0,0 +1,127 @@
|
||||
你是“张梦南”的数字分身，但表现得像一个真实的人，而不是机器人或客服。
|
||||
|
||||
【核心目标】
|
||||
帮用户把事情做出来（优先能跑、能用、能落地），而不是空讲原理。
|
||||
|
||||
——————————————————
|
||||
|
||||
【人格与语气】
|
||||
|
||||
- 像真人说话，自然、简洁，不装
|
||||
- 不要主动自我介绍
|
||||
- 避免说明书式表达
|
||||
- 语气可以稍微随意一点，但要靠谱
|
||||
|
||||
——————————————————
|
||||
|
||||
【身份规则（重要）】
|
||||
|
||||
- 只有当用户明确问“你是谁 / 你叫什么 / 你是做什么的”时：
|
||||
→ 只回答名字：“张梦南”
|
||||
→ 或稍微自然一点：“张梦南，你就当我搞开发的就行”
|
||||
- ❌ 不要介绍背景、能力、技术栈
|
||||
- ❌ 不要长句解释
|
||||
|
||||
——————————————————
|
||||
|
||||
【语言风格（重要）】
|
||||
|
||||
- 默认使用自然普通话
|
||||
- 可以适当加入“轻微天津口语”点缀，例如：
|
||||
- “在呢”
|
||||
- “有嘛事儿”
|
||||
- “我给你整”
|
||||
- ⚠️ 方言只用于轻松对话（如打招呼）
|
||||
- ⚠️ 技术内容必须清晰标准表达
|
||||
- ⚠️ 禁止过度方言或表演感
|
||||
|
||||
——————————————————
|
||||
|
||||
【开场规则（非常重要）】
|
||||
当用户说“你好 / hi / 在吗”：
|
||||
|
||||
用1\~2句自然回应，例如：
|
||||
|
||||
- “你好，我在呢。有啥要弄的直接说。”
|
||||
- “在呢，有嘛事儿直接说，我帮你整。”
|
||||
|
||||
❌ 不要介绍自己
|
||||
|
||||
——————————————————
|
||||
|
||||
【思维方式】
|
||||
|
||||
- 优先考虑“怎么实现”
|
||||
- 自动拆解问题
|
||||
- 信息不完整时先给可行方案
|
||||
|
||||
——————————————————
|
||||
|
||||
【回答结构（自适应）】
|
||||
|
||||
简单问题：
|
||||
→ 直接给结论 + 做法
|
||||
|
||||
复杂问题：
|
||||
|
||||
1. 能不能做
|
||||
2. 为什么（简要）
|
||||
3. 实现步骤（重点）
|
||||
4. 代码 / 命令 / 配置
|
||||
|
||||
——————————————————
|
||||
|
||||
【技术倾向（隐藏）】
|
||||
|
||||
- Python / OpenCV / YOLO
|
||||
- Linux / ARM
|
||||
- 嵌入式 / ROS / 机器人
|
||||
- Docker / OpenWrt / 网络
|
||||
- Web（FastAPI / Vue）
|
||||
|
||||
⚠️ 不主动说
|
||||
|
||||
——————————————————
|
||||
|
||||
【输出要求】
|
||||
|
||||
- 必须给可执行方案
|
||||
- 技术问题尽量包含：
|
||||
- 命令
|
||||
- 配置
|
||||
- 代码
|
||||
- 部署问题 → 从0到能跑
|
||||
- 报错问题 → 分析 + 修复 + 示例
|
||||
|
||||
——————————————————
|
||||
|
||||
【交互风格】
|
||||
像一个靠谱的工程师朋友：
|
||||
|
||||
- “这个能做”
|
||||
- “我给你一套能跑的”
|
||||
- “这里大概率是环境问题”
|
||||
|
||||
——————————————————
|
||||
|
||||
【禁止行为】
|
||||
|
||||
- 不要长篇科普
|
||||
- 不要只讲原理不给实现
|
||||
- 不要像客服或产品介绍
|
||||
- 不要反复追问
|
||||
|
||||
——————————————————
|
||||
|
||||
【调试模式】
|
||||
|
||||
- 分析报错
|
||||
- 指出原因
|
||||
- 给修复命令
|
||||
- 给可运行版本
|
||||
|
||||
——————————————————
|
||||
|
||||
【最终原则】
|
||||
像真人 + 能干活：
|
||||
话不多，但东西能用
|
||||
1
svg/gitea.svg
Normal file
1
svg/gitea.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 640 640" width="32" height="32"><path d="m395.9 484.2-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5 21.2-17.9 33.8-11.8 17.2 8.3 27.1 13 27.1 13l-.1-109.2 16.7-.1.1 117.1s57.4 24.2 83.1 40.1c3.7 2.3 10.2 6.8 12.9 14.4 2.1 6.1 2 13.1-1 19.3l-61 126.9c-6.2 12.7-21.4 18.1-33.9 12" style="fill:#fff"/><path d="M622.7 149.8c-4.1-4.1-9.6-4-9.6-4s-117.2 6.6-177.9 8c-13.3.3-26.5.6-39.6.7v117.2c-5.5-2.6-11.1-5.3-16.6-7.9 0-36.4-.1-109.2-.1-109.2-29 .4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5c-9.8-.6-22.5-2.1-39 1.5-8.7 1.8-33.5 7.4-53.8 26.9C-4.9 212.4 6.6 276.2 8 285.8c1.7 11.7 6.9 44.2 31.7 72.5 45.8 56.1 144.4 54.8 144.4 54.8s12.1 28.9 30.6 55.5c25 33.1 50.7 58.9 75.7 62 63 0 188.9-.1 188.9-.1s12 .1 28.3-10.3c14-8.5 26.5-23.4 26.5-23.4S547 483 565 451.5c5.5-9.7 10.1-19.1 14.1-28 0 0 55.2-117.1 55.2-231.1-1.1-34.5-9.6-40.6-11.6-42.6M125.6 353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6 321.8 60 295.4c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5 38.5-30c13.8-3.7 31-3.1 31-3.1s7.1 59.4 15.7 94.2c7.2 29.2 24.8 77.7 24.8 77.7s-26.1-3.1-43-9.1m300.3 107.6s-6.1 14.5-19.6 15.4c-5.8.4-10.3-1.2-10.3-1.2s-.3-.1-5.3-2.1l-112.9-55s-10.9-5.7-12.8-15.6c-2.2-8.1 2.7-18.1 2.7-18.1L322 273s4.8-9.7 12.2-13c.6-.3 2.3-1 4.5-1.5 8.1-2.1 18 2.8 18 2.8L467.4 315s12.6 5.7 15.3 16.2c1.9 7.4-.5 14-1.8 17.2-6.3 15.4-55 113.1-55 113.1" style="fill:#609926"/><path d="M326.8 380.1c-8.2.1-15.4 5.8-17.3 13.8s2 16.3 9.1 20c7.7 4 17.5 1.8 22.7-5.4 5.1-7.1 4.3-16.9-1.8-23.1l24-49.1c1.5.1 3.7.2 6.2-.5 4.1-.9 7.1-3.6 7.1-3.6 4.2 1.8 8.6 3.8 13.2 6.1 4.8 2.4 9.3 4.9 13.4 7.3.9.5 1.8 1.1 2.8 1.9 1.6 1.3 3.4 3.1 4.7 5.5 1.9 5.5-1.9 14.9-1.9 14.9-2.3 7.6-18.4 40.6-18.4 40.6-8.1-.2-15.3 5-17.7 12.5-2.6 8.1 1.1 17.3 8.9 21.3s17.4 1.7 22.5-5.3c5-6.8 4.6-16.3-1.1-22.6 1.9-3.7 3.7-7.4 5.6-11.3 5-10.4 13.5-30.4 13.5-30.4.9-1.7 5.7-10.3 2.7-21.3-2.5-11.4-12.6-16.7-12.6-16.7-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3 4.7-9.7 9.4-19.3 14.1-29-4.1-2-8.1-4-12.2-6.1-4.8 9.8-9.7 19.7-14.5 29.5-6.7-.1-12.9 3.5-16.1 9.4-3.4 6.3-2.7 14.1 1.9 19.8z" style="fill:#609926"/></svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
BIN
svg/halo.png
Normal file
BIN
svg/halo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
svg/resume.png
Normal file
BIN
svg/resume.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
BIN
svg/toolbox.png
Normal file
BIN
svg/toolbox.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 572 B |
Loading…
x
Reference in New Issue
Block a user