From eb9d1a3fd5f3c7621ded8976e1c5a06971475d54 Mon Sep 17 00:00:00 2001 From: Henrique Dias Date: Tue, 16 Jan 2018 15:15:07 +0000 Subject: [PATCH] Start using components from ipfs-react-components --- package.json | 1 + src/js/components/logic/new-pinned-hash.js | 2 +- src/js/components/view/button.js | 25 - src/js/components/view/checkbox-block.js | 25 +- src/js/components/view/file-block.js | 3 +- src/js/components/view/footer.js | 23 - src/js/components/view/header.js | 48 - src/js/components/view/icon-button.js | 33 - src/js/components/view/icon-dropdown-list.js | 2 +- src/js/components/view/icon.js | 29 - src/js/components/view/info-block.js | 2 +- src/js/components/view/menu-option.js | 35 - src/js/components/view/pane-container.js | 30 - src/js/components/view/pane.js | 34 - src/js/components/view/pinned-hash.js | 2 +- src/js/panes/files.js | 11 +- src/js/panes/info.js | 12 +- src/js/panes/intro.js | 9 +- src/js/panes/loader.js | 2 +- src/js/panes/peers.js | 10 +- src/js/panes/pinned.js | 11 +- src/js/panes/settings.js | 9 +- src/js/screens/menu.js | 8 +- src/js/screens/welcome.js | 7 +- src/styles/app.less | 3 - src/styles/components/info-block.less | 100 -- src/styles/fonts.less | 15 - src/styles/themify-icons.less | 1082 ------------------ 28 files changed, 71 insertions(+), 1502 deletions(-) delete mode 100644 src/js/components/view/button.js delete mode 100644 src/js/components/view/footer.js delete mode 100644 src/js/components/view/header.js delete mode 100644 src/js/components/view/icon-button.js delete mode 100644 src/js/components/view/icon.js delete mode 100644 src/js/components/view/menu-option.js delete mode 100644 src/js/components/view/pane-container.js delete mode 100644 src/js/components/view/pane.js delete mode 100644 src/styles/components/info-block.less delete mode 100644 src/styles/fonts.less delete mode 100644 src/styles/themify-icons.less diff --git a/package.json b/package.json index 7961a8903..ffc2a2ea0 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "electron-menubar": "^1.0.1", "electron-squirrel-startup": "^1.0.0", "file-extension": "^4.0.1", + "ipfs-react-components": "hacdias/ipfs-react-components", "ipfs-stats": "^1.0.4", "ipfsd-ctl": "^0.26.0", "is-ipfs": "^0.3.2", diff --git a/src/js/components/logic/new-pinned-hash.js b/src/js/components/logic/new-pinned-hash.js index 6828ad47f..17f26d52e 100644 --- a/src/js/components/logic/new-pinned-hash.js +++ b/src/js/components/logic/new-pinned-hash.js @@ -1,7 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import IconButton from '../view/icon-button' +import {IconButton} from 'ipfs-react-components' /** * Is a New Pinned Hash form. diff --git a/src/js/components/view/button.js b/src/js/components/view/button.js deleted file mode 100644 index 522fdfa22..000000000 --- a/src/js/components/view/button.js +++ /dev/null @@ -1,25 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is a Button. - * - * @param {Object} props - * - * @prop {String} text - text to be shown within the button - * @prop {Function} onClick - function to be triggered when clicking the button - * - * @return {ReactElement} - */ -export default function Button (props) { - return ( - - ) -} - -Button.propTypes = { - text: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired -} diff --git a/src/js/components/view/checkbox-block.js b/src/js/components/view/checkbox-block.js index 2eba011bf..de67d619f 100644 --- a/src/js/components/view/checkbox-block.js +++ b/src/js/components/view/checkbox-block.js @@ -1,6 +1,8 @@ import React from 'react' import PropTypes from 'prop-types' +import {Block} from 'ipfs-react-components' + /** * Is a Checkbox Block. * @@ -19,18 +21,21 @@ export default function CheckboxBlock (props) { } return ( -
-
+ -

{props.title}

-

{props.info}

-
-
- - +
+

{props.title}

+

{props.info}

+
+
+ + +
-
- + )} /> ) } diff --git a/src/js/components/view/file-block.js b/src/js/components/view/file-block.js index 4bf8593d9..058714c1c 100644 --- a/src/js/components/view/file-block.js +++ b/src/js/components/view/file-block.js @@ -4,8 +4,7 @@ import moment from 'moment' import fileExtension from 'file-extension' import {ipcRenderer, clipboard} from 'electron' -import Button from './button' -import Icon from './icon' +import {Button, Icon} from 'ipfs-react-components' /** * Is a File Block. diff --git a/src/js/components/view/footer.js b/src/js/components/view/footer.js deleted file mode 100644 index c098930ba..000000000 --- a/src/js/components/view/footer.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is a Pane's Footer. - * - * @param {Object} props - * - * @prop {Node} children - * - * @return {ReactElement} - */ -export default function Footer (props) { - return ( -
- {props.children} -
- ) -} - -Footer.propTypes = { - children: PropTypes.node.isRequired -} diff --git a/src/js/components/view/header.js b/src/js/components/view/header.js deleted file mode 100644 index f4d7e39f2..000000000 --- a/src/js/components/view/header.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is a Pane's Header. - * - * @param {Object} props - * - * @prop {String} title - The title of the pane - * @prop {String} [subtitle] - Subtitle of the pane - * @prop {Node} [children] - Header children (e.g.: buttons) - * @prop {Bool} [loading] - Show a loading animation - * - * @return {ReactElement} - */ -export default function Header (props) { - let className = 'header' - if (props.loading) { - className += ' loading' - } - - return ( -
-
-

