diff --git a/src/popup/components/CopyButton.js b/src/popup/components/MediaButtons.js
similarity index 55%
rename from src/popup/components/CopyButton.js
rename to src/popup/components/MediaButtons.js
index 4736b8d..d97b675 100644
--- a/src/popup/components/CopyButton.js
+++ b/src/popup/components/MediaButtons.js
@@ -2,7 +2,7 @@ import React, { Component } from "react";
import browser from "webextension-polyfill";
import { CopyToClipboard } from "react-copy-to-clipboard";
import CopyIcon from "../icons/copy.svg";
-import "../styles/CopyButton.scss";
+import "../styles/MediaButtons.scss";
export default class CopyButton extends Component {
constructor(props) {
@@ -22,15 +22,17 @@ export default class CopyButton extends Component {
const { resultText } = this.props;
return (
resultText && (
-
- {this.state.isCopied && (
-
{browser.i18n.getMessage("copiedLabel")}
- )}
-
-
-
+
+
+ {this.state.isCopied && (
+ {browser.i18n.getMessage("copiedLabel")}
+ )}
+
+
+
+
)
);
diff --git a/src/popup/components/ResultArea.js b/src/popup/components/ResultArea.js
index 84f40db..7364c4b 100644
--- a/src/popup/components/ResultArea.js
+++ b/src/popup/components/ResultArea.js
@@ -4,7 +4,7 @@ import getErrorMessage from "src/common/getErrorMessage";
import { getSettings } from "src/settings/settings";
import openUrl from "src/common/openUrl";
import "../styles/ResultArea.scss";
-import CopyButton from "./CopyButton";
+import MediaButtons from "./MediaButtons";
const splitLine = text => {
const regex = /(\n)/g;
@@ -33,7 +33,7 @@ export default props => {
{browser.i18n.getMessage("openInGoogleLabel")}
)}
-
+
);
};
diff --git a/src/popup/styles/CopyButton.scss b/src/popup/styles/CopyButton.scss
deleted file mode 100644
index 9b65f20..0000000
--- a/src/popup/styles/CopyButton.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-.row {
- display: flex;
- flex-direction: row;
- justify-content: flex-end;
-
- .copiedText {
- color: var(--sub-text);
- font-size: 12px;
- margin-right: 5px;
- -moz-user-select: none;
- -webkit-user-select: none;
- }
- .copyButton {
- padding: 0;
- border: 0;
- background-color: var(--main-bg);
- cursor: pointer;
-
- svg {
- height: 16px;
- width: 16px;
- fill: var(--sub-text);
- &:hover {
- fill: var(--highlight);
- }
- }
- }
-}
diff --git a/src/popup/styles/MediaButtons.scss b/src/popup/styles/MediaButtons.scss
new file mode 100644
index 0000000..fd3d2ae
--- /dev/null
+++ b/src/popup/styles/MediaButtons.scss
@@ -0,0 +1,33 @@
+.mediaButtons {
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-end;
+
+ .copy {
+ display: flex;
+ justify-content: center;
+
+ .copiedText {
+ color: var(--sub-text);
+ font-size: 12px;
+ margin-right: 5px;
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ }
+ .copyButton {
+ padding: 0;
+ border: 0;
+ background-color: var(--main-bg);
+ cursor: pointer;
+
+ svg {
+ height: 16px;
+ width: 16px;
+ fill: var(--sub-text);
+ &:hover {
+ fill: var(--highlight);
+ }
+ }
+ }
+ }
+}