Public/Markdown2Html
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

调整极客黑样式

Browse Source
This commit is contained in:
liushuang 2024-08-06 23:50:54 +08:00
parent 5a24639b69
commit 2351f3e12d
8 changed files with 216 additions and 135 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

73
src/App.css
View File

@ -1,77 +1,4 @@
.ant-btn-primary {
color: #fff;
background-color: #000;
border-color: #000;
}
.ant-btn-primary:hover,
.ant-btn-primary:focus {
color: #fff;
background-color: #000;
border-color: #000;
}
.ant-btn:hover, .ant-btn:focus {
color: #000;
background-color: #fff;
border-color: #000;
}
.ant-input:hover, .ant-input:focus {
border-color: #000;
border-right-width: 1px !important;
-webkit-box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
}
.ant-select-selection:hover {
border-color: #000;
border-right-width: 1px !important;
}
.ant-select-focused .ant-select-selection, .ant-select-selection:focus, .ant-select-selection:active,
.ant-input-number:focus, .ant-input-number:active , .ant-input-number:hover {
border-color: #000;
-webkit-box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
}
.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
background-color: #f1f1f1;
}
.ant-select-dropdown-menu {
margin: 4px;
padding: 0;
}
.ant-select-dropdown-menu-item {
border-radius: 4px;
margin: 2px 0;
}
.ant-menu-item-selected {
color: #000;
/*font-weight: bolder;*/
}
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: #f6f6f6;
}
.ant-menu-item {
text-align: center;
margin-right: 20px;
}
.ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
margin-right: 20px;
}
.ant-menu-item:hover, .ant-menu-item-active, .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open, .ant-menu-submenu-active, .ant-menu-submenu-title:hover {
color: #000;
font-weight: bolder;
}
.nice-app {
height: 100vh;

87
src/component/Dialog/ImageDialog.js
View File

@ -10,7 +10,11 @@ import Gitee from "../ImageHosting/Gitee";
import GitHub from "../ImageHosting/GitHub";
import { uploadAdaptor } from "../../utils/imageHosting";
import {SM_MS_PROXY, IMAGE_HOSTING_TYPE, IMAGE_HOSTING_NAMES} from "../../utils/constant";
import {
SM_MS_PROXY,
IMAGE_HOSTING_TYPE,
IMAGE_HOSTING_NAMES
} from "../../utils/constant";
import appContext from "../../utils/appContext";
const { Dragger } = Upload;
@ -33,11 +37,11 @@ class ImageDialog extends Component {
let text = "";
// 成功后添加url
if (this.props.navbar.isContainImgName) {
this.images.forEach((value) => {
this.images.forEach(value => {
text += `![${value.filename}](${value.url})\n`;
});
} else {
this.images.forEach((value) => {
this.images.forEach(value => {
text += `![](${value.url})\n`;
});
}
@ -60,11 +64,20 @@ class ImageDialog extends Component {
this.props.dialog.setImageOpen(false);
};
customRequest = ({action, data, file, headers, onError, onProgress, onSuccess, withCredentials}) => {
customRequest = ({
action,
data,
file,
headers,
onError,
onProgress,
onSuccess,
withCredentials
}) => {
const formData = new FormData();
const { images } = this;
if (data) {
Object.keys(data).forEach((key) => {
Object.keys(data).forEach(key => {
formData.append(key, data[key]);
});
}
@ -78,15 +91,44 @@ class ImageDialog extends Component {
}
// 使用SM.MS图床
else if (this.props.imageHosting.type === "SM.MS") {
uploadAdaptor({formData, file, action, onProgress, onSuccess, onError, headers, withCredentials});
uploadAdaptor({
formData,
file,
action,
onProgress,
onSuccess,
onError,
headers,
withCredentials
});
}
// 使用Gitee图床
else if (this.props.imageHosting.type === "Gitee") {
uploadAdaptor({formData, file, action, onProgress, onSuccess, onError, headers, withCredentials, images});
uploadAdaptor({
formData,
file,
action,
onProgress,
onSuccess,
onError,
headers,
withCredentials,
images
});
}
// 使用GitHub图床
else if (this.props.imageHosting.type === "GitHub") {
uploadAdaptor({formData, file, action, onProgress, onSuccess, onError, headers, withCredentials, images});
uploadAdaptor({
formData,
file,
action,
onProgress,
onSuccess,
onError,
headers,
withCredentials,
images
});
}
// 使用用户提供的图床或是默认mdnice图床
else {
@ -96,11 +138,11 @@ class ImageDialog extends Component {
return {
abort() {
console.log("upload progress is aborted.");
},
}
};
};
typeChange = (type) => {
typeChange = type => {
this.props.imageHosting.setType(type);
window.localStorage.setItem(IMAGE_HOSTING_TYPE, type);
};
@ -134,12 +176,25 @@ class ImageDialog extends Component {
{({ useImageHosting }) => (
<Tabs tabBarExtraContent={imageHostingSwitch} type="card">
<TabPane tab="图片上传" key="1">
<Dragger name="file" multiple action={SM_MS_PROXY} customRequest={this.customRequest}>
<Dragger
name="file"
multiple
action={SM_MS_PROXY}
customRequest={this.customRequest}
>
<p className="ant-upload-drag-icon">
<SvgIcon name="inbox" style={style.svgIcon} fill="#40a9ff" />
<SvgIcon
name="inbox"
style={style.svgIcon}
fill="#8E24AA"
/>
</p>
<p className="ant-upload-text">
点击或拖拽一张或多张照片上传
</p>
<p className="ant-upload-hint">
{"正在使用" + type + "图床"}
</p>
<p className="ant-upload-text">点击或拖拽一张或多张照片上传</p>
<p className="ant-upload-hint">{"正在使用" + type + "图床"}</p>
</Dragger>
</TabPane>
{useImageHosting.isAliyunOpen ? (
@ -173,8 +228,8 @@ class ImageDialog extends Component {
const style = {
svgIcon: {
width: "48px",
height: "48px",
},
height: "48px"
}
};
export default ImageDialog;

2
src/icon/index.css
View File

@ -3,5 +3,5 @@
}
.icon:hover {
fill: #40a9ff;
fill: #8E24AA;
}

91
src/index.css
View File

@ -13,3 +13,94 @@ code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace;
}
@font-face {
font-display: swap;
font-family: Mangueira Alt;
font-style: normal;
font-weight: 700;
src: url(https://cdn.luckday.cn/static/font/mangueira-alt-bold.woff2) format("woff2");
}
.ant-btn-primary {
color: #fff;
background-color: #000;
border-color: #000;
}
.ant-btn-primary:hover,
.ant-btn-primary:focus {
color: #fff;
background-color: #000;
border-color: #000;
}
.ant-btn:hover, .ant-btn:focus {
color: #000;
background-color: #fff;
border-color: #000;
}
.ant-input:hover, .ant-input:focus {
border-color: #000;
border-right-width: 1px !important;
-webkit-box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
}
.ant-select-selection:hover {
border-color: #000;
border-right-width: 1px !important;
}
.ant-select-focused .ant-select-selection, .ant-select-selection:focus, .ant-select-selection:active,
.ant-input-number:focus, .ant-input-number:active , .ant-input-number:hover {
border-color: #000;
-webkit-box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
box-shadow: 0 0 0 2px rgb(82 82 83 / 20%);
}
.ant-select-dropdown-menu-item:hover:not(.ant-select-dropdown-menu-item-disabled) {
background-color: #f1f1f1;
}
.ant-select-dropdown-menu {
margin: 4px;
padding: 0;
}
.ant-select-dropdown-menu-item {
border-radius: 4px;
margin: 2px 0;
}
.ant-menu-item-selected {
color: #000;
/*font-weight: bolder;*/
}
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
background-color: #f6f6f6;
}
.ant-menu-item {
text-align: center;
margin-right: 20px;
}
.ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
margin-right: 20px;
}
.ant-menu-item:hover, .ant-menu-item-active, .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open, .ant-menu-submenu-active, .ant-menu-submenu-title:hover {
color: #000;
font-weight: bolder;
}
.ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
color: #4a148c;
}
.ant-tabs-nav .ant-tabs-tab:hover {
color: #8E24AA;
}

19
src/layout/Footer.js
View File

@ -16,7 +16,7 @@ class Footer extends Component {
constructor(props) {
super(props);
this.state = {
engineDesc: SITDOWN_OPTIONS[0].desc,
engineDesc: SITDOWN_OPTIONS[0].desc
};
}
@ -64,7 +64,7 @@ class Footer extends Component {
render() {
const menu = (
<Menu onClick={this.handleMenu}>
{SITDOWN_OPTIONS.map((option) => (
{SITDOWN_OPTIONS.map(option => (
<Menu.Item key={option.desc}>
<div>{option.value}</div>
</Menu.Item>
@ -100,17 +100,22 @@ class Footer extends Component {
{isPasteHtmlChecked && (
<div className="nice-footer-message" onClick={this.handleMessage}>
点击使用
<Dropdown overlay={menu} trigger={["click"]} overlayClassName="nice-footer-overlay" placement="topLeft">
<Dropdown
overlay={menu}
trigger={["click"]}
overlayClassName="nice-footer-overlay"
placement="topLeft"
>
<a
id="nice-footer-engine"
className="nice-footer-engine"
href="#"
onClick={(e) => {
onClick={e => {
e.stopPropagation();
}}
>
{this.state.engineDesc}
<SvgIcon name="down" style={style.svgIcon} fill="#40a9ff" />
<SvgIcon name="down" style={style.svgIcon} fill="#8E24AA" />
</a>
</Dropdown>
将粘贴的富文本转换为 markdown
@ -124,8 +129,8 @@ class Footer extends Component {
const style = {
svgIcon: {
width: "12px",
height: "12px",
},
height: "12px"
}
};
export default Footer;

7
src/layout/Navbar.css
View File

@ -56,8 +56,11 @@
padding: 0 10px 0 20px;
font-weight: bold;
font-size: 16px;
font-family: Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, "PingFang SC", Cambria, Cochin, Georgia,
Times, "Times New Roman", serif;
/*font-family: Optima-Regular, Optima, PingFangSC-light, PingFangTC-light, "PingFang SC", Cambria, Cochin, Georgia,*/
/* Times, "Times New Roman", serif;*/
/*font-size: x-large;*/
font-family: Mangueira Alt, sans-serif;
}
.nice-navbar-hide {

8
src/template/markdown/ten.js
View File

@ -34,7 +34,7 @@ export default `/*自定义样式，实时生效*/
#nice h1 {
margin-top: -0.46em;
margin-bottom: 0.1em;
border-bottom: 2px solid rgb(198, 196, 196);
// border-bottom: 2px solid rgb(198, 196, 196);
box-sizing: border-box;
}
@ -56,8 +56,8 @@ export default `/*自定义样式，实时生效*/
#nice h2 {
margin: 10px auto;
height: 40px;
background-color: rgb(251, 251, 251);
border-bottom: 1px solid rgb(246, 246, 246);
// background-color: rgb(251, 251, 251);
// border-bottom: 1px solid rgb(246, 246, 246);
overflow: hidden;
box-sizing: border-box;
}
@ -84,7 +84,7 @@ export default `/*自定义样式，实时生效*/
/* 三级标题 */
#nice h3 {
margin: 20px auto 5px;
border-top: 1px solid rgb(221, 221, 221);
// border-top: 1px solid rgb(221, 221, 221);
box-sizing: border-box;
}

8
src/template/markdown/wgh.js
View File

@ -37,7 +37,7 @@ export default `/*自定义样式，实时生效*/
#nice h1 {
margin-top: -0.46em;
margin-bottom: 0.1em;
border-bottom: 2px solid rgb(198, 196, 196);
// border-bottom: 2px solid rgb(198, 196, 196);
box-sizing: border-box;
}
@ -59,8 +59,8 @@ export default `/*自定义样式，实时生效*/
#nice h2 {
margin: 10px auto;
height: 40px;
background-color: rgb(251, 251, 251);
border-bottom: 1px solid rgb(246, 246, 246);
// background-color: rgb(251, 251, 251);
// border-bottom: 1px solid rgb(246, 246, 246);
overflow: hidden;
box-sizing: border-box;
}
@ -87,7 +87,7 @@ export default `/*自定义样式，实时生效*/
/* 三级标题 */
#nice h3 {
margin: 20px auto 5px;
border-top: 1px solid rgb(221, 221, 221);
// border-top: 1px solid rgb(221, 221, 221);
box-sizing: border-box;
}