mirror of
https://github.com/muerwre/orchidmap-front.git
synced 2025-04-25 02:56:41 +07:00
appearance: icons fixed
This commit is contained in:
muerwre
parent
9e186397e0
commit
169d4d4222
16 changed files with 290 additions and 120 deletions
5
package-lock.json
generated
5
package-lock.json
generated
|
|
@ -12044,6 +12044,11 @@
|
|||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
||||
"dev": true
|
||||
},
|
||||
"typeface-pt-sans": {
|
||||
"version": "0.0.54",
|
||||
"resolved": "https://registry.npmjs.org/typeface-pt-sans/-/typeface-pt-sans-0.0.54.tgz",
|
||||
"integrity": "sha512-uvf3OIiTRXBly8iXD09iNZcLndJ89iGCyzWh4YzxdL+OMXPZxROupW8OR4JYo1RRfhzCdvebE6W/KrKDnAbdmw=="
|
||||
},
|
||||
"ua-parser-js": {
|
||||
"version": "0.7.18",
|
||||
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.18.tgz",
|
||||
|
|
|
|||
|
|
@ -71,6 +71,7 @@
|
|||
"scrypt": "^6.0.3",
|
||||
"styled-components": "^3.2.6",
|
||||
"styled-theming": "^2.2.0",
|
||||
"typeface-pt-sans": "0.0.54",
|
||||
"webpack-git-hash": "^1.0.2"
|
||||
},
|
||||
"flow-coverage-report": {
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@ class Component extends React.PureComponent<Props, void> {
|
|||
</div>
|
||||
|
||||
<div className={classnames('panel right', { active: editing })} ref={el => { this.panel = el; }}>
|
||||
<div className="control-bar">
|
||||
<div className="control-bar control-bar-padded">
|
||||
<button
|
||||
className={classnames({ active: mode === MODES.ROUTER })}
|
||||
onClick={this.startRouterMode}
|
||||
|
|
@ -84,39 +84,45 @@ class Component extends React.PureComponent<Props, void> {
|
|||
className={classnames({ active: mode === MODES.POLY })}
|
||||
onClick={this.startPolyMode}
|
||||
>
|
||||
<Icon icon="icon-poly-2" />
|
||||
<Icon icon="icon-poly-3" />
|
||||
</button>
|
||||
<button
|
||||
className={classnames({ active: mode === MODES.STICKERS })}
|
||||
onClick={this.startStickerMode}
|
||||
>
|
||||
<Icon icon="icon-sticker-2" />
|
||||
<Icon icon="icon-sticker-3" />
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="control-sep" />
|
||||
|
||||
<div className="control-bar">
|
||||
<button
|
||||
className={classnames({ active: mode === MODES.SHOTTER })}
|
||||
onClick={this.startShotterMode}
|
||||
>
|
||||
<Icon icon="icon-shot-2" />
|
||||
</button>
|
||||
|
||||
<div className="control-bar control-bar-padded">
|
||||
<button
|
||||
className={classnames({ active: mode === MODES.TRASH })}
|
||||
onClick={this.startTrashMode}
|
||||
>
|
||||
<Icon icon="icon-trash-2" />
|
||||
<Icon icon="icon-trash-4" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
className={classnames('disabled', { active: mode === MODES.SHOTTER })}
|
||||
// onClick={this.startShotterMode}
|
||||
>
|
||||
<Icon icon="icon-shot-3" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
className={classnames('disabled', { active: mode === MODES.LOGO })}
|
||||
>
|
||||
<Icon icon="icon-map-1" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
className={classnames({ active: mode === MODES.LOGO })}
|
||||
onClick={this.startLogoMode}
|
||||
>
|
||||
<Icon icon="icon-logo-2" />
|
||||
<Icon icon="icon-logo-3" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
@ -127,7 +133,7 @@ class Component extends React.PureComponent<Props, void> {
|
|||
className="highlighted cancel"
|
||||
onClick={this.props.stopEditing}
|
||||
>
|
||||
<span>ОТМЕНА</span>
|
||||
<Icon icon="icon-cancel-1" />
|
||||
</button>
|
||||
|
||||
<button
|
||||
|
|
@ -135,7 +141,7 @@ class Component extends React.PureComponent<Props, void> {
|
|||
onClick={this.startSaveMode}
|
||||
>
|
||||
<span>СХОРОНИТЬ</span>
|
||||
<Icon icon="icon-save-2" />
|
||||
<Icon icon="icon-check-1" />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import React from 'react';
|
||||
import { Icon } from '$components/panels/Icon';
|
||||
|
||||
type Props = {
|
||||
routerCancel: Function,
|
||||
|
|
@ -9,8 +10,10 @@ type Props = {
|
|||
const noPoints = ({ routerCancel }: Props) => (
|
||||
<div className="helper router-helper">
|
||||
<div className="helper__text">
|
||||
<div className="big white">Укажите на карте первую точку маршрута</div>
|
||||
<div className="small gray">Путь прокладывается по улицам, тротуарам и тропинкам</div>
|
||||
<Icon icon="icon-pin-1" />
|
||||
<div className="big white upper">
|
||||
Укажите первую точку на карте
|
||||
</div>
|
||||
</div>
|
||||
<div className="helper__buttons">
|
||||
<div className="button router-helper__button" onClick={routerCancel}>
|
||||
|
|
@ -23,8 +26,8 @@ const noPoints = ({ routerCancel }: Props) => (
|
|||
const firstPoint = ({ routerCancel }: Props) => (
|
||||
<div className="helper router-helper">
|
||||
<div className="helper__text">
|
||||
<div className="big white">Укажите на карте конечную точку маршрута</div>
|
||||
<div className="small gray"> Вы сможете добавить уточняющие точки</div>
|
||||
<Icon icon="icon-pin-1" />
|
||||
<div className="big white upper">Теперь - следующую</div>
|
||||
</div>
|
||||
<div className="helper__buttons">
|
||||
<div className="button router-helper__button" onClick={routerCancel}>
|
||||
|
|
@ -36,9 +39,9 @@ const firstPoint = ({ routerCancel }: Props) => (
|
|||
|
||||
const draggablePoints = ({ routerCancel, routerSubmit }: Props) => (
|
||||
<div className="helper router-helper">
|
||||
<div className="helper__text">
|
||||
<div className="big white">Продолжите маршрут, щелкая по карте</div>
|
||||
<div className="small gray">Потяните линию, чтобы указать промежуточные точки</div>
|
||||
<div className="helper__text success">
|
||||
<Icon icon="icon-check-1" />
|
||||
<div className="big upper">Продолжайте маршрут</div>
|
||||
</div>
|
||||
<div className="helper__buttons button-group">
|
||||
<div className="button button_red router-helper__button" onClick={routerCancel}>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import React from 'react';
|
||||
import { Icon } from '$components/panels/Icon';
|
||||
|
||||
type Props = {
|
||||
clearPoly: Function,
|
||||
|
|
@ -12,18 +13,19 @@ export const TrashDialog = ({
|
|||
}: Props) => (
|
||||
<div className="helper trash-helper">
|
||||
<div className="helper__text">
|
||||
<div className="big white">Уверены?</div>
|
||||
<div className="small gray">Мы все удалим</div>
|
||||
</div>
|
||||
<div className="helper__buttons button-group">
|
||||
<div className="button router-helper__button" onClick={clearStickers}>
|
||||
Стикеры
|
||||
<div className="big white upper">Уверены?</div>
|
||||
</div>
|
||||
<div className="helper__buttons">
|
||||
<div className="button-group">
|
||||
<div className="button router-helper__button" onClick={clearPoly}>
|
||||
Маршрут
|
||||
</div>
|
||||
<div className="button router-helper__button" onClick={clearStickers}>
|
||||
Стикеры
|
||||
</div>
|
||||
<div className="button danger router-helper__button" onClick={clearAll}>
|
||||
Очистить
|
||||
Удалить все
|
||||
</div>
|
||||
</div>
|
||||
<div className="button primary router-helper__button" onClick={clearCancel}>
|
||||
Отмена
|
||||
|
|
|
|||
|
|
@ -1,16 +1,18 @@
|
|||
// @flow
|
||||
import React from 'react';
|
||||
import { Icon } from '$components/panels/Icon';
|
||||
|
||||
type Props = {
|
||||
onClick: Function,
|
||||
}
|
||||
|
||||
export const GuestButton = ({ onClick }: Props) => (
|
||||
<div className="control-bar user-bar">
|
||||
<div className="control-bar user-bar control-bar-padded">
|
||||
<button
|
||||
className="user-bar-guest"
|
||||
onClick={onClick}
|
||||
>
|
||||
<Icon icon="icon-reg-1" />
|
||||
<span>ВОЙТИ</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="initial-scale=1, maximum-scale=0.8">
|
||||
<link rel="icon" href="favicon.png?d" type="image/png" />
|
||||
|
||||
<link href="https://fonts.googleapis.com/css?family=PT+Sans+Narrow|PT+Sans:200,400,700|Rubik&subset=cyrillic" rel="stylesheet">
|
||||
<title>@ORCHID</title>
|
||||
|
||||
<link rel="shortcut icon" href="/favicon.png?wd" type="image/png">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,8 @@ import ReactDOM from 'react-dom';
|
|||
import { App } from '$containers/App';
|
||||
import '$styles/main.less';
|
||||
|
||||
import 'raleway-cyrillic/raleway.css';
|
||||
// import 'raleway-cyrillic/raleway.css';
|
||||
// import 'typeface-pt-sans';
|
||||
|
||||
import { Provider } from 'react-redux';
|
||||
// import { ConnectedRouter } from 'react-router-redux';
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="64" height="64">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32">
|
||||
<defs>
|
||||
<g id="icon-router">
|
||||
<rect x="0" y="0" width="32" height="32" fill="black" stroke="none" />
|
||||
|
|
@ -139,7 +139,7 @@
|
|||
<path id="path5847" fill="none" fill-rule="evenodd" stroke="#fff" stroke-width="2.5" d="M6.63 16.134h4.242"/>
|
||||
</g>
|
||||
|
||||
<g id="icon-shot-2" stroke="none" transform="scale(1.1) translate(-2 -2)">
|
||||
<g id="icon-shot-2" stroke="none" transform="scale(1.1) translate(-2 -1)">
|
||||
<path id="rect5819" stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
<rect id="rect6617" width="21" height="13.89" x="6.25" y="9.833" fill="#fff" rx="2" ry="2"/>
|
||||
<path id="rect6619" fill="#fff" stroke-width="1.979" d="M13.812 7.009h6.282c.45 0 .749.528 1.147 1.039l3.096 3.974c.398.51-3.793 6.989-4.243 6.989h-6.282c-.45 0-4.889-6.747-4.475-7.24l3.19-3.802c.415-.493.836-.96 1.285-.96z"/>
|
||||
|
|
@ -198,13 +198,103 @@
|
|||
</g>
|
||||
</g>
|
||||
|
||||
<g id="icon-save-2" transform="scale(1.1) translate(-3 -2)" stroke="none">
|
||||
<g id="icon-save-2" transform="scale(1.1) translate(-1 -2)" stroke="none">
|
||||
<g fill="white">
|
||||
<path id="rect4766" stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
<path id="rect4986" fill="#fff" stroke-opacity=".941" stroke-width="2.477" d="M6.894 8.502v15.455h18.212V11.402H14.042v-2.9z"/>
|
||||
<path id="path7854" fill="none" fill-rule="evenodd" stroke="#000" stroke-width="2.735" d="M10.923 16.586l4.19 4.19 6.606-6.607" transform="scale(0.9) translate(2 2)"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="icon-trash-3">
|
||||
<path id="rect4766" stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black" stroke="none" />
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM4 12c0-4.42 3.58-8 8-8 1.85 0 3.55.63 4.9 1.69L5.69 16.9C4.63 15.55 4 13.85 4 12zm8 8c-1.85 0-3.55-.63-4.9-1.69L18.31 7.1C19.37 8.45 20 10.15 20 12c0 4.42-3.58 8-8 8z" fill="white" transform="translate(4 4)" stroke-width="1" />
|
||||
</g>
|
||||
|
||||
<g id="icon-trash-4">
|
||||
<path id="rect4766" stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black" stroke="none" />
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M21 9l-9-7-2.59 2.02 7.87 7.87zm0 5.07l-1.63-1.27-.67.52 1.43 1.43zM3.41.86L2 2.27l4.22 4.22L3 9l9 7 2.1-1.63 1.42 1.42-3.53 2.75-7.37-5.73L3 14.07l9 7 4.95-3.85L20.73 21l1.41-1.41z" fill="white" transform="translate(4 4)" stroke-width="0" />
|
||||
</g>
|
||||
|
||||
<g id="icon-logo-3" transform="scale(1.1) translate(-1 -2)">
|
||||
<path id="rect5611" stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black" stroke="none"/>
|
||||
<g id="g5792" fill="none" stroke="#fff" stroke-width="3" transform="matrix(.84382 0 0 .84382 5 2.53)">
|
||||
<path id="path5774" fill-rule="evenodd" d="M22.399 10.08c-5.964-3.689-11.363-3.732-17.222 0 .155 4.418-.316 11.882 8.61 15.957 9.228-4.38 8.532-11.89 8.612-15.957z"/>
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="icon-shot-3" stroke="none" transform="scale(1.1) translate(-2 -1)">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M18 20H4V6h9V4H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-9h-2v9zm-7.79-3.17l-1.96-2.36L5.5 18h11l-3.54-4.71zM20 4V1h-2v3h-3c.01.01 0 2 0 2h3v2.99c.01.01 2 0 2 0V6h3V4h-3z" fill="white" transform="translate(5 3)" stroke-width="0" />
|
||||
</g>
|
||||
|
||||
<g id="icon-reg-1" stroke="none" transform="scale(1.1) translate(-2 -1)">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M11 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0-6c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zM5 18c.2-.63 2.57-1.68 4.96-1.94l2.04-2c-.39-.04-.68-.06-1-.06-2.67 0-8 1.34-8 4v2h9l-2-2H5zm15.6-5.5l-5.13 5.17-2.07-2.08L12 17l3.47 3.5L22 13.91z" fill="white" transform="translate(5 3)" stroke-width="1" />
|
||||
</g>
|
||||
|
||||
<g id="icon-cancel-1" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z" fill="white" stroke="white" transform="translate(4 4)" stroke-width="1" />
|
||||
</g>
|
||||
|
||||
<g id="icon-check-1" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z" fill="white" transform="translate(4 4)" stroke-width="1" stroke="white" />
|
||||
</g>
|
||||
|
||||
<g id="icon-pin-1" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M13 16.12c3.47-.41 6.17-3.36 6.17-6.95 0-3.87-3.13-7-7-7s-7 3.13-7 7c0 3.47 2.52 6.34 5.83 6.89V20H5v2h14v-2h-6v-3.88z" fill="white" transform="translate(4 4)" stroke-width="0" stroke="white" />
|
||||
</g>
|
||||
|
||||
<g id="icon-check-2" stroke="none" transform="scale(1.1) translate(-2 -1)">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M11 5v5.59H7.5l4.5 4.5 4.5-4.5H13V5h-2zm-5 9c0 3.31 2.69 6 6 6s6-2.69 6-6h-2c0 2.21-1.79 4-4 4s-4-1.79-4-4H6z" fill="white" transform="translate(4 4)" stroke-width="0" stroke="white" />
|
||||
</g>
|
||||
|
||||
<g id="icon-map-1" stroke="none" transform="scale(1.1) translate(-2 -1)">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M20.5 3l-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5zM10 5.47l4 1.4v11.66l-4-1.4V5.47zm-5 .99l3-1.01v11.7l-3 1.16V6.46zm14 11.08l-3 1.01V6.86l3-1.16v11.84z" fill="white" transform="translate(5 3)" stroke-width="1" />
|
||||
</g>
|
||||
|
||||
<g id="icon-sticker-3" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
<g>
|
||||
<path fill="#fff" fill-rule="evenodd" stroke-width=".767" d="M12 24l4 6 3.5-6.405z" transform="rotate(45 16 16)"/>
|
||||
|
||||
<circle cx="16" cy="15" r="9.5" fill="#fff" stroke-width="1.851"/>
|
||||
<circle cx="16" cy="15" r="6.5" fill="black" />
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="icon-poly-3" transform="scale(1.1) translate(-3 -2)" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
<g fill="white" transform="translate(2 0.5)">
|
||||
<path stroke-width="2.3" fill="none" fill-rule="evenodd" stroke="#fff" stroke-linejoin="round" d="M7.924 12.991l8.569-4.989-6.55 14.587 13.762-7.974-3.958 9.12"/>
|
||||
|
||||
<circle cx="7.711" cy="13" r="1" fill="black" stroke-width="2.5" stroke="white" />
|
||||
<circle cx="16.5" cy="8" r="1" fill="black" stroke-width="2.5" stroke="white" />
|
||||
<circle cx="10" cy="22" r="1" fill="black" stroke-width="2.5" stroke="white" />
|
||||
<circle cx="19.7" cy="23.701" r="1" fill="black" stroke-width="2.5" stroke="white" />
|
||||
<circle cx="24" cy="14.5" r="1" fill="black" stroke-width="2.5" stroke="white" />
|
||||
</g>
|
||||
</g>
|
||||
|
||||
<g id="icon-poly-4" stroke="none">
|
||||
<path stroke-opacity=".941" stroke-width=".265" d="M0 0h32v32H0z" fill="black"/>
|
||||
|
||||
<path xmlns="http://www.w3.org/2000/svg" d="M23 8c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2zm0 0c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2z" fill="white" stroke="white" stroke-width="1" transform="translate(4 4)"/>
|
||||
</g>
|
||||
</svg>
|
||||
</defs>
|
||||
|
||||
<use xlink:href="#icon-pin-1" />
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 26 KiB |
|
|
@ -1,4 +1,11 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" id="svg8" width="600" height="32">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
id="svg8"
|
||||
width="32"
|
||||
height="32"
|
||||
>
|
||||
<defs>
|
||||
<g id="g4853" transform="translate(-29.985 30.509)">
|
||||
<rect id="rect4832" width="4.035" height="1.75" x="16.495" y="-28.417" fill="#fff" stroke-opacity=".941" stroke-width=".115" rx="0" ry="0"/>
|
||||
<path id="rect4834" fill="#fff" stroke-opacity=".941" stroke-width=".247" d="M15.535-28.417h5.616v.933h-5.616z"/>
|
||||
|
|
@ -67,4 +74,7 @@
|
|||
<path id="path5784" fill="none" stroke="#fff" d="M11.932 25.636l2.343-2.342"/>
|
||||
</g>
|
||||
</g>
|
||||
</defs>
|
||||
|
||||
<use xlink:href="#icon-logo" />
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 8 KiB After Width: | Height: | Size: 8.4 KiB |
|
|
@ -4,29 +4,35 @@
|
|||
height: 18px;
|
||||
line-height: 1em;
|
||||
border-radius: 2px;
|
||||
font-family: sans-serif;
|
||||
font-size: 14px;
|
||||
font-family: inherit;
|
||||
font-size: 1em;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
box-shadow: inset rgba(100,100,100, 0.3) 1px 0, inset rgba(0,0,0, 0.1) -1px 0;
|
||||
color: white;
|
||||
font-weight: 200;
|
||||
|
||||
&.primary {
|
||||
background: #3c78db;
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.danger {
|
||||
background: #ed2f3b;
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.success {
|
||||
background: #17bf6d;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.button-group {
|
||||
display: flex;
|
||||
|
||||
.button {
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
|
|
|
|||
|
|
@ -14,3 +14,8 @@
|
|||
|
||||
@red_primary: #ff7034;
|
||||
@red_secondary: #ff3344;
|
||||
|
||||
@panel_radius: 0;
|
||||
|
||||
@color_primary: #4597d0;
|
||||
@color_success: #7cd766;
|
||||
|
|
|
|||
|
|
@ -10,23 +10,36 @@
|
|||
@import 'save.less';
|
||||
|
||||
body {
|
||||
font-family: 'Raleway', sans-serif;
|
||||
font-size: 14px;
|
||||
font-family: 'Rubik', sans-serif;
|
||||
font-size: 15px;
|
||||
// letter-spacing: 0.4px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.gray {
|
||||
opacity: 0.75;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.big {
|
||||
font-size: 14px;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.upper {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 12px;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.white {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.success {
|
||||
color: @color_success;
|
||||
}
|
||||
|
||||
.primary {
|
||||
color: @color_primary;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -85,18 +85,18 @@
|
|||
margin-top: -2px;
|
||||
outline: none;
|
||||
z-index: 10001;
|
||||
background: @blue_secondary;
|
||||
background: @red_secondary;
|
||||
|
||||
&:after {
|
||||
content: ' ';
|
||||
box-shadow: 0 0 0 3px @blue_secondary;
|
||||
background: @blue_primary;
|
||||
box-shadow: 0 0 0 3px @red_secondary;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
left: 6px;
|
||||
top: -2px;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
|
|
@ -104,9 +104,9 @@
|
|||
display: block;
|
||||
width: 3px;
|
||||
height: 20px;
|
||||
background: @blue_secondary;
|
||||
left: 9px;
|
||||
top: -8px;
|
||||
background: @red_secondary;
|
||||
left: 8.5px;
|
||||
top: -9px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,14 @@
|
|||
.control-bar {
|
||||
background: @bar_background;
|
||||
border-radius: 4px;
|
||||
border-radius: @panel_radius;
|
||||
display: flex;
|
||||
box-shadow: @bar_shadow;
|
||||
}
|
||||
|
||||
.control-bar-padded {
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.control-dist {
|
||||
background: #222222;
|
||||
padding: 0 10px;
|
||||
|
|
@ -78,11 +82,11 @@
|
|||
}
|
||||
|
||||
&:first-child {
|
||||
border-radius: 4px 0 0 4px;
|
||||
border-radius: @panel_radius 0 0 @panel_radius;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-radius: 0 4px 4px 0;
|
||||
border-radius: 0 @panel_radius @panel_radius 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
|
@ -92,6 +96,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
svg {
|
||||
fill: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
&.highlighted {
|
||||
background: #555555;
|
||||
}
|
||||
|
|
@ -151,13 +161,29 @@
|
|||
// width: 500px;
|
||||
padding: 12px;
|
||||
font-weight: 200;
|
||||
font-size: 14px;
|
||||
font-size: 1em;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
.helper__text {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
svg {
|
||||
fill: white;
|
||||
width: 24px;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
&.success {
|
||||
color: @color_success;
|
||||
|
||||
svg {
|
||||
fill: @color_success;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.helper__buttons {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
}
|
||||
}
|
||||
.user-bar-guest {
|
||||
width: 168px;
|
||||
// width: 168px;
|
||||
}
|
||||
|
||||
.user-button {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue