diff --git a/packages/editor/src/components/toolbar/ToolbarPositionInterface.ts b/packages/editor/src/components/toolbar/ToolbarPositionInterface.ts index e3cddc2d..6c809d80 100644 --- a/packages/editor/src/components/toolbar/ToolbarPositionInterface.ts +++ b/packages/editor/src/components/toolbar/ToolbarPositionInterface.ts @@ -21,15 +21,15 @@ export default interface ToolbarPosition { export const defaultPosition: ToolbarPosition = { vertical: true, position: { - right: '50px', - top: '100px', + right: '7px', + top: '150px', }, }; export const horizontalPosition = { position: { - right: '50px', - top: '90%', + right: '7px', + top: '93%', }, vertical: false, }; diff --git a/packages/editor/src/components/toolbar/global-styled.css b/packages/editor/src/components/toolbar/global-styled.css deleted file mode 100644 index dd205127..00000000 --- a/packages/editor/src/components/toolbar/global-styled.css +++ /dev/null @@ -1,229 +0,0 @@ -div#header { - width: 100%; - height: 50px; - position: absolute; - top: 0; - z-index: 1000; -} - -div#headerNotifier { - border: 1px solid rgb(241, 163, 39); - background-color: rgb(252, 235, 192); - border-radius: 3px; - position: fixed; - padding: 5px 9px; - color: back; - white-space: nowrap; - margin-top: 5px; - display: none; - bottom: 10px; - font-family: 'Montserrat', Arial, Helvetica, sans-serif; -} - -div#toolbarRight { - float: right; - white-space: nowrap; - vertical-align: middle; - justify-content: center; - margin: 6px 10px; - height: 100%; -} - -#account { - float: right; - display: inline; -} - -#account > img { - width: 36x; - height: 36px; -} - -#accountSettingsPanel { - padding: 10px 10px; -} - -#share { - margin: 0 30px; - float: right; -} - -.actionButton { - cursor: pointer; - font-family: Arial, Helvetica, sans-serif; - user-select: none; - vertical-align: middle; - justify-content: center; - padding: 10px 25px; - font-size: 15px; - min-width: 64px; - box-sizing: border-box; - font-weight: 600; - border-radius: 9px; - color: white; - background-color: #ffa800; -} - -.actionButton:hover { - transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, - box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; -} - -div#toolbar { - width: 100%; - height: 50px; - box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.1); - background-color: #fff; - min-width: 900px; - overflow: hidden; -} - -div#toolbar .buttonContainer { - height: 50px; - padding-top: 8px; - padding-right: 10px; - padding-left: 10px; - float: left; - border-left: 1px solid lightgray; -} - -div#mapName > span { - border-radius: 4px; - float: left; - padding: 8px; - min-width: 30px; - font-weight: bold; -} - -div#backToList { - height: 24px; - width: 24px; - float: left; - margin: 13px 20px; -} - -/******************************************************************************************/ -/* Buttons*/ -/******************************************************************************************/ - -div#toolbar .buttonOn, -div#toolbar .buttonOff, -div#toolbar .buttonActive, -div#toolbar .buttonOn:hover { - width: 28px; - height: 28px; - float: left; - text-align: center; - z-index: 4; - margin-top: 3px; - padding-top: 2px; - padding-left: 2px; - margin-left: 3px; -} - -div#toolbar .buttonOn:hover { - cursor: pointer; - opacity: 1; -} - -div#toolbar .buttonOn { - opacity: 0.8; -} - -div#toolbar .buttonOff { - opacity: 0.4; -} - -div#exportAnchor { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; -} - -div#toolbar .buttonExtOn, -div#toolbar .buttonExtOff, -div#toolbar .buttonExtActive, -div#toolbar .buttonExtOn:hover { - width: 40px; - height: 28px; - float: left; - text-align: left; - z-index: 4; - margin-top: 3px; - padding-top: 2px; - padding-left: 5px; - margin-left: 3px; -} - -div#toolbar .buttonExtOn:hover { - opacity: 1; -} - -div#toolbar .buttonExtActive { - opacity: 1; -} - -div#toolbar .buttonExtOn { - opacity: 0.8; - cursor: pointer; -} - -div#toolbar .buttonExtOff { - opacity: 0.4; -} - -div#exportAnchor { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; -} - -/***************************************************************************************************/ -/* Other toolbar styles */ -/***************************************************************************************************/ -.toolbarTip { - background-color: #000000; - padding: 5px 5px; - color: #f5f5f5; - font-size: 11px; -} - -div#colorPalette { - border: 1px solid #bbb4d6; - display: none; - position: absolute; - z-index: 4; - width: 160px; - top: 89px; -} - -div.toolbarPanelLink, -div.toolbarPanelLinkSelectedLink { - cursor: pointer; - color: black; - margin: 1px; - cursor: pointer; - font-size: 12px; - padding: 5px 10px; - font-weight: bold; -} - -div.toolbarPanelLink:hover, -div.toolbarPanelLinkSelectedLink { - cursor: pointer; - background-color: #efefef; -} - -.toolbarPaneTip { - background-color: rgb(228, 226, 210); - padding: 5px 5px; - color: #f5f5f5; - font-size: 11px; - border-radius: 6px; - box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); - border: 3px double rgb(190, 190, 190); -}