diff --git a/src/App.css b/src/App.css index 588245a..2401711 100644 --- a/src/App.css +++ b/src/App.css @@ -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; diff --git a/src/component/Dialog/ImageDialog.js b/src/component/Dialog/ImageDialog.js index 0ada692..f4f8ba7 100644 --- a/src/component/Dialog/ImageDialog.js +++ b/src/component/Dialog/ImageDialog.js @@ -1,6 +1,6 @@ -import React, {Component} from "react"; -import {observer, inject} from "mobx-react"; -import {Modal, Upload, Tabs, Select} from "antd"; +import React, { Component } from "react"; +import { observer, inject } from "mobx-react"; +import { Modal, Upload, Tabs, Select } from "antd"; import SvgIcon from "../../icon"; @@ -9,13 +9,17 @@ import QiniuOSS from "../ImageHosting/QiniuOSS"; 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 { uploadAdaptor } from "../../utils/imageHosting"; +import { + SM_MS_PROXY, + IMAGE_HOSTING_TYPE, + IMAGE_HOSTING_NAMES +} from "../../utils/constant"; import appContext from "../../utils/appContext"; -const {Dragger} = Upload; -const {TabPane} = Tabs; -const {Option} = Select; +const { Dragger } = Upload; +const { TabPane } = Tabs; +const { Option } = Select; @inject("dialog") @inject("content") @@ -33,17 +37,17 @@ 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`; }); } // 重新初始化 this.images = []; - const {markdownEditor} = this.props.content; + const { markdownEditor } = this.props.content; const cursor = markdownEditor.getCursor(); markdownEditor.replaceSelection(text, cursor); // 上传后实时更新内容 @@ -60,53 +64,91 @@ 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; + const { images } = this; if (data) { - Object.keys(data).forEach((key) => { + Object.keys(data).forEach(key => { formData.append(key, data[key]); }); } // 使用阿里云图床 if (this.props.imageHosting.type === "阿里云") { - uploadAdaptor({file, onSuccess, onError, images}); + uploadAdaptor({ file, onSuccess, onError, images }); } // 使用七牛云图床 else if (this.props.imageHosting.type === "七牛云") { - uploadAdaptor({file, onSuccess, onError, onProgress, images}); + uploadAdaptor({ file, onSuccess, onError, onProgress, images }); } // 使用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 { - uploadAdaptor({formData, file, onSuccess, onError, images}); + uploadAdaptor({ formData, file, onSuccess, onError, images }); } return { abort() { console.log("upload progress is aborted."); - }, + } }; }; - typeChange = (type) => { + typeChange = type => { this.props.imageHosting.setType(type); window.localStorage.setItem(IMAGE_HOSTING_TYPE, type); }; render() { - const {hostingList, type} = this.props.imageHosting; + const { hostingList, type } = this.props.imageHosting; const columns = hostingList.map((option, index) => (