{props.title}

- { props.subtitle !== '' && -

{props.subtitle}

- } -
-
- {props.children} -
-
- ) -} - -Header.propTypes = { - title: PropTypes.string.isRequired, - children: PropTypes.node, - loading: PropTypes.bool, - subtitle: PropTypes.string -} - -Header.defaultProps = { - title: '', - loading: false, - subtitle: '' -} diff --git a/src/js/components/view/icon-button.js b/src/js/components/view/icon-button.js deleted file mode 100644 index 1fd3ee654..000000000 --- a/src/js/components/view/icon-button.js +++ /dev/null @@ -1,33 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -import Icon from './icon' - -/** - * Is a Button with an Icon. - * - * @param {Object} props - * - * @prop {String} icon - icon's name - * @prop {Function} onClick - function to be triggered when clicking the button - * @prop {Bool} [active] - sets the state of the button - * - * @return {ReactElement} - */ -export default function IconButton (props) { - return ( - - ) -} - -IconButton.propTypes = { - icon: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired, - active: PropTypes.bool -} - -IconButton.defaultProps = { - active: false -} diff --git a/src/js/components/view/icon-dropdown-list.js b/src/js/components/view/icon-dropdown-list.js index ee529a923..c28e9a187 100644 --- a/src/js/components/view/icon-dropdown-list.js +++ b/src/js/components/view/icon-dropdown-list.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' -import Icon from './icon' +import {Icon} from 'ipfs-react-components' function onChangeWrapper (fn) { return event => { diff --git a/src/js/components/view/icon.js b/src/js/components/view/icon.js deleted file mode 100644 index 5caac9967..000000000 --- a/src/js/components/view/icon.js +++ /dev/null @@ -1,29 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is an Icon. - * - * @param {Object} props - * - * @prop {String} name - * - * @return {ReactElement} - */ -export default function Icon (props) { - if (props.name === 'ipfs') { - return ( - - - - ) - } - - return ( - - ) -} - -Icon.propTypes = { - name: PropTypes.string.isRequired -} diff --git a/src/js/components/view/info-block.js b/src/js/components/view/info-block.js index 14cfaad62..f8ed132d9 100644 --- a/src/js/components/view/info-block.js +++ b/src/js/components/view/info-block.js @@ -1,7 +1,7 @@ import React from 'react' import PropTypes from 'prop-types' -import Button from '../view/button' +import {Button} from 'ipfs-react-components' /** * Is an information block. diff --git a/src/js/components/view/menu-option.js b/src/js/components/view/menu-option.js deleted file mode 100644 index 91a0a8739..000000000 --- a/src/js/components/view/menu-option.js +++ /dev/null @@ -1,35 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -import Icon from './icon' - -/** - * Is a menu option. - * - * @param {Object} props - * - * @prop {Bool} [active] - * @prop {Function} onClick - * @prop {String} icon - * @prop {String} title - * - * @return {ReactElement} - */ -export default function MenuOption (props) { - let className = 'menu-option' - if (props.active) className += ' active' - - return ( - - ) -} - -MenuOption.propTypes = { - active: PropTypes.bool, - onClick: PropTypes.func.isRequired, - icon: PropTypes.string.isRequired, - title: PropTypes.string.isRequired -} diff --git a/src/js/components/view/pane-container.js b/src/js/components/view/pane-container.js deleted file mode 100644 index 3b673a516..000000000 --- a/src/js/components/view/pane-container.js +++ /dev/null @@ -1,30 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is a Pane. - * - * @param {Object} props - * - * @prop {Node} children - must be elements of component Pane - * @prop {String} [class] - additional class names - * - * @return {ReactElement} - */ -export default function PaneContainer (props) { - let className = 'panes' - if (props.className) { - className += ' ' + props.className - } - - return ( -
- {props.children} -
- ) -} - -PaneContainer.propTypes = { - children: PropTypes.node.isRequired, - className: PropTypes.string -} diff --git a/src/js/components/view/pane.js b/src/js/components/view/pane.js deleted file mode 100644 index be89940bc..000000000 --- a/src/js/components/view/pane.js +++ /dev/null @@ -1,34 +0,0 @@ -import React from 'react' -import PropTypes from 'prop-types' - -/** - * Is a Pane. - * - * @param {Object} props - * - * @prop {Node} children - * @prop {String} [class] - are additional class names - * - * @return {ReactElement} - */ -export default function Pane (props) { - let className = 'pane' - if (props.class) { - className += ' ' + props.class - } - - return ( -
- {props.children} -
- ) -} - -Pane.propTypes = { - children: PropTypes.node.isRequired, - class: PropTypes.string -} - -Pane.defaultProps = { - class: null -} diff --git a/src/js/components/view/pinned-hash.js b/src/js/components/view/pinned-hash.js index 9fc8a6cd0..4958930bc 100644 --- a/src/js/components/view/pinned-hash.js +++ b/src/js/components/view/pinned-hash.js @@ -2,7 +2,7 @@ import React from 'react' import PropTypes from 'prop-types' import {ipcRenderer} from 'electron' -import Button from './button' +import {Button} from 'ipfs-react-components' /** * Is a Pinned Hash. diff --git a/src/js/panes/files.js b/src/js/panes/files.js index b6e7a5110..a0f2f1258 100644 --- a/src/js/panes/files.js +++ b/src/js/panes/files.js @@ -4,11 +4,14 @@ import {ipcRenderer} from 'electron' import {NativeTypes} from 'react-dnd-html5-backend' import {DropTarget} from 'react-dnd' -import Pane from '../components/view/pane' -import Header from '../components/view/header' -import Footer from '../components/view/footer' +import { + Pane, + Header, + Footer, + IconButton +} from 'ipfs-react-components' + import File from '../components/view/file-block' -import IconButton from '../components/view/icon-button' const fileTarget = { drop (props, monitor) { diff --git a/src/js/panes/info.js b/src/js/panes/info.js index 7c2dd14fa..1fcf87c35 100644 --- a/src/js/panes/info.js +++ b/src/js/panes/info.js @@ -3,11 +3,13 @@ import PropTypes from 'prop-types' import {clipboard, ipcRenderer} from 'electron' import prettyBytes from 'pretty-bytes' -import Pane from '../components/view/pane' -import Header from '../components/view/header' -import Footer from '../components/view/footer' -import IconButton from '../components/view/icon-button' -import InfoBlock from '../components/view/info-block' +import { + Pane, + Header, + Footer, + IconButton, + InfoBlock +} from 'ipfs-react-components' function onClickCopy (text) { return () => clipboard.writeText(text) diff --git a/src/js/panes/intro.js b/src/js/panes/intro.js index 075d1563d..3e8fd2368 100644 --- a/src/js/panes/intro.js +++ b/src/js/panes/intro.js @@ -2,9 +2,12 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import {ipcRenderer} from 'electron' -import Pane from '../components/view/pane' -import Button from '../components/view/button' -import Icon from '../components/view/icon' +import { + Pane, + Button, + Icon +} from 'ipfs-react-components' + import IconDropdownList from '../components/view/icon-dropdown-list' export default class Intro extends Component { diff --git a/src/js/panes/loader.js b/src/js/panes/loader.js index d80269b32..5290e6252 100644 --- a/src/js/panes/loader.js +++ b/src/js/panes/loader.js @@ -1,6 +1,6 @@ import React from 'react' -import Pane from '../components/view/pane' +import { Pane } from 'ipfs-react-components' /** * Is a Loader. diff --git a/src/js/panes/peers.js b/src/js/panes/peers.js index 6ea37b219..78310c6f5 100644 --- a/src/js/panes/peers.js +++ b/src/js/panes/peers.js @@ -1,10 +1,12 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import Pane from '../components/view/pane' -import InfoBlock from '../components/view/info-block' -import Header from '../components/view/header' -import Footer from '../components/view/footer' +import { + Pane, + InfoBlock, + Header, + Footer +} from 'ipfs-react-components' export default class Peers extends Component { constructor (props) { diff --git a/src/js/panes/pinned.js b/src/js/panes/pinned.js index 3d222ac18..b4e814aaa 100644 --- a/src/js/panes/pinned.js +++ b/src/js/panes/pinned.js @@ -2,10 +2,13 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' import {ipcRenderer} from 'electron' -import Pane from '../components/view/pane' -import Header from '../components/view/header' -import Footer from '../components/view/footer' -import IconButton from '../components/view/icon-button' +import { + Pane, + Header, + Footer, + IconButton +} from 'ipfs-react-components' + import PinnedHash from '../components/view/pinned-hash' import NewPinnedHash from '../components/logic/new-pinned-hash' diff --git a/src/js/panes/settings.js b/src/js/panes/settings.js index b3bf9fcf1..5fc9c37da 100644 --- a/src/js/panes/settings.js +++ b/src/js/panes/settings.js @@ -2,9 +2,12 @@ import React from 'react' import PropTypes from 'prop-types' import {ipcRenderer} from 'electron' -import Pane from '../components/view/pane' -import Header from '../components/view/header' -import InfoBlock from '../components/view/info-block' +import { + Pane, + Header, + InfoBlock +} from 'ipfs-react-components' + import CheckboxBlock from '../components/view/checkbox-block' import KeyCombo from '../components/view/key-combo' diff --git a/src/js/screens/menu.js b/src/js/screens/menu.js index 1b1681419..d2abb9204 100644 --- a/src/js/screens/menu.js +++ b/src/js/screens/menu.js @@ -3,9 +3,11 @@ import {ipcRenderer} from 'electron' import {DragDropContext} from 'react-dnd' import HTML5Backend from 'react-dnd-html5-backend' -import PaneContainer from '../components/view/pane-container' -import Pane from '../components/view/pane' -import MenuOption from '../components/view/menu-option' +import { + PaneContainer, + Pane, + MenuOption +} from 'ipfs-react-components' import Loader from '../panes/loader' import Files from '../panes/files' diff --git a/src/js/screens/welcome.js b/src/js/screens/welcome.js index fee02110a..a81bed949 100644 --- a/src/js/screens/welcome.js +++ b/src/js/screens/welcome.js @@ -4,8 +4,11 @@ import {ipcRenderer} from 'electron' import Intro from '../panes/intro' import Loader from '../panes/loader' -import PaneContainer from '../components/view/pane-container' -import Pane from '../components/view/pane' +import { + Pane, + PaneContainer +} from 'ipfs-react-components' + import Heartbeat from '../components/view/heartbeat' const INTRO = 'intro' diff --git a/src/styles/app.less b/src/styles/app.less index d3f650943..4fa7dc784 100644 --- a/src/styles/app.less +++ b/src/styles/app.less @@ -1,11 +1,8 @@ @import '../../node_modules/normalize.css/normalize.css'; -@import './fonts.less'; -@import './themify-icons.less'; @import './common.less'; @import './components/heartbeat.less'; @import './components/pane.less'; -@import './components/info-block.less'; @import './components/file-block.less'; @import './components/checkbox-block.less'; @import './components/new-pinned-hash.less'; diff --git a/src/styles/components/info-block.less b/src/styles/components/info-block.less deleted file mode 100644 index 6edbfec97..000000000 --- a/src/styles/components/info-block.less +++ /dev/null @@ -1,100 +0,0 @@ -@import '../variables.less'; - -.info-block { - padding: 0 1em; - transition: .2s ease background-color; - position: relative; - - &.clickable { - cursor: pointer; - } - - .wrapper { - padding: 1em 0; - border-top: 1px solid rgba(255, 255, 255, 0.2); - display: flex; - } - - .wrapper > div { - max-width: 100%; - } - - &:hover { - background: #202020; - } - - &:first-of-type { - border-top: 0; - } - - p { - text-overflow: ellipsis; - white-space: nowrap; - overflow: hidden; - margin: 0; - } - - .label { - margin-bottom: 0.2em; - font-size: @medium-font; - } - - .info { - color: rgba(255, 255, 255, 0.5); - font-size: @normal-font; - } - - .button-overlay { - opacity: 0; - transition: .2s ease opacity; - position: absolute; - top: 1em; - right: 1em; - height: calc(~"100% - 2em"); - width: 50%; - background: linear-gradient(to left, #202020 0%, #202020 50%, transparent 100%); - align-items: center; - justify-content: flex-end; - display: flex; - } - - .button-overlay .button { - margin-left: 0.5em; - } - - &:hover .button-overlay { - opacity: 1; - } - - input.info, - input.label { - background: transparent; - display: block; - padding: 0; - color: inherit; - width: 100%; - } - - .right { - margin-left: auto; - padding-left: 1em; - } -} - -.light .info-block { - &>div { - border-color: rgba(0, 0, 0, 0.1); - } - - &:hover { - background: #fbfbfb; - } - - .info { - color: rgba(0, 0, 0, 0.5); - } - - .button-overlay { - background: linear-gradient(to left, #fbfbfb 0%, #fbfbfb 50%, transparent 100%); - } -} diff --git a/src/styles/fonts.less b/src/styles/fonts.less deleted file mode 100644 index 34b409dfc..000000000 --- a/src/styles/fonts.less +++ /dev/null @@ -1,15 +0,0 @@ -@charset 'UTF-8'; - -@font-face { - font-family: 'Inter UI'; - font-style: normal; - font-weight: 400; - src: url("../fonts/Inter-UI-Regular.woff2?v=2.3") format("woff2"), url("../fonts/Inter-UI-Regular.woff?v=2.3") format("woff"); -} - -@font-face { - font-family: 'Inter UI'; - font-style: normal; - font-weight: 500; - src: url("../fonts/Inter-UI-Medium.woff2?v=2.3") format("woff2"), url("../fonts/Inter-UI-Medium.woff?v=2.3") format("woff"); -} \ No newline at end of file diff --git a/src/styles/themify-icons.less b/src/styles/themify-icons.less deleted file mode 100644 index 847e86abe..000000000 --- a/src/styles/themify-icons.less +++ /dev/null @@ -1,1082 +0,0 @@ -@font-face { - font-family: 'themify'; - src:url('../fonts/themify.eot?-fvbane'); - src:url('../fonts/themify.eot?#iefix-fvbane') format('embedded-opentype'), - url('../fonts/themify.woff?-fvbane') format('woff'), - url('../fonts/themify.ttf?-fvbane') format('truetype'), - url('../fonts/themify.svg?-fvbane#themify') format('svg'); - font-weight: normal; - font-style: normal; -} - -[class^="ti-"], [class*=" ti-"] { - font-family: 'themify'; - font-size: 1.25em; - speak: none; - font-style: normal; - font-weight: normal; - font-variant: normal; - text-transform: none; - line-height: 1; - - /* Better Font Rendering =========== */ - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -.ti-wand:before { - content: "\e600"; -} -.ti-volume:before { - content: "\e601"; -} -.ti-user:before { - content: "\e602"; -} -.ti-unlock:before { - content: "\e603"; -} -.ti-unlink:before { - content: "\e604"; -} -.ti-trash:before { - content: "\e605"; -} -.ti-thought:before { - content: "\e606"; -} -.ti-target:before { - content: "\e607"; -} -.ti-tag:before { - content: "\e608"; -} -.ti-tablet:before { - content: "\e609"; -} -.ti-star:before { - content: "\e60a"; -} -.ti-spray:before { - content: "\e60b"; -} -.ti-signal:before { - content: "\e60c"; -} -.ti-shopping-cart:before { - content: "\e60d"; -} -.ti-shopping-cart-full:before { - content: "\e60e"; -} -.ti-settings:before { - content: "\e60f"; -} -.ti-search:before { - content: "\e610"; -} -.ti-zoom-in:before { - content: "\e611"; -} -.ti-zoom-out:before { - content: "\e612"; -} -.ti-cut:before { - content: "\e613"; -} -.ti-ruler:before { - content: "\e614"; -} -.ti-ruler-pencil:before { - content: "\e615"; -} -.ti-ruler-alt:before { - content: "\e616"; -} -.ti-bookmark:before { - content: "\e617"; -} -.ti-bookmark-alt:before { - content: "\e618"; -} -.ti-reload:before { - content: "\e619"; -} -.ti-plus:before { - content: "\e61a"; -} -.ti-pin:before { - content: "\e61b"; -} -.ti-pencil:before { - content: "\e61c"; -} -.ti-pencil-alt:before { - content: "\e61d"; -} -.ti-paint-roller:before { - content: "\e61e"; -} -.ti-paint-bucket:before { - content: "\e61f"; -} -.ti-na:before { - content: "\e620"; -} -.ti-mobile:before { - content: "\e621"; -} -.ti-minus:before { - content: "\e622"; -} -.ti-medall:before { - content: "\e623"; -} -.ti-medall-alt:before { - content: "\e624"; -} -.ti-marker:before { - content: "\e625"; -} -.ti-marker-alt:before { - content: "\e626"; -} -.ti-arrow-up:before { - content: "\e627"; -} -.ti-arrow-right:before { - content: "\e628"; -} -.ti-arrow-left:before { - content: "\e629"; -} -.ti-arrow-down:before { - content: "\e62a"; -} -.ti-lock:before { - content: "\e62b"; -} -.ti-location-arrow:before { - content: "\e62c"; -} -.ti-link:before { - content: "\e62d"; -} -.ti-layout:before { - content: "\e62e"; -} -.ti-layers:before { - content: "\e62f"; -} -.ti-layers-alt:before { - content: "\e630"; -} -.ti-key:before { - content: "\e631"; -} -.ti-import:before { - content: "\e632"; -} -.ti-image:before { - content: "\e633"; -} -.ti-heart:before { - content: "\e634"; -} -.ti-heart-broken:before { - content: "\e635"; -} -.ti-hand-stop:before { - content: "\e636"; -} -.ti-hand-open:before { - content: "\e637"; -} -.ti-hand-drag:before { - content: "\e638"; -} -.ti-folder:before { - content: "\e639"; -} -.ti-flag:before { - content: "\e63a"; -} -.ti-flag-alt:before { - content: "\e63b"; -} -.ti-flag-alt-2:before { - content: "\e63c"; -} -.ti-eye:before { - content: "\e63d"; -} -.ti-export:before { - content: "\e63e"; -} -.ti-exchange-vertical:before { - content: "\e63f"; -} -.ti-desktop:before { - content: "\e640"; -} -.ti-cup:before { - content: "\e641"; -} -.ti-crown:before { - content: "\e642"; -} -.ti-comments:before { - content: "\e643"; -} -.ti-comment:before { - content: "\e644"; -} -.ti-comment-alt:before { - content: "\e645"; -} -.ti-close:before { - content: "\e646"; -} -.ti-clip:before { - content: "\e647"; -} -.ti-angle-up:before { - content: "\e648"; -} -.ti-angle-right:before { - content: "\e649"; -} -.ti-angle-left:before { - content: "\e64a"; -} -.ti-angle-down:before { - content: "\e64b"; -} -.ti-check:before { - content: "\e64c"; -} -.ti-check-box:before { - content: "\e64d"; -} -.ti-camera:before { - content: "\e64e"; -} -.ti-announcement:before { - content: "\e64f"; -} -.ti-brush:before { - content: "\e650"; -} -.ti-briefcase:before { - content: "\e651"; -} -.ti-bolt:before { - content: "\e652"; -} -.ti-bolt-alt:before { - content: "\e653"; -} -.ti-blackboard:before { - content: "\e654"; -} -.ti-bag:before { - content: "\e655"; -} -.ti-move:before { - content: "\e656"; -} -.ti-arrows-vertical:before { - content: "\e657"; -} -.ti-arrows-horizontal:before { - content: "\e658"; -} -.ti-fullscreen:before { - content: "\e659"; -} -.ti-arrow-top-right:before { - content: "\e65a"; -} -.ti-arrow-top-left:before { - content: "\e65b"; -} -.ti-arrow-circle-up:before { - content: "\e65c"; -} -.ti-arrow-circle-right:before { - content: "\e65d"; -} -.ti-arrow-circle-left:before { - content: "\e65e"; -} -.ti-arrow-circle-down:before { - content: "\e65f"; -} -.ti-angle-double-up:before { - content: "\e660"; -} -.ti-angle-double-right:before { - content: "\e661"; -} -.ti-angle-double-left:before { - content: "\e662"; -} -.ti-angle-double-down:before { - content: "\e663"; -} -.ti-zip:before { - content: "\e664"; -} -.ti-world:before { - content: "\e665"; -} -.ti-wheelchair:before { - content: "\e666"; -} -.ti-view-list:before { - content: "\e667"; -} -.ti-view-list-alt:before { - content: "\e668"; -} -.ti-view-grid:before { - content: "\e669"; -} -.ti-uppercase:before { - content: "\e66a"; -} -.ti-upload:before { - content: "\e66b"; -} -.ti-underline:before { - content: "\e66c"; -} -.ti-truck:before { - content: "\e66d"; -} -.ti-timer:before { - content: "\e66e"; -} -.ti-ticket:before { - content: "\e66f"; -} -.ti-thumb-up:before { - content: "\e670"; -} -.ti-thumb-down:before { - content: "\e671"; -} -.ti-text:before { - content: "\e672"; -} -.ti-stats-up:before { - content: "\e673"; -} -.ti-stats-down:before { - content: "\e674"; -} -.ti-split-v:before { - content: "\e675"; -} -.ti-split-h:before { - content: "\e676"; -} -.ti-smallcap:before { - content: "\e677"; -} -.ti-shine:before { - content: "\e678"; -} -.ti-shift-right:before { - content: "\e679"; -} -.ti-shift-left:before { - content: "\e67a"; -} -.ti-shield:before { - content: "\e67b"; -} -.ti-notepad:before { - content: "\e67c"; -} -.ti-server:before { - content: "\e67d"; -} -.ti-quote-right:before { - content: "\e67e"; -} -.ti-quote-left:before { - content: "\e67f"; -} -.ti-pulse:before { - content: "\e680"; -} -.ti-printer:before { - content: "\e681"; -} -.ti-power-off:before { - content: "\e682"; -} -.ti-plug:before { - content: "\e683"; -} -.ti-pie-chart:before { - content: "\e684"; -} -.ti-paragraph:before { - content: "\e685"; -} -.ti-panel:before { - content: "\e686"; -} -.ti-package:before { - content: "\e687"; -} -.ti-music:before { - content: "\e688"; -} -.ti-music-alt:before { - content: "\e689"; -} -.ti-mouse:before { - content: "\e68a"; -} -.ti-mouse-alt:before { - content: "\e68b"; -} -.ti-money:before { - content: "\e68c"; -} -.ti-microphone:before { - content: "\e68d"; -} -.ti-menu:before { - content: "\e68e"; -} -.ti-menu-alt:before { - content: "\e68f"; -} -.ti-map:before { - content: "\e690"; -} -.ti-map-alt:before { - content: "\e691"; -} -.ti-loop:before { - content: "\e692"; -} -.ti-location-pin:before { - content: "\e693"; -} -.ti-list:before { - content: "\e694"; -} -.ti-light-bulb:before { - content: "\e695"; -} -.ti-Italic:before { - content: "\e696"; -} -.ti-info:before { - content: "\e697"; -} -.ti-infinite:before { - content: "\e698"; -} -.ti-id-badge:before { - content: "\e699"; -} -.ti-hummer:before { - content: "\e69a"; -} -.ti-home:before { - content: "\e69b"; -} -.ti-help:before { - content: "\e69c"; -} -.ti-headphone:before { - content: "\e69d"; -} -.ti-harddrives:before { - content: "\e69e"; -} -.ti-harddrive:before { - content: "\e69f"; -} -.ti-gift:before { - content: "\e6a0"; -} -.ti-game:before { - content: "\e6a1"; -} -.ti-filter:before { - content: "\e6a2"; -} -.ti-files:before { - content: "\e6a3"; -} -.ti-file:before { - content: "\e6a4"; -} -.ti-eraser:before { - content: "\e6a5"; -} -.ti-envelope:before { - content: "\e6a6"; -} -.ti-download:before { - content: "\e6a7"; -} -.ti-direction:before { - content: "\e6a8"; -} -.ti-direction-alt:before { - content: "\e6a9"; -} -.ti-dashboard:before { - content: "\e6aa"; -} -.ti-control-stop:before { - content: "\e6ab"; -} -.ti-control-shuffle:before { - content: "\e6ac"; -} -.ti-control-play:before { - content: "\e6ad"; -} -.ti-control-pause:before { - content: "\e6ae"; -} -.ti-control-forward:before { - content: "\e6af"; -} -.ti-control-backward:before { - content: "\e6b0"; -} -.ti-cloud:before { - content: "\e6b1"; -} -.ti-cloud-up:before { - content: "\e6b2"; -} -.ti-cloud-down:before { - content: "\e6b3"; -} -.ti-clipboard:before { - content: "\e6b4"; -} -.ti-car:before { - content: "\e6b5"; -} -.ti-calendar:before { - content: "\e6b6"; -} -.ti-book:before { - content: "\e6b7"; -} -.ti-bell:before { - content: "\e6b8"; -} -.ti-basketball:before { - content: "\e6b9"; -} -.ti-bar-chart:before { - content: "\e6ba"; -} -.ti-bar-chart-alt:before { - content: "\e6bb"; -} -.ti-back-right:before { - content: "\e6bc"; -} -.ti-back-left:before { - content: "\e6bd"; -} -.ti-arrows-corner:before { - content: "\e6be"; -} -.ti-archive:before { - content: "\e6bf"; -} -.ti-anchor:before { - content: "\e6c0"; -} -.ti-align-right:before { - content: "\e6c1"; -} -.ti-align-left:before { - content: "\e6c2"; -} -.ti-align-justify:before { - content: "\e6c3"; -} -.ti-align-center:before { - content: "\e6c4"; -} -.ti-alert:before { - content: "\e6c5"; -} -.ti-alarm-clock:before { - content: "\e6c6"; -} -.ti-agenda:before { - content: "\e6c7"; -} -.ti-write:before { - content: "\e6c8"; -} -.ti-window:before { - content: "\e6c9"; -} -.ti-widgetized:before { - content: "\e6ca"; -} -.ti-widget:before { - content: "\e6cb"; -} -.ti-widget-alt:before { - content: "\e6cc"; -} -.ti-wallet:before { - content: "\e6cd"; -} -.ti-video-clapper:before { - content: "\e6ce"; -} -.ti-video-camera:before { - content: "\e6cf"; -} -.ti-vector:before { - content: "\e6d0"; -} -.ti-themify-logo:before { - content: "\e6d1"; -} -.ti-themify-favicon:before { - content: "\e6d2"; -} -.ti-themify-favicon-alt:before { - content: "\e6d3"; -} -.ti-support:before { - content: "\e6d4"; -} -.ti-stamp:before { - content: "\e6d5"; -} -.ti-split-v-alt:before { - content: "\e6d6"; -} -.ti-slice:before { - content: "\e6d7"; -} -.ti-shortcode:before { - content: "\e6d8"; -} -.ti-shift-right-alt:before { - content: "\e6d9"; -} -.ti-shift-left-alt:before { - content: "\e6da"; -} -.ti-ruler-alt-2:before { - content: "\e6db"; -} -.ti-receipt:before { - content: "\e6dc"; -} -.ti-pin2:before { - content: "\e6dd"; -} -.ti-pin-alt:before { - content: "\e6de"; -} -.ti-pencil-alt2:before { - content: "\e6df"; -} -.ti-palette:before { - content: "\e6e0"; -} -.ti-more:before { - content: "\e6e1"; -} -.ti-more-alt:before { - content: "\e6e2"; -} -.ti-microphone-alt:before { - content: "\e6e3"; -} -.ti-magnet:before { - content: "\e6e4"; -} -.ti-line-double:before { - content: "\e6e5"; -} -.ti-line-dotted:before { - content: "\e6e6"; -} -.ti-line-dashed:before { - content: "\e6e7"; -} -.ti-layout-width-full:before { - content: "\e6e8"; -} -.ti-layout-width-default:before { - content: "\e6e9"; -} -.ti-layout-width-default-alt:before { - content: "\e6ea"; -} -.ti-layout-tab:before { - content: "\e6eb"; -} -.ti-layout-tab-window:before { - content: "\e6ec"; -} -.ti-layout-tab-v:before { - content: "\e6ed"; -} -.ti-layout-tab-min:before { - content: "\e6ee"; -} -.ti-layout-slider:before { - content: "\e6ef"; -} -.ti-layout-slider-alt:before { - content: "\e6f0"; -} -.ti-layout-sidebar-right:before { - content: "\e6f1"; -} -.ti-layout-sidebar-none:before { - content: "\e6f2"; -} -.ti-layout-sidebar-left:before { - content: "\e6f3"; -} -.ti-layout-placeholder:before { - content: "\e6f4"; -} -.ti-layout-menu:before { - content: "\e6f5"; -} -.ti-layout-menu-v:before { - content: "\e6f6"; -} -.ti-layout-menu-separated:before { - content: "\e6f7"; -} -.ti-layout-menu-full:before { - content: "\e6f8"; -} -.ti-layout-media-right-alt:before { - content: "\e6f9"; -} -.ti-layout-media-right:before { - content: "\e6fa"; -} -.ti-layout-media-overlay:before { - content: "\e6fb"; -} -.ti-layout-media-overlay-alt:before { - content: "\e6fc"; -} -.ti-layout-media-overlay-alt-2:before { - content: "\e6fd"; -} -.ti-layout-media-left-alt:before { - content: "\e6fe"; -} -.ti-layout-media-left:before { - content: "\e6ff"; -} -.ti-layout-media-center-alt:before { - content: "\e700"; -} -.ti-layout-media-center:before { - content: "\e701"; -} -.ti-layout-list-thumb:before { - content: "\e702"; -} -.ti-layout-list-thumb-alt:before { - content: "\e703"; -} -.ti-layout-list-post:before { - content: "\e704"; -} -.ti-layout-list-large-image:before { - content: "\e705"; -} -.ti-layout-line-solid:before { - content: "\e706"; -} -.ti-layout-grid4:before { - content: "\e707"; -} -.ti-layout-grid3:before { - content: "\e708"; -} -.ti-layout-grid2:before { - content: "\e709"; -} -.ti-layout-grid2-thumb:before { - content: "\e70a"; -} -.ti-layout-cta-right:before { - content: "\e70b"; -} -.ti-layout-cta-left:before { - content: "\e70c"; -} -.ti-layout-cta-center:before { - content: "\e70d"; -} -.ti-layout-cta-btn-right:before { - content: "\e70e"; -} -.ti-layout-cta-btn-left:before { - content: "\e70f"; -} -.ti-layout-column4:before { - content: "\e710"; -} -.ti-layout-column3:before { - content: "\e711"; -} -.ti-layout-column2:before { - content: "\e712"; -} -.ti-layout-accordion-separated:before { - content: "\e713"; -} -.ti-layout-accordion-merged:before { - content: "\e714"; -} -.ti-layout-accordion-list:before { - content: "\e715"; -} -.ti-ink-pen:before { - content: "\e716"; -} -.ti-info-alt:before { - content: "\e717"; -} -.ti-help-alt:before { - content: "\e718"; -} -.ti-headphone-alt:before { - content: "\e719"; -} -.ti-hand-point-up:before { - content: "\e71a"; -} -.ti-hand-point-right:before { - content: "\e71b"; -} -.ti-hand-point-left:before { - content: "\e71c"; -} -.ti-hand-point-down:before { - content: "\e71d"; -} -.ti-gallery:before { - content: "\e71e"; -} -.ti-face-smile:before { - content: "\e71f"; -} -.ti-face-sad:before { - content: "\e720"; -} -.ti-credit-card:before { - content: "\e721"; -} -.ti-control-skip-forward:before { - content: "\e722"; -} -.ti-control-skip-backward:before { - content: "\e723"; -} -.ti-control-record:before { - content: "\e724"; -} -.ti-control-eject:before { - content: "\e725"; -} -.ti-comments-smiley:before { - content: "\e726"; -} -.ti-brush-alt:before { - content: "\e727"; -} -.ti-youtube:before { - content: "\e728"; -} -.ti-vimeo:before { - content: "\e729"; -} -.ti-twitter:before { - content: "\e72a"; -} -.ti-time:before { - content: "\e72b"; -} -.ti-tumblr:before { - content: "\e72c"; -} -.ti-skype:before { - content: "\e72d"; -} -.ti-share:before { - content: "\e72e"; -} -.ti-share-alt:before { - content: "\e72f"; -} -.ti-rocket:before { - content: "\e730"; -} -.ti-pinterest:before { - content: "\e731"; -} -.ti-new-window:before { - content: "\e732"; -} -.ti-microsoft:before { - content: "\e733"; -} -.ti-list-ol:before { - content: "\e734"; -} -.ti-linkedin:before { - content: "\e735"; -} -.ti-layout-sidebar-2:before { - content: "\e736"; -} -.ti-layout-grid4-alt:before { - content: "\e737"; -} -.ti-layout-grid3-alt:before { - content: "\e738"; -} -.ti-layout-grid2-alt:before { - content: "\e739"; -} -.ti-layout-column4-alt:before { - content: "\e73a"; -} -.ti-layout-column3-alt:before { - content: "\e73b"; -} -.ti-layout-column2-alt:before { - content: "\e73c"; -} -.ti-instagram:before { - content: "\e73d"; -} -.ti-google:before { - content: "\e73e"; -} -.ti-github:before { - content: "\e73f"; -} -.ti-flickr:before { - content: "\e740"; -} -.ti-facebook:before { - content: "\e741"; -} -.ti-dropbox:before { - content: "\e742"; -} -.ti-dribbble:before { - content: "\e743"; -} -.ti-apple:before { - content: "\e744"; -} -.ti-android:before { - content: "\e745"; -} -.ti-save:before { - content: "\e746"; -} -.ti-save-alt:before { - content: "\e747"; -} -.ti-yahoo:before { - content: "\e748"; -} -.ti-wordpress:before { - content: "\e749"; -} -.ti-vimeo-alt:before { - content: "\e74a"; -} -.ti-twitter-alt:before { - content: "\e74b"; -} -.ti-tumblr-alt:before { - content: "\e74c"; -} -.ti-trello:before { - content: "\e74d"; -} -.ti-stack-overflow:before { - content: "\e74e"; -} -.ti-soundcloud:before { - content: "\e74f"; -} -.ti-sharethis:before { - content: "\e750"; -} -.ti-sharethis-alt:before { - content: "\e751"; -} -.ti-reddit:before { - content: "\e752"; -} -.ti-pinterest-alt:before { - content: "\e753"; -} -.ti-microsoft-alt:before { - content: "\e754"; -} -.ti-linux:before { - content: "\e755"; -} -.ti-jsfiddle:before { - content: "\e756"; -} -.ti-joomla:before { - content: "\e757"; -} -.ti-html5:before { - content: "\e758"; -} -.ti-flickr-alt:before { - content: "\e759"; -} -.ti-email:before { - content: "\e75a"; -} -.ti-drupal:before { - content: "\e75b"; -} -.ti-dropbox-alt:before { - content: "\e75c"; -} -.ti-css3:before { - content: "\e75d"; -} -.ti-rss:before { - content: "\e75e"; -} -.ti-rss-alt:before { - content: "\e75f"; -} \ No newline at end of file