mirror of https://github.com/infosecn1nja/C3.git
F-secure style
Andras Toth
parent
f80ee0f666
commit
3e44a95155
|
|
@ -1,30 +0,0 @@
|
|||
|
||||
|
||||
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150.49 201.51">
|
||||
<defs>
|
||||
<style>.cls-1{fill:#fff;}.cls-2{fill:#69c293;}
|
||||
</style>
|
||||
</defs>
|
||||
<title>MWR-C3_logo
|
||||
</title>
|
||||
<rect class="cls-1" x="25.25" y="132.94" width="22.73" height="2.46"/>
|
||||
<rect class="cls-2" x="139.21" y="72.11" width="7.68" height="2.46"/>
|
||||
<polygon class="cls-1" points="57.34 168.05 57.34 155.55 44.85 155.55 44.85 137.2 25.09 137.2 25.09 156.96 44.85 156.96 44.85 168.05 57.34 168.05"/>
|
||||
<rect class="cls-1" x="11.79" y="161.8" width="13.3" height="13.31"/>
|
||||
<rect class="cls-1" x="37.59" y="178.93" width="7.26" height="7.26"/>
|
||||
<rect class="cls-1" x="8.96" y="143.05" width="9.68" height="9.68"/>
|
||||
<rect class="cls-2" x="78.51" y="153.47" width="11.76" height="11.76"/>
|
||||
<rect class="cls-1" x="75.49" y="182.56" width="8.87" height="8.87"/>
|
||||
<rect class="cls-1" x="54.52" y="193.85" width="7.66" height="7.66"/>
|
||||
<rect class="cls-1" x="60.37" y="171.67" width="7.06" height="7.06"/>
|
||||
<rect class="cls-2" x="104.37" y="136.52" width="13.98" height="13.98"/>
|
||||
<rect class="cls-2" x="94.96" y="156.92" width="9.41" height="9.41"/>
|
||||
<rect class="cls-2" x="113.22" y="169.04" width="5.14" height="5.13"/>
|
||||
<rect class="cls-2" x="92.97" y="143.65" width="6.85" height="6.85"/>
|
||||
<path class="cls-1" d="M204,221.7v-2.77h-5.53V213.1h11.37V194.67h0l.17-3.38H187.15l.26,16v10.45h-2.5v10.08h2.5v9.27l-18.73.17v-9.82h-4.16v-7.65h0V154.91a11.36,11.36,0,0,1,3.25-8.52,10.69,10.69,0,0,1,7.9-3.31,11.28,11.28,0,0,1,11.25,11.26v15.17h20.23V154.75a30,30,0,0,0-9-21.88,29.58,29.58,0,0,0-21.88-9.09,30.93,30.93,0,0,0-31,31v77.39h-4.88V234h-3.07v1.53h7.07v11.26h-4.76v13.07h-5.13V265h5.13v-4.9H153v-5.52h34.87v15.07h10.59v10.58h12.49V269.64H212V245.46h-8V226.31" transform="translate(-134.52 -123.47)"/>
|
||||
<path class="cls-2" d="M212,221.5l1,17.64,1.39.07v19h3.63v8.87h9.41v-8.26h31.38V276h-6v8.84h8.84v-7.7h15v5.71H285V274.5h-4.75V255.72h-9.6V239.21h6.45v-2h3.15V230h-3.15V201.42h-3.38V198h-25.5v-2.45h22.7c-3.74-4.85-6.05-7.14-10.28-9.36a30,30,0,0,0,7.23-6.29,31.76,31.76,0,0,0,7.23-20.86v-5.47q0-12.48-7.44-20.85-8.25-9.28-22-9.29-14.46,0-22.4,9.91-7,8.67-7,22.5v3h19.09v-3.39a18,18,0,0,1,2.17-9.34q2.9-4.71,9.09-4.72,11.14,0,11.14,12.69v3q0,10.2-4.95,15.88-5.37,6.28-16.62,6.28v16.09l-9.15.23H216.6V198h21.5v10.14h17.2v31h-1v-3.76H240.89v3.76h-4.27v-3.13h-4.36V218.63H212v2.87" transform="translate(-134.52 -123.47)"/>
|
||||
<rect class="cls-2" x="140.03" y="171.61" width="6.27" height="6.27"/>
|
||||
<rect class="cls-2" x="118.92" y="185.87" width="5.42" height="5.42"/>
|
||||
<rect class="cls-2" x="129.33" y="163.91" width="4.99" height="4.99"/>
|
||||
<rect class="cls-2" x="140.67" y="124.23" width="4.99" height="4.99"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 8.4 KiB |
|
|
@ -0,0 +1,4 @@
|
|||
|
||||
<svg width="94" height="30" viewBox="0 0 94 30" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M89.5444 28.3005C85.9212 30.4364 80.2276 31.5044 72.9813 25.6307L76.6044 21.3589C77.6396 22.2488 80.5382 24.0287 83.8508 24.0287C87.1634 24.0287 87.474 22.4268 87.474 21.3589C87.088 19.7659 85.6976 19.14 83.6176 18.2035C82.9087 17.8843 82.1196 17.529 81.2628 17.0871C75.8733 14.3071 74.0165 11.7474 74.0165 9.07753C74.0165 6.40767 75.0517 0 83.8508 0V5.87369C82.8156 5.87369 80.7452 6.30087 80.7452 8.00958C80.7452 9.68055 82.3292 10.3711 84.0101 11.1039L84.0101 11.1039L84.0103 11.104C84.4779 11.3078 84.953 11.515 85.4036 11.7474C85.7667 11.9347 86.2254 12.1384 86.7405 12.3672C89.1623 13.443 92.8315 15.0728 93.6852 18.1551C94.7204 21.8929 93.1676 26.1646 89.5444 28.3005ZM21.2215 29.3685L30.0207 0.533972H37.267L42.443 16.5531H36.2318L33.6438 5.87369L31.0559 17.0871H33.6438V22.4268H29.5031L27.9503 29.3685H21.2215ZM0 9.6115H5.69357V23.4948H18.1159V29.3685H0V9.6115ZM54.3477 9.07753H48.1366V29.3685H59.0061C65.2173 29.3685 69.3581 25.951 69.3581 20.8249C69.3581 15.6988 65.2173 14.0613 63.1469 13.8833C66.4595 13.8833 67.6328 10.3235 67.8053 8.54355C67.8053 2.56307 63.3194 0.711963 61.0765 0.533972H57.9709V5.87369C59.1787 5.6957 61.5941 5.98049 61.5941 8.54355C61.5941 11.1066 59.5237 11.7474 58.4885 11.7474H54.3477V9.07753ZM54.3478 16.2627V23.6072H59.0061C60.3864 23.6072 63.1469 22.8727 63.1469 19.935C63.1469 16.9972 60.3864 16.2627 59.0061 16.2627H54.3478Z" fill="#2297FF"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
|
|
@ -6,13 +6,9 @@
|
|||
:class="fullscreenIcon"
|
||||
@click="isFullscreen = !isFullscreen"
|
||||
></span>
|
||||
<span
|
||||
class="c3canvas-more-btn icon more"
|
||||
></span>
|
||||
<span class="c3canvas-more-btn icon more"></span>
|
||||
<ul class="c3canvas-menu">
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
>
|
||||
<li class="c3canvas-menu-item">
|
||||
<Toggle
|
||||
key="toggle-tree-view-button"
|
||||
legend="Tree View"
|
||||
|
|
@ -21,9 +17,7 @@
|
|||
:disabled="false"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
>
|
||||
<li class="c3canvas-menu-item">
|
||||
<Toggle
|
||||
key="toggle-interfaces-button"
|
||||
legend="Interfaces"
|
||||
|
|
@ -32,9 +26,7 @@
|
|||
:disabled="false"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
>
|
||||
<li class="c3canvas-menu-item">
|
||||
<Toggle
|
||||
key="toggle-labels-button"
|
||||
legend="Labels"
|
||||
|
|
@ -43,9 +35,7 @@
|
|||
:disabled="false"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
>
|
||||
<li class="c3canvas-menu-item">
|
||||
<Toggle
|
||||
key="toggle-physics-button"
|
||||
legend="Physics"
|
||||
|
|
@ -54,9 +44,7 @@
|
|||
:disabled="false"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
>
|
||||
<li class="c3canvas-menu-item">
|
||||
<Toggle
|
||||
key="toggle-smooth-edges"
|
||||
legend="Smooth Edges"
|
||||
|
|
@ -65,30 +53,13 @@
|
|||
:disabled="false"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
@click="reloadGraph"
|
||||
>
|
||||
Reload Graph
|
||||
</li>
|
||||
<li class="c3canvas-menu-item" @click="reloadGraph">Reload Graph</li>
|
||||
<li class="c3canvas-menu-divider"></li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
@click="openModal('', 'CREATE_GATEWAY')"
|
||||
>
|
||||
New Gateway
|
||||
</li>
|
||||
<li
|
||||
class="c3canvas-menu-item"
|
||||
@click="openModal('', 'CREATE_RELAY')"
|
||||
>
|
||||
New Relay
|
||||
</li>
|
||||
<li class="c3canvas-menu-item" @click="openModal('', 'CREATE_GATEWAY')">New Gateway</li>
|
||||
<li class="c3canvas-menu-item" @click="openModal('', 'CREATE_RELAY')">New Relay</li>
|
||||
</ul>
|
||||
<div class="progress-bar">
|
||||
<div class="progress-bar-status" id="progress-bar-status">
|
||||
|
||||
</div>
|
||||
<div class="progress-bar-status" id="progress-bar-status"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -101,7 +72,13 @@ import { DataSet, DataView, Network, Options } from 'vis';
|
|||
|
||||
import { NodeKlass, C3Node, C3Edge, nullNode } from '@/types/c3types';
|
||||
import { GetNodeKlassFn, FetchC3DataFn } from '@/store/C3Module';
|
||||
import { SetOptionslFn, SetGraphDataFn, GenerateNodesFn, GenerateEdgesFn, SetOptionFn } from '@/store/VisModule';
|
||||
import {
|
||||
SetOptionslFn,
|
||||
SetGraphDataFn,
|
||||
GenerateNodesFn,
|
||||
GenerateEdgesFn,
|
||||
SetOptionFn,
|
||||
} from '@/store/VisModule';
|
||||
|
||||
import C3 from '@/c3';
|
||||
import Toggle from '@/components/form/Toggle.vue';
|
||||
|
|
@ -116,7 +93,6 @@ const VisModule = namespace('visModule');
|
|||
},
|
||||
})
|
||||
export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
||||
|
||||
get fullscreenIcon() {
|
||||
return this.isFullscreen ? 'zoomin' : 'fullscreen';
|
||||
}
|
||||
|
|
@ -145,7 +121,6 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
return this.isSmooth;
|
||||
}
|
||||
|
||||
|
||||
@VisModule.Action public generateNodes!: GenerateNodesFn;
|
||||
@VisModule.Action public generateEdges!: GenerateEdgesFn;
|
||||
|
||||
|
|
@ -179,14 +154,18 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
|
||||
public createVisCanvas(): void {
|
||||
this.container = this.$refs.c3canvas;
|
||||
(window as any).networkc3 = new Network(this.container, this.getGrapData, this.graphOtions);
|
||||
(window as any).networkc3 = new Network(
|
||||
this.container,
|
||||
this.getGrapData,
|
||||
this.graphOtions,
|
||||
);
|
||||
|
||||
(window as any).networkc3.on('click', (params: any) => {
|
||||
const nodeid = (window as any).networkc3.getNodeAt(params.pointer.DOM);
|
||||
if (this.lastClickNodeId === nodeid) {
|
||||
if (!!nodeid) {
|
||||
this.openModal(nodeid, this.nodeKlass(nodeid));
|
||||
}
|
||||
if (!!nodeid) {
|
||||
this.openModal(nodeid, this.nodeKlass(nodeid));
|
||||
}
|
||||
} else {
|
||||
this.lastClickNodeId = nodeid;
|
||||
}
|
||||
|
|
@ -205,7 +184,9 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
});
|
||||
|
||||
(window as any).networkc3.on('stabilizationProgress', (params: any) => {
|
||||
const status = (Math.floor(params.iterations / this.getOptions.physics.stabilization.updateInterval));
|
||||
const status = Math.floor(
|
||||
params.iterations / this.getOptions.physics.stabilization.updateInterval,
|
||||
);
|
||||
const progressBarStatus = document.getElementById('progress-bar-status');
|
||||
if (progressBarStatus !== null) {
|
||||
progressBarStatus.style.width = status + '%';
|
||||
|
|
@ -280,7 +261,10 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
public clearPath(): void {
|
||||
this.getVisEdges.forEach((edge: any) => {
|
||||
const tmpEdge = (window as any).networkc3.body.data.edges.get(edge.id);
|
||||
if (!!tmpEdge.color && Object.keys(tmpEdge.color).length !== 0 || !!tmpEdge.width && tmpEdge.width !== 1) {
|
||||
if (
|
||||
(!!tmpEdge.color && Object.keys(tmpEdge.color).length !== 0) ||
|
||||
(!!tmpEdge.width && tmpEdge.width !== 1)
|
||||
) {
|
||||
(window as any).networkc3.body.data.edges.update([
|
||||
{
|
||||
id: edge.id,
|
||||
|
|
@ -333,7 +317,7 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
flex-shrink: 1
|
||||
margin: 0 auto 0 auto
|
||||
padding: 0
|
||||
border: 0.75px solid $color-green-c3
|
||||
border: 0.75px solid $color-blue-c3
|
||||
box-sizing: border-box
|
||||
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5)
|
||||
border-radius: 2px
|
||||
|
|
@ -351,7 +335,7 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
background: transparent
|
||||
.progress-bar-status
|
||||
position: relative
|
||||
background-color: $color-green-c3
|
||||
background-color: $color-blue-c3
|
||||
width: 0%
|
||||
height: 100%
|
||||
&-toggle-layout.c3canvas-toggle-layout, &-toggle-interfaces.c3canvas-toggle-interfaces
|
||||
|
|
@ -419,7 +403,7 @@ export default class Canvas extends Mixins(C3, FindThePathToGateway) {
|
|||
max-width: 100vw
|
||||
width: calc(100vw - 32px)
|
||||
height: calc(100vh - 32px)
|
||||
border: 0.75px solid $color-green-c3
|
||||
border: 0.75px solid $color-blue-c3
|
||||
z-index: 9
|
||||
.c3canvas-fs-btn
|
||||
z-index: 10
|
||||
|
|
|
|||
|
|
@ -114,8 +114,8 @@ export default class Controll extends Mixins(C3) {
|
|||
padding-left: 1rem
|
||||
padding-right: 1rem
|
||||
&.active
|
||||
color: $color-green-c3
|
||||
border-bottom: 1px solid $color-green-c3
|
||||
color: $color-blue-c3
|
||||
border-bottom: 1px solid $color-blue-c3
|
||||
&:hover
|
||||
cursor: pointer
|
||||
.c3tab
|
||||
|
|
|
|||
|
|
@ -1,7 +1,5 @@
|
|||
<template>
|
||||
<div class="c3footer">
|
||||
C3 dashboard - MWR Labs
|
||||
</div>
|
||||
<div class="c3footer">C3 dashboard - Labs</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
|
|
|
|||
|
|
@ -1,21 +1,9 @@
|
|||
<template>
|
||||
<div
|
||||
class="c3modal"
|
||||
:class="this.activeModal.modalTarget.toLowerCase()"
|
||||
v-if="currentModal"
|
||||
>
|
||||
<div class="c3modal" :class="this.activeModal.modalTarget.toLowerCase()" v-if="currentModal">
|
||||
<div class="c3modal-holder">
|
||||
<GatewayModal
|
||||
v-if="isGateway()"
|
||||
:target-id="targetUid"
|
||||
/>
|
||||
<RelayModal
|
||||
v-if="isRelay()"
|
||||
:target-id="targetUid"
|
||||
/>
|
||||
<CreateGatewayModal
|
||||
v-if="this.activeModal.modalTarget === 'CREATE_GATEWAY'"
|
||||
/>
|
||||
<GatewayModal v-if="isGateway()" :target-id="targetUid" />
|
||||
<RelayModal v-if="isRelay()" :target-id="targetUid" />
|
||||
<CreateGatewayModal v-if="this.activeModal.modalTarget === 'CREATE_GATEWAY'" />
|
||||
<CreateRelayModal
|
||||
v-if="this.activeModal.modalTarget === 'CREATE_RELAY'"
|
||||
:options="options()"
|
||||
|
|
@ -30,17 +18,9 @@
|
|||
:target-id="targetUid"
|
||||
:options="options()"
|
||||
/>
|
||||
<CommandModal
|
||||
v-if="this.activeModal.modalTarget === 'COMMAND'"
|
||||
:target-id="targetUid"
|
||||
/>
|
||||
<OptionsModal
|
||||
v-if="this.activeModal.modalTarget === 'OPTIONS'"
|
||||
/>
|
||||
<InterfaceModal
|
||||
v-if="isInterface()"
|
||||
:target-id="targetUid"
|
||||
/>
|
||||
<CommandModal v-if="this.activeModal.modalTarget === 'COMMAND'" :target-id="targetUid" />
|
||||
<OptionsModal v-if="this.activeModal.modalTarget === 'OPTIONS'" />
|
||||
<InterfaceModal v-if="isInterface()" :target-id="targetUid" />
|
||||
<span class="c3modal-back icon back" v-on:click.self="closeThisModal()">Back</span>
|
||||
<span class="c3modal-close icon close" v-on:click.self="closeAllModal()"></span>
|
||||
</div>
|
||||
|
|
@ -65,7 +45,6 @@ import CreateGatewayModal from '@/components/modals/CreateGateway.vue';
|
|||
import ConnectRelayModal from '@/components/modals/ConnectRelays.vue';
|
||||
import OptionsModal from '@/components/modals/Options.vue';
|
||||
|
||||
|
||||
const ModalModule = namespace('modalModule');
|
||||
|
||||
@Component({
|
||||
|
|
@ -113,9 +92,11 @@ export default class Modal extends Mixins(C3) {
|
|||
}
|
||||
|
||||
public isInterface(): boolean {
|
||||
return this.activeModal.modalTarget === NodeKlass.Channel ||
|
||||
return (
|
||||
this.activeModal.modalTarget === NodeKlass.Channel ||
|
||||
this.activeModal.modalTarget === NodeKlass.Peripheral ||
|
||||
this.activeModal.modalTarget === NodeKlass.Connector;
|
||||
this.activeModal.modalTarget === NodeKlass.Connector
|
||||
);
|
||||
}
|
||||
|
||||
public options(): any {
|
||||
|
|
@ -270,10 +251,10 @@ export default class Modal extends Mixins(C3) {
|
|||
color: $color-grey-400
|
||||
&-config-link
|
||||
font-family: "Roboto"
|
||||
color: $color-green-c3
|
||||
color: $color-blue-c3
|
||||
font-size: 12px
|
||||
line-height: 120%
|
||||
display: flexc3btn-group
|
||||
display: flex
|
||||
align-self: flex-end
|
||||
text-align: right
|
||||
margin: 0 0 14px
|
||||
|
|
|
|||
|
|
@ -1,9 +1,8 @@
|
|||
<template>
|
||||
<div class="c3navbar">
|
||||
<img class="c3navbar-logo" alt="C3 logo" src="@/assets/logo.png">
|
||||
<img class="c3navbar-logo" alt="C3 logo" src="@/assets/logo.svg" />
|
||||
<div class="c3navbar-left">
|
||||
<span class="c3navbar-left--title">C3</span>
|
||||
<span class="c3navbar-left--secondary">dashboard</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ export default class Notification extends Vue {
|
|||
h1+p
|
||||
margin-top: .5rem
|
||||
&-info
|
||||
border-left: 8px solid $color-green-c3
|
||||
border-left: 8px solid $color-blue-c3
|
||||
&-error
|
||||
border-left: 8px solid $color-red-500
|
||||
&-close
|
||||
|
|
|
|||
|
|
@ -140,7 +140,7 @@ export default class SideMenu extends Mixins(C3) {
|
|||
color: $color-grey-400
|
||||
&-config-link
|
||||
font-family: "Roboto"
|
||||
color: $color-green-c3
|
||||
color: $color-blue-c3
|
||||
font-size: 12px
|
||||
line-height: 120%
|
||||
display: flexc3btn-group
|
||||
|
|
|
|||
|
|
@ -126,7 +126,7 @@ export default class DataTableFooter extends Mixins(C3) {
|
|||
background-color: $color-grey-c3
|
||||
&:checked
|
||||
background-color: $color-grey-900
|
||||
color: $color-green-c3
|
||||
color: $color-blue-c3
|
||||
&-paginator
|
||||
display: flex
|
||||
flex-grow: 3
|
||||
|
|
|
|||
|
|
@ -3,15 +3,10 @@
|
|||
<div class="c3checkbox-row" v-on:click="clickOnLabel">
|
||||
{{ legend }}
|
||||
<span class="icon help" v-if="hasHelp">
|
||||
<div class="help-text">
|
||||
{{ help }}
|
||||
</div>
|
||||
<div class="help-text">{{ help }}</div>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="c3toggle"
|
||||
:class="{ 'disabled' : isDisabled }"
|
||||
>
|
||||
<div class="c3toggle" :class="{ 'disabled' : isDisabled }">
|
||||
<input
|
||||
v-bind="$attrs"
|
||||
class="c3toggle-input"
|
||||
|
|
@ -23,11 +18,7 @@
|
|||
@change="toogleToggle"
|
||||
:disabled="disabled"
|
||||
/>
|
||||
<label
|
||||
class="c3toggle-label"
|
||||
@click="clickOnLabel"
|
||||
>
|
||||
</label>
|
||||
<label class="c3toggle-label" @click="clickOnLabel"></label>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -46,14 +37,19 @@ export default class Toggle extends Mixins(C3, C3FormElement) {
|
|||
public isChecked: boolean = this.getIsChecked;
|
||||
|
||||
get getIsChecked() {
|
||||
if (this.checked && typeof this.checked === 'boolean' && this.checked === true) {
|
||||
if (
|
||||
this.checked &&
|
||||
typeof this.checked === 'boolean' &&
|
||||
this.checked === true
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
public mounted(): void {
|
||||
(this.$refs.booleanCheckbox as HTMLInputElement).checked = this.getIsChecked;
|
||||
(this.$refs
|
||||
.booleanCheckbox as HTMLInputElement).checked = this.getIsChecked;
|
||||
}
|
||||
|
||||
// boolean true or false, nothing to validate here
|
||||
|
|
@ -140,7 +136,7 @@ export default class Toggle extends Mixins(C3, C3FormElement) {
|
|||
left: 0
|
||||
width: 20px
|
||||
height: 20px
|
||||
background-color: $color-grey-000
|
||||
background-color: $color-grey-500
|
||||
border-radius: 14px
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14),0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
|
||||
z-index: 2
|
||||
|
|
@ -149,11 +145,11 @@ export default class Toggle extends Mixins(C3, C3FormElement) {
|
|||
// Checked
|
||||
&-input:checked + &-label
|
||||
&:before
|
||||
background-color: #99EBCF
|
||||
border: 1px solid #1B6C51
|
||||
background-color: $color-blue-200
|
||||
border: 1px solid $color-blue-500
|
||||
&:after
|
||||
left: 20px
|
||||
background-color: $color-green-c3
|
||||
background-color: $color-blue-c3
|
||||
&.disabled
|
||||
.c3toggle-label
|
||||
&:before
|
||||
|
|
|
|||
|
|
@ -98,7 +98,7 @@ export default class CommandModal extends Mixins(C3) {
|
|||
<style scoped lang="sass">
|
||||
@import '~@/scss/colors.scss'
|
||||
tr:hover .hover-link
|
||||
color: $color-green-c3
|
||||
color: $color-blue-c3
|
||||
.command-for
|
||||
text-transform: capitalize
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,11 +3,9 @@
|
|||
<div class="c3modal-details">
|
||||
<div class="c3modal-title-wrapper">
|
||||
<h1>Gateway Setup</h1>
|
||||
<span class="c3modal-config-link" v-on:click="openModal('', 'OPTIONS')">EDIT CONFIG</span>
|
||||
<!-- <span class="c3modal-config-link" v-on:click="openModal('', 'OPTIONS')">EDIT CONFIG</span> -->
|
||||
</div>
|
||||
<p>
|
||||
Please setup a Gateway to begin using c3.
|
||||
</p>
|
||||
<p>Please setup a Gateway to begin using c3.</p>
|
||||
<Input
|
||||
legend="Name / Auto Generated ID"
|
||||
class="form-element"
|
||||
|
|
@ -37,12 +35,11 @@
|
|||
class="c3btn c3btn--grey"
|
||||
v-on:click.self="closeThisModal()"
|
||||
v-show="hasSelectedGateway !== false"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button class="c3btn c3btn pull-right" v-on:click="createNewGateway()">
|
||||
Create and download Gateway
|
||||
</button>
|
||||
>Cancel</button>
|
||||
<button
|
||||
class="c3btn c3btn pull-right"
|
||||
v-on:click="createNewGateway()"
|
||||
>Create and download Gateway</button>
|
||||
</dir>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -96,7 +93,11 @@ export default class CreateGatewayModal extends Mixins(C3) {
|
|||
}
|
||||
|
||||
public beforeDestroy(): void {
|
||||
(window as any).removeEventListener('keydown', this.handleGlobalKeyDown, true);
|
||||
(window as any).removeEventListener(
|
||||
'keydown',
|
||||
this.handleGlobalKeyDown,
|
||||
true,
|
||||
);
|
||||
}
|
||||
|
||||
public changeName(n: any): void {
|
||||
|
|
@ -121,32 +122,36 @@ export default class CreateGatewayModal extends Mixins(C3) {
|
|||
method: 'GET',
|
||||
baseURL: this.getAPIBaseUrl,
|
||||
responseType: 'blob',
|
||||
}).then((response) => {
|
||||
const blob = new Blob([response.data], {type: response.data.type});
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
const contentDisposition = response.headers['content-disposition'];
|
||||
let fileName = '';
|
||||
|
||||
if (contentDisposition !== undefined) {
|
||||
fileName = contentDisposition.split('filename=')[1].split(';')[0].replace(/%20/gi, '-');
|
||||
}
|
||||
|
||||
if (typeof fileName !== 'string' || fileName === '') {
|
||||
fileName = 'gateway.exe';
|
||||
}
|
||||
|
||||
link.href = url;
|
||||
link.setAttribute('download', fileName);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
link.remove();
|
||||
window.URL.revokeObjectURL(url);
|
||||
|
||||
this.closeThisModal();
|
||||
})
|
||||
.catch((error) => {
|
||||
.then((response) => {
|
||||
const blob = new Blob([response.data], { type: response.data.type });
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
const contentDisposition = response.headers['content-disposition'];
|
||||
let fileName = '';
|
||||
|
||||
if (contentDisposition !== undefined) {
|
||||
fileName = contentDisposition
|
||||
.split('filename=')[1]
|
||||
.split(';')[0]
|
||||
.replace(/%20/gi, '-');
|
||||
}
|
||||
|
||||
if (typeof fileName !== 'string' || fileName === '') {
|
||||
fileName = 'gateway.exe';
|
||||
}
|
||||
|
||||
link.href = url;
|
||||
link.setAttribute('download', fileName);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
link.remove();
|
||||
window.URL.revokeObjectURL(url);
|
||||
|
||||
this.closeThisModal();
|
||||
})
|
||||
.catch((error) => {
|
||||
this.addNotify({
|
||||
type: 'error',
|
||||
message: error.message,
|
||||
|
|
|
|||
|
|
@ -1,30 +1,40 @@
|
|||
$color-grey-c3: #282828;
|
||||
|
||||
$color-grey-000: #FFFFFF;
|
||||
$color-grey-200: #F2F2F2;
|
||||
$color-grey-400: #BDBDBD;
|
||||
$color-grey-000: #ffffff;
|
||||
$color-grey-200: #f2f2f2;
|
||||
$color-grey-400: #bdbdbd;
|
||||
$color-grey-500: #828282;
|
||||
$color-grey-700: #4F4F4F;
|
||||
$color-grey-800: #3D3D3D;
|
||||
$color-grey-700: #4f4f4f;
|
||||
$color-grey-800: #3d3d3d;
|
||||
$color-grey-900: #222222;
|
||||
$color-grey-bg: #111111;
|
||||
|
||||
$color-green-500: #27AE60;
|
||||
$color-green-800: #1B6C51;
|
||||
$color-green-500: #2297ff;
|
||||
$color-green-800: #2297ff;
|
||||
|
||||
$color-blue-500: #4D86DC;
|
||||
$color-blue-500: #4d86dc;
|
||||
$color-blue-900: #233043;
|
||||
|
||||
$color-purple-500: #AB61F6;
|
||||
$color-purple-500: #ab61f6;
|
||||
|
||||
$color-red-500: #BF0001;
|
||||
$color-red-400: #E01D01;
|
||||
$color-red-c3: #FF492F;
|
||||
$color-red-500: #bf0001;
|
||||
$color-red-400: #e01d01;
|
||||
$color-red-c3: #ff492f;
|
||||
|
||||
$color-yellow-500: #FFAC00;
|
||||
$color-yellow-500: #ffac00;
|
||||
|
||||
$color-orange-500: #CD9526;
|
||||
$color-orange-500: #cd9526;
|
||||
|
||||
$color-green-c3: #0DF2A4;
|
||||
$color-labs-500: #0DF2A4;
|
||||
$color-labs-800: #1B6C51;
|
||||
$color-blue-900: #233043;
|
||||
$color-blue-800: #284167;
|
||||
$color-blue-700: #1476ff;
|
||||
$color-blue-600: #477ac8;
|
||||
$color-blue-500: #1476ff;
|
||||
$color-blue-300: #619cf6;
|
||||
$color-blue-200: #90caff;
|
||||
$color-blue-100: #c1d4ef;
|
||||
$color-blue-000: #fbfdff;
|
||||
|
||||
$color-blue-c3: #2297ff;
|
||||
$color-labs-500: #2297ff;
|
||||
$color-labs-800: #284167;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import '../colors.scss';
|
||||
@import "../colors.scss";
|
||||
|
||||
.c3btn {
|
||||
border-radius: 2px;
|
||||
|
|
@ -16,42 +16,42 @@
|
|||
margin-bottom: 16px;
|
||||
min-width: 100px;
|
||||
cursor: pointer;
|
||||
border: 1px solid $color-green-c3;
|
||||
background-color: $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
background-color: $color-blue-c3;
|
||||
box-shadow: none;
|
||||
color: $color-grey-800;
|
||||
&.pull-right {
|
||||
margin-left: auto;
|
||||
}
|
||||
&:active {
|
||||
border: 1px solid $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
color: $color-green-c3;
|
||||
color: $color-blue-c3;
|
||||
}
|
||||
&--grey {
|
||||
border: 1px solid $color-grey-400;
|
||||
background-color: transparent;
|
||||
color: $color-grey-000;
|
||||
&:hover {
|
||||
border: 1px solid $color-green-c3;
|
||||
color: $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
color: $color-blue-c3;
|
||||
}
|
||||
&:active {
|
||||
border: 1px solid $color-green-c3;
|
||||
background-color: $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
background-color: $color-blue-c3;
|
||||
box-shadow: none;
|
||||
color: $color-grey-800;
|
||||
}
|
||||
}
|
||||
&--outline {
|
||||
border: 1px solid $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
color: $color-green-c3;
|
||||
color: $color-blue-c3;
|
||||
&:active {
|
||||
border: 1px solid $color-green-c3;
|
||||
background-color: $color-green-c3;
|
||||
border: 1px solid $color-blue-c3;
|
||||
background-color: $color-blue-c3;
|
||||
box-shadow: none;
|
||||
color: $color-grey-800;
|
||||
}
|
||||
|
|
@ -60,13 +60,12 @@
|
|||
align-self: flex-end;
|
||||
}
|
||||
&[disabled] {
|
||||
color: #3D3D3D;
|
||||
border: 1px solid $color-green-800;
|
||||
color: #3d3d3d;
|
||||
border: 1px solid $color-green-800;
|
||||
background-color: $color-green-800;
|
||||
border-radius: 2px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.c3btn-group {
|
||||
|
|
@ -87,7 +86,7 @@
|
|||
border-bottom-left-radius: 0;
|
||||
}
|
||||
&:hover {
|
||||
border-right: 1px solid $color-green-c3;
|
||||
border-right: 1px solid $color-blue-c3;
|
||||
& + .c3btn {
|
||||
border-left: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,52 +1,117 @@
|
|||
/* roboto-regular - latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-family: "Roboto";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('../assets/fonts/roboto/roboto-v18-latin-regular.eot'); /* IE9 Compat Modes */
|
||||
src: local('Roboto'), local('Roboto-Regular'),
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
|
||||
src: url("../assets/fonts/roboto/roboto-v18-latin-regular.eot"); /* IE9 Compat Modes */
|
||||
src: local("Roboto"), local("Roboto-Regular"),
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-regular.eot?#iefix")
|
||||
format("embedded-opentype"),
|
||||
/* IE6-IE8 */ url("../assets/fonts/roboto/roboto-v18-latin-regular.woff2")
|
||||
format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-regular.woff") format("woff"),
|
||||
/* Modern Browsers */
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-regular.ttf")
|
||||
format("truetype"),
|
||||
/* Safari, Android, iOS */
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-regular.svg#Roboto")
|
||||
format("svg"); /* Legacy iOS */
|
||||
}
|
||||
/* roboto-500 - latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
font-family: "Roboto";
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url('../assets/fonts/roboto/roboto-v18-latin-500.eot'); /* IE9 Compat Modes */
|
||||
src: local('Roboto Medium'), local('Roboto-Medium'),
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-500.woff') format('woff'), /* Modern Browsers */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||
url('../assets/fonts/roboto/roboto-v18-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
|
||||
src: url("../assets/fonts/roboto/roboto-v18-latin-500.eot"); /* IE9 Compat Modes */
|
||||
src: local("Roboto Medium"), local("Roboto-Medium"),
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-500.eot?#iefix")
|
||||
format("embedded-opentype"),
|
||||
/* IE6-IE8 */ url("../assets/fonts/roboto/roboto-v18-latin-500.woff2")
|
||||
format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-500.woff") format("woff"),
|
||||
/* Modern Browsers */ url("../assets/fonts/roboto/roboto-v18-latin-500.ttf")
|
||||
format("truetype"),
|
||||
/* Safari, Android, iOS */
|
||||
url("../assets/fonts/roboto/roboto-v18-latin-500.svg#Roboto")
|
||||
format("svg"); /* Legacy iOS */
|
||||
}
|
||||
/* roboto-mono-regular - latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto Mono';
|
||||
font-family: "Roboto Mono";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.eot'); /* IE9 Compat Modes */
|
||||
src: local('Roboto Mono'), local('RobotoMono-Regular'),
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff') format('woff'), /* Modern Browsers */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.svg#RobotoMono') format('svg'); /* Legacy iOS */
|
||||
src: url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.eot"); /* IE9 Compat Modes */
|
||||
src: local("Roboto Mono"), local("RobotoMono-Regular"),
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.eot?#iefix")
|
||||
format("embedded-opentype"),
|
||||
/* IE6-IE8 */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff2")
|
||||
format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.woff")
|
||||
format("woff"),
|
||||
/* Modern Browsers */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.ttf")
|
||||
format("truetype"),
|
||||
/* Safari, Android, iOS */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-regular.svg#RobotoMono")
|
||||
format("svg"); /* Legacy iOS */
|
||||
}
|
||||
/* roboto-mono-500 - latin */
|
||||
@font-face {
|
||||
font-family: 'Roboto Mono';
|
||||
font-family: "Roboto Mono";
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
src: url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.eot'); /* IE9 Compat Modes */
|
||||
src: local('Roboto Mono Medium'), local('RobotoMono-Medium'),
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.woff') format('woff'), /* Modern Browsers */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||
url('../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.svg#RobotoMono') format('svg'); /* Legacy iOS */
|
||||
src: url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.eot"); /* IE9 Compat Modes */
|
||||
src: local("Roboto Mono Medium"), local("RobotoMono-Medium"),
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.eot?#iefix")
|
||||
format("embedded-opentype"),
|
||||
/* IE6-IE8 */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.woff2")
|
||||
format("woff2"),
|
||||
/* Super Modern Browsers */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.woff")
|
||||
format("woff"),
|
||||
/* Modern Browsers */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.ttf")
|
||||
format("truetype"),
|
||||
/* Safari, Android, iOS */
|
||||
url("../assets/fonts/roboto-mono/roboto-mono-v5-latin-500.svg#RobotoMono")
|
||||
format("svg"); /* Legacy iOS */
|
||||
}
|
||||
|
||||
/* f-secure-sans 200 */
|
||||
@font-face {
|
||||
font-family: "FSecureSans";
|
||||
font-weight: 200;
|
||||
src: url("../assets/fonts/f-secure-sans/f-secure-sans-light.woff2")
|
||||
format("woff2"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-light.woff") format("woff"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-light.ttf")
|
||||
format("truetype");
|
||||
}
|
||||
|
||||
/* f-secure-sans 400 */
|
||||
@font-face {
|
||||
font-family: "FSecureSans";
|
||||
font-weight: 400;
|
||||
src: url("../assets/fonts/f-secure-sans/f-secure-sans-regular.woff2")
|
||||
format("woff2"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-regular.woff")
|
||||
format("woff"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-regular.ttf")
|
||||
format("truetype");
|
||||
}
|
||||
|
||||
/* f-secure-sans 700 */
|
||||
@font-face {
|
||||
font-family: "FSecureSans";
|
||||
font-weight: 700;
|
||||
src: url("../assets/fonts/f-secure-sans/f-secure-sans-bold.woff2")
|
||||
format("woff2"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-bold.woff") format("woff"),
|
||||
url("../assets/fonts/f-secure-sans/f-secure-sans-bold.ttf")
|
||||
format("truetype");
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
@import './fonts.scss';
|
||||
@import './mixins.scss';
|
||||
@import './colors.scss';
|
||||
@import "./fonts.scss";
|
||||
@import "./mixins.scss";
|
||||
@import "./colors.scss";
|
||||
|
||||
@import './components/button.scss';
|
||||
@import "./components/button.scss";
|
||||
|
||||
html, body {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
html,
|
||||
body {
|
||||
font-family: "Roboto", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
font-size: 14px;
|
||||
|
|
@ -20,7 +21,7 @@ html, body {
|
|||
}
|
||||
|
||||
* {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
font-family: "FSecureSans", sans-serif;
|
||||
box-sizing: border-box;
|
||||
outline: none !important;
|
||||
background-color: inherit;
|
||||
|
|
@ -43,7 +44,7 @@ label.icon {
|
|||
}
|
||||
|
||||
.c3link.c3link {
|
||||
color: $color-green-c3;
|
||||
color: $color-blue-c3;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import "./svg-icons.scss";
|
||||
@import './colors.scss';
|
||||
@import "./colors.scss";
|
||||
|
||||
$exclamation: "exclamation";
|
||||
$close: "close";
|
||||
|
|
@ -19,9 +19,9 @@ $add-comment: "add-comment";
|
|||
|
||||
@mixin generate-checkbox-icons($size, $hover-size: $size) {
|
||||
&.#{$checkbox}-on {
|
||||
@include checkboxon("0DF2A4", $size);
|
||||
@include checkboxon("2297ff", $size);
|
||||
&:hover {
|
||||
@include checkboxon("0DF2A4", $hover-size);
|
||||
@include checkboxon("2297ff", $hover-size);
|
||||
}
|
||||
}
|
||||
&.#{$checkbox}-on--disabled {
|
||||
|
|
@ -83,14 +83,14 @@ $add-comment: "add-comment";
|
|||
&.#{$rand} {
|
||||
@include rand($color, $size);
|
||||
&:hover {
|
||||
@include rand('FFFFFF', $hover-size);
|
||||
@include rand("FFFFFF", $hover-size);
|
||||
}
|
||||
}
|
||||
|
||||
&.#{$upload} {
|
||||
@include upload($color, $size);
|
||||
&:hover {
|
||||
@include upload('FFFFFF', $hover-size);
|
||||
@include upload("FFFFFF", $hover-size);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue