mirror of
https://github.com/muerwre/orchidmap-front.git
synced 2025-04-25 19:16:41 +07:00
icons and toolbars
This commit is contained in:
parent
2375bc3f57
commit
13c5ae08d9
4 changed files with 25 additions and 16 deletions
|
@ -46,15 +46,15 @@ export class EditorPanel extends React.PureComponent {
|
||||||
|
|
||||||
<LogoPreview logo={logo} />
|
<LogoPreview logo={logo} />
|
||||||
|
|
||||||
<div className={classnames('panel right', { active: editing })}>
|
<div className="control-dist">
|
||||||
<div className="control-dist">
|
{totalDistance} км
|
||||||
{totalDistance} км
|
<Icon icon="icon-cycle" size={32} />
|
||||||
<Icon icon="icon-cycle" size={32} />
|
{
|
||||||
{
|
<span>{toHours(estimateTime)}</span>
|
||||||
<span>{toHours(estimateTime)}</span>
|
}
|
||||||
}
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
|
<div className={classnames('panel right', { active: editing })}>
|
||||||
<div className="control-bar">
|
<div className="control-bar">
|
||||||
<button
|
<button
|
||||||
className={classnames({ active: mode === MODES.ROUTER })}
|
className={classnames({ active: mode === MODES.ROUTER })}
|
||||||
|
@ -125,8 +125,8 @@ export class EditorPanel extends React.PureComponent {
|
||||||
|
|
||||||
<div className={classnames('panel right', { active: !editing })}>
|
<div className={classnames('panel right', { active: !editing })}>
|
||||||
<div className="control-bar">
|
<div className="control-bar">
|
||||||
<button className="success single" onClick={this.startEditing}>
|
<button className="primary single" onClick={this.startEditing}>
|
||||||
<Icon icon="icon-router" />
|
<Icon icon="icon-route-2" />
|
||||||
<span>
|
<span>
|
||||||
РЕДАКТИРОВАТЬ
|
РЕДАКТИРОВАТЬ
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -200,7 +200,8 @@ export class Editor {
|
||||||
const { path } = getUrlData();
|
const { path } = getUrlData();
|
||||||
pushPath(`/${path}/edit`);
|
pushPath(`/${path}/edit`);
|
||||||
|
|
||||||
this.poly.poly.enableEdit();
|
if (this.poly.latlngs && this.poly.latlngs.length > 1) this.poly.poly.enableEdit();
|
||||||
|
|
||||||
this.stickers.startEditing();
|
this.stickers.startEditing();
|
||||||
this.setEditing(true);
|
this.setEditing(true);
|
||||||
};
|
};
|
||||||
|
|
|
@ -64,9 +64,9 @@
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 80px;
|
top: 10px;
|
||||||
left: 10px;
|
left: 10px;
|
||||||
border-radius: 2px;
|
border-radius: 2px 0 0 2px;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
box-shadow: @bar_shadow;
|
box-shadow: @bar_shadow;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
@ -110,3 +110,7 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.leaflet-top {
|
||||||
|
top: 42px;
|
||||||
|
}
|
||||||
|
|
|
@ -6,16 +6,20 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.control-dist {
|
.control-dist {
|
||||||
height: 44px;
|
|
||||||
background: #222222;
|
background: #222222;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
border-radius: 3px 0 0 3px;
|
|
||||||
font-weight: 200;
|
font-weight: 200;
|
||||||
color: #cccccc;
|
color: #cccccc;
|
||||||
user-select: none;
|
user-select: none;
|
||||||
box-shadow: @bar_shadow;
|
box-shadow: @bar_shadow;
|
||||||
|
position: fixed;
|
||||||
|
top: 10px;
|
||||||
|
left: 42px;
|
||||||
|
z-index: 2;
|
||||||
|
height: 32px;
|
||||||
|
border-radius: 0 3px 3px 0;
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
fill: #cccccc;
|
fill: #cccccc;
|
||||||
|
@ -101,7 +105,7 @@
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.success {
|
&.danger {
|
||||||
background: linear-gradient(150deg, @red_primary, @red_secondary) 50% 50% no-repeat;
|
background: linear-gradient(150deg, @red_primary, @red_secondary) 50% 50% no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue