')
+ .css({
+ position: 'absolute',
+ width: t.outerWidth(),
+ height: t.outerHeight(),
+ })
+ .appendTo(t.parent())
+ .offset(t.offset())[0]
+ })
+ },
+ _unblockFrames: function () {
+ this.iframeBlocks &&
+ (this.iframeBlocks.remove(), delete this.iframeBlocks)
+ },
+ _allowInteraction: function (t) {
+ return (
+ !!x(t.target).closest('.ui-dialog').length ||
+ !!x(t.target).closest('.ui-datepicker').length
+ )
+ },
+ _createOverlay: function () {
+ var i, s
+ this.options.modal &&
+ ((i = x.fn.jquery.substring(0, 4)),
+ (s = !0),
+ this._delay(function () {
+ s = !1
+ }),
+ this.document.data('ui-dialog-overlays') ||
+ this.document.on(
+ 'focusin.ui-dialog',
+ function (t) {
+ var e
+ s ||
+ (e =
+ this._trackingInstances()[0])._allowInteraction(
+ t
+ ) ||
+ (t.preventDefault(),
+ e._focusTabbable(),
+ ('3.4.' !== i && '3.5.' !== i) ||
+ e._delay(e._restoreTabbableFocus))
+ }.bind(this)
+ ),
+ (this.overlay = x('
').appendTo(this._appendTo())),
+ this._addClass(
+ this.overlay,
+ null,
+ 'ui-widget-overlay ui-front'
+ ),
+ this._on(this.overlay, { mousedown: '_keepFocus' }),
+ this.document.data(
+ 'ui-dialog-overlays',
+ (this.document.data('ui-dialog-overlays') || 0) + 1
+ ))
+ },
+ _destroyOverlay: function () {
+ var t
+ this.options.modal &&
+ this.overlay &&
+ ((t = this.document.data('ui-dialog-overlays') - 1)
+ ? this.document.data('ui-dialog-overlays', t)
+ : (this.document.off('focusin.ui-dialog'),
+ this.document.removeData('ui-dialog-overlays')),
+ this.overlay.remove(),
+ (this.overlay = null))
+ },
+ }),
+ !1 !== x.uiBackCompat &&
+ x.widget('ui.dialog', x.ui.dialog, {
+ options: { dialogClass: '' },
+ _createWrapper: function () {
+ this._super(),
+ this.uiDialog.addClass(this.options.dialogClass)
+ },
+ _setOption: function (t, e) {
+ 'dialogClass' === t &&
+ this.uiDialog
+ .removeClass(this.options.dialogClass)
+ .addClass(e),
+ this._superApply(arguments)
+ },
+ })
+ x.ui.dialog
+ var v = x,
+ _ = {},
+ b = _.toString,
+ y = /^([\-+])=\s*(\d+\.?\d*)/,
+ w = [
+ {
+ re: /rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+ parse: function (t) {
+ return [t[1], t[2], t[3], t[4]]
+ },
+ },
+ {
+ re: /rgba?\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+ parse: function (t) {
+ return [2.55 * t[1], 2.55 * t[2], 2.55 * t[3], t[4]]
+ },
+ },
+ {
+ re: /#([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})?/,
+ parse: function (t) {
+ return [
+ parseInt(t[1], 16),
+ parseInt(t[2], 16),
+ parseInt(t[3], 16),
+ t[4] ? (parseInt(t[4], 16) / 255).toFixed(2) : 1,
+ ]
+ },
+ },
+ {
+ re: /#([a-f0-9])([a-f0-9])([a-f0-9])([a-f0-9])?/,
+ parse: function (t) {
+ return [
+ parseInt(t[1] + t[1], 16),
+ parseInt(t[2] + t[2], 16),
+ parseInt(t[3] + t[3], 16),
+ t[4] ? (parseInt(t[4] + t[4], 16) / 255).toFixed(2) : 1,
+ ]
+ },
+ },
+ {
+ re: /hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+ space: 'hsla',
+ parse: function (t) {
+ return [t[1], t[2] / 100, t[3] / 100, t[4]]
+ },
+ },
+ ],
+ I = (v.Color = function (t, e, i, s) {
+ return new v.Color.fn.parse(t, e, i, s)
+ }),
+ S = {
+ rgba: {
+ props: {
+ red: { idx: 0, type: 'byte' },
+ green: { idx: 1, type: 'byte' },
+ blue: { idx: 2, type: 'byte' },
+ },
+ },
+ hsla: {
+ props: {
+ hue: { idx: 0, type: 'degrees' },
+ saturation: { idx: 1, type: 'percent' },
+ lightness: { idx: 2, type: 'percent' },
+ },
+ },
+ },
+ D = {
+ byte: { floor: !0, max: 255 },
+ percent: { max: 1 },
+ degrees: { mod: 360, floor: !0 },
+ },
+ W = (I.support = {}),
+ O = v('
')[0],
+ E = v.each
+ function L(t) {
+ return null == t
+ ? t + ''
+ : 'object' == typeof t
+ ? _[b.call(t)] || 'object'
+ : typeof t
+ }
+ function N(t, e, i) {
+ var s = D[e.type] || {}
+ return null == t
+ ? i || !e.def
+ ? null
+ : e.def
+ : ((t = s.floor ? ~~t : parseFloat(t)),
+ isNaN(t)
+ ? e.def
+ : s.mod
+ ? (t + s.mod) % s.mod
+ : Math.min(s.max, Math.max(0, t)))
+ }
+ function R(s) {
+ var o = I(),
+ n = (o._rgba = [])
+ return (
+ (s = s.toLowerCase()),
+ E(w, function (t, e) {
+ var i = e.re.exec(s),
+ i = i && e.parse(i),
+ e = e.space || 'rgba'
+ if (i)
+ return (
+ (i = o[e](i)),
+ (o[S[e].cache] = i[S[e].cache]),
+ (n = o._rgba = i._rgba),
+ !1
+ )
+ }),
+ n.length
+ ? ('0,0,0,0' === n.join() && v.extend(n, V.transparent), o)
+ : V[s]
+ )
+ }
+ function M(t, e, i) {
+ return 6 * (i = (i + 1) % 1) < 1
+ ? t + (e - t) * i * 6
+ : 2 * i < 1
+ ? e
+ : 3 * i < 2
+ ? t + (e - t) * (2 / 3 - i) * 6
+ : t
+ }
+ ;(O.style.cssText = 'background-color:rgba(1,1,1,.5)'),
+ (W.rgba = -1 < O.style.backgroundColor.indexOf('rgba')),
+ E(S, function (t, e) {
+ ;(e.cache = '_' + t),
+ (e.props.alpha = { idx: 3, type: 'percent', def: 1 })
+ }),
+ v.each(
+ 'Boolean Number String Function Array Date RegExp Object Error Symbol'.split(
+ ' '
+ ),
+ function (t, e) {
+ _['[object ' + e + ']'] = e.toLowerCase()
+ }
+ ),
+ ((I.fn = v.extend(I.prototype, {
+ parse: function (o, t, e, i) {
+ if (void 0 === o)
+ return (this._rgba = [null, null, null, null]), this
+ ;(o.jquery || o.nodeType) && ((o = v(o).css(t)), (t = void 0))
+ var n = this,
+ s = L(o),
+ r = (this._rgba = [])
+ return (
+ void 0 !== t && ((o = [o, t, e, i]), (s = 'array')),
+ 'string' === s
+ ? this.parse(R(o) || V._default)
+ : 'array' === s
+ ? (E(S.rgba.props, function (t, e) {
+ r[e.idx] = N(o[e.idx], e)
+ }),
+ this)
+ : 'object' === s
+ ? (E(
+ S,
+ o instanceof I
+ ? function (t, e) {
+ o[e.cache] &&
+ (n[e.cache] = o[e.cache].slice())
+ }
+ : function (t, i) {
+ var s = i.cache
+ E(i.props, function (t, e) {
+ if (!n[s] && i.to) {
+ if (
+ 'alpha' === t ||
+ null == o[t]
+ )
+ return
+ n[s] = i.to(n._rgba)
+ }
+ n[s][e.idx] = N(o[t], e, !0)
+ }),
+ n[s] &&
+ v.inArray(
+ null,
+ n[s].slice(0, 3)
+ ) < 0 &&
+ (null == n[s][3] &&
+ (n[s][3] = 1),
+ i.from &&
+ (n._rgba = i.from(n[s])))
+ }
+ ),
+ this)
+ : void 0
+ )
+ },
+ is: function (t) {
+ var o = I(t),
+ n = !0,
+ r = this
+ return (
+ E(S, function (t, e) {
+ var i,
+ s = o[e.cache]
+ return (
+ s &&
+ ((i =
+ r[e.cache] ||
+ (e.to && e.to(r._rgba)) ||
+ []),
+ E(e.props, function (t, e) {
+ if (null != s[e.idx])
+ return (n = s[e.idx] === i[e.idx])
+ })),
+ n
+ )
+ }),
+ n
+ )
+ },
+ _space: function () {
+ var i = [],
+ s = this
+ return (
+ E(S, function (t, e) {
+ s[e.cache] && i.push(t)
+ }),
+ i.pop()
+ )
+ },
+ transition: function (t, r) {
+ var e = (l = I(t))._space(),
+ i = S[e],
+ t = 0 === this.alpha() ? I('transparent') : this,
+ a = t[i.cache] || i.to(t._rgba),
+ h = a.slice(),
+ l = l[i.cache]
+ return (
+ E(i.props, function (t, e) {
+ var i = e.idx,
+ s = a[i],
+ o = l[i],
+ n = D[e.type] || {}
+ null !== o &&
+ (null === s
+ ? (h[i] = o)
+ : (n.mod &&
+ (o - s > n.mod / 2
+ ? (s += n.mod)
+ : s - o > n.mod / 2 && (s -= n.mod)),
+ (h[i] = N((o - s) * r + s, e))))
+ }),
+ this[e](h)
+ )
+ },
+ blend: function (t) {
+ if (1 === this._rgba[3]) return this
+ var e = this._rgba.slice(),
+ i = e.pop(),
+ s = I(t)._rgba
+ return I(
+ v.map(e, function (t, e) {
+ return (1 - i) * s[e] + i * t
+ })
+ )
+ },
+ toRgbaString: function () {
+ var t = 'rgba(',
+ e = v.map(this._rgba, function (t, e) {
+ return null != t ? t : 2 < e ? 1 : 0
+ })
+ return 1 === e[3] && (e.pop(), (t = 'rgb(')), t + e.join() + ')'
+ },
+ toHslaString: function () {
+ var t = 'hsla(',
+ e = v.map(this.hsla(), function (t, e) {
+ return (
+ null == t && (t = 2 < e ? 1 : 0),
+ (t = e && e < 3 ? Math.round(100 * t) + '%' : t)
+ )
+ })
+ return 1 === e[3] && (e.pop(), (t = 'hsl(')), t + e.join() + ')'
+ },
+ toHexString: function (t) {
+ var e = this._rgba.slice(),
+ i = e.pop()
+ return (
+ t && e.push(~~(255 * i)),
+ '#' +
+ v
+ .map(e, function (t) {
+ return 1 === (t = (t || 0).toString(16)).length
+ ? '0' + t
+ : t
+ })
+ .join('')
+ )
+ },
+ toString: function () {
+ return 0 === this._rgba[3] ? 'transparent' : this.toRgbaString()
+ },
+ })).parse.prototype = I.fn),
+ (S.hsla.to = function (t) {
+ if (null == t[0] || null == t[1] || null == t[2])
+ return [null, null, null, t[3]]
+ var e = t[0] / 255,
+ i = t[1] / 255,
+ s = t[2] / 255,
+ o = t[3],
+ n = Math.max(e, i, s),
+ r = Math.min(e, i, s),
+ a = n - r,
+ h = n + r,
+ t = 0.5 * h,
+ i =
+ r === n
+ ? 0
+ : e === n
+ ? (60 * (i - s)) / a + 360
+ : i === n
+ ? (60 * (s - e)) / a + 120
+ : (60 * (e - i)) / a + 240,
+ h = 0 == a ? 0 : t <= 0.5 ? a / h : a / (2 - h)
+ return [Math.round(i) % 360, h, t, null == o ? 1 : o]
+ }),
+ (S.hsla.from = function (t) {
+ if (null == t[0] || null == t[1] || null == t[2])
+ return [null, null, null, t[3]]
+ var e = t[0] / 360,
+ i = t[1],
+ s = t[2],
+ t = t[3],
+ i = s <= 0.5 ? s * (1 + i) : s + i - s * i,
+ s = 2 * s - i
+ return [
+ Math.round(255 * M(s, i, e + 1 / 3)),
+ Math.round(255 * M(s, i, e)),
+ Math.round(255 * M(s, i, e - 1 / 3)),
+ t,
+ ]
+ }),
+ E(S, function (h, t) {
+ var e = t.props,
+ n = t.cache,
+ r = t.to,
+ a = t.from
+ ;(I.fn[h] = function (t) {
+ if ((r && !this[n] && (this[n] = r(this._rgba)), void 0 === t))
+ return this[n].slice()
+ var i = L(t),
+ s = 'array' === i || 'object' === i ? t : arguments,
+ o = this[n].slice()
+ return (
+ E(e, function (t, e) {
+ t = s['object' === i ? t : e.idx]
+ null == t && (t = o[e.idx]), (o[e.idx] = N(t, e))
+ }),
+ a ? (((t = I(a(o)))[n] = o), t) : I(o)
+ )
+ }),
+ E(e, function (r, a) {
+ I.fn[r] ||
+ (I.fn[r] = function (t) {
+ var e,
+ i = L(t),
+ s =
+ 'alpha' === r
+ ? this._hsla
+ ? 'hsla'
+ : 'rgba'
+ : h,
+ o = this[s](),
+ n = o[a.idx]
+ return 'undefined' === i
+ ? n
+ : ('function' === i &&
+ (i = L((t = t.call(this, n)))),
+ null == t && a.empty
+ ? this
+ : ('string' === i &&
+ (e = y.exec(t)) &&
+ (t =
+ n +
+ parseFloat(e[2]) *
+ ('+' === e[1] ? 1 : -1)),
+ (o[a.idx] = t),
+ this[s](o)))
+ })
+ })
+ }),
+ (I.hook = function (t) {
+ t = t.split(' ')
+ E(t, function (t, n) {
+ ;(v.cssHooks[n] = {
+ set: function (t, e) {
+ var i,
+ s,
+ o = ''
+ if (
+ 'transparent' !== e &&
+ ('string' !== L(e) || (i = R(e)))
+ ) {
+ if (
+ ((e = I(i || e)), !W.rgba && 1 !== e._rgba[3])
+ ) {
+ for (
+ s =
+ 'backgroundColor' === n
+ ? t.parentNode
+ : t;
+ ('' === o || 'transparent' === o) &&
+ s &&
+ s.style;
+
+ )
+ try {
+ ;(o = v.css(s, 'backgroundColor')),
+ (s = s.parentNode)
+ } catch (t) {}
+ e = e.blend(
+ o && 'transparent' !== o ? o : '_default'
+ )
+ }
+ e = e.toRgbaString()
+ }
+ try {
+ t.style[n] = e
+ } catch (t) {}
+ },
+ }),
+ (v.fx.step[n] = function (t) {
+ t.colorInit ||
+ ((t.start = I(t.elem, n)),
+ (t.end = I(t.end)),
+ (t.colorInit = !0)),
+ v.cssHooks[n].set(
+ t.elem,
+ t.start.transition(t.end, t.pos)
+ )
+ })
+ })
+ })(
+ 'backgroundColor borderBottomColor borderLeftColor borderRightColor borderTopColor color columnRuleColor outlineColor textDecorationColor textEmphasisColor'
+ ),
+ (v.cssHooks.borderColor = {
+ expand: function (i) {
+ var s = {}
+ return (
+ E(['Top', 'Right', 'Bottom', 'Left'], function (t, e) {
+ s['border' + e + 'Color'] = i
+ }),
+ s
+ )
+ },
+ })
+ var A,
+ B,
+ F,
+ q,
+ j,
+ X,
+ Y,
+ U,
+ K,
+ $,
+ V = (v.Color.names = {
+ aqua: '#00ffff',
+ black: '#000000',
+ blue: '#0000ff',
+ fuchsia: '#ff00ff',
+ gray: '#808080',
+ green: '#008000',
+ lime: '#00ff00',
+ maroon: '#800000',
+ navy: '#000080',
+ olive: '#808000',
+ purple: '#800080',
+ red: '#ff0000',
+ silver: '#c0c0c0',
+ teal: '#008080',
+ white: '#ffffff',
+ yellow: '#ffff00',
+ transparent: [null, null, null, 0],
+ _default: '#ffffff',
+ }),
+ Q = 'ui-effects-',
+ G = 'ui-effects-style',
+ Z = 'ui-effects-animated'
+ function J(t) {
+ var e,
+ i,
+ s = t.ownerDocument.defaultView
+ ? t.ownerDocument.defaultView.getComputedStyle(t, null)
+ : t.currentStyle,
+ o = {}
+ if (s && s.length && s[0] && s[s[0]])
+ for (i = s.length; i--; )
+ 'string' == typeof s[(e = s[i])] &&
+ (o[
+ e.replace(/-([\da-z])/gi, function (t, e) {
+ return e.toUpperCase()
+ })
+ ] = s[e])
+ else for (e in s) 'string' == typeof s[e] && (o[e] = s[e])
+ return o
+ }
+ function tt(t, e, i, s) {
+ return (
+ (t = { effect: (t = x.isPlainObject(t) ? (e = t).effect : t) }),
+ 'function' == typeof (e = null == e ? {} : e) &&
+ ((s = e), (i = null), (e = {})),
+ ('number' != typeof e && !x.fx.speeds[e]) ||
+ ((s = i), (i = e), (e = {})),
+ 'function' == typeof i && ((s = i), (i = null)),
+ e && x.extend(t, e),
+ (i = i || e.duration),
+ (t.duration = x.fx.off
+ ? 0
+ : 'number' == typeof i
+ ? i
+ : i in x.fx.speeds
+ ? x.fx.speeds[i]
+ : x.fx.speeds._default),
+ (t.complete = s || e.complete),
+ t
+ )
+ }
+ function et(t) {
+ return (
+ !t ||
+ 'number' == typeof t ||
+ x.fx.speeds[t] ||
+ ('string' == typeof t && !x.effects.effect[t]) ||
+ 'function' == typeof t ||
+ ('object' == typeof t && !t.effect)
+ )
+ }
+ function it(t, e) {
+ var i = e.outerWidth(),
+ e = e.outerHeight(),
+ t =
+ /^rect\((-?\d*\.?\d*px|-?\d+%|auto),?\s*(-?\d*\.?\d*px|-?\d+%|auto),?\s*(-?\d*\.?\d*px|-?\d+%|auto),?\s*(-?\d*\.?\d*px|-?\d+%|auto)\)$/.exec(
+ t
+ ) || ['', 0, i, e, 0]
+ return {
+ top: parseFloat(t[1]) || 0,
+ right: 'auto' === t[2] ? i : parseFloat(t[2]),
+ bottom: 'auto' === t[3] ? e : parseFloat(t[3]),
+ left: parseFloat(t[4]) || 0,
+ }
+ }
+ ;(x.effects = { effect: {} }),
+ (q = ['add', 'remove', 'toggle']),
+ (j = {
+ border: 1,
+ borderBottom: 1,
+ borderColor: 1,
+ borderLeft: 1,
+ borderRight: 1,
+ borderTop: 1,
+ borderWidth: 1,
+ margin: 1,
+ padding: 1,
+ }),
+ x.each(
+ [
+ 'borderLeftStyle',
+ 'borderRightStyle',
+ 'borderBottomStyle',
+ 'borderTopStyle',
+ ],
+ function (t, e) {
+ x.fx.step[e] = function (t) {
+ ;(('none' !== t.end && !t.setAttr) ||
+ (1 === t.pos && !t.setAttr)) &&
+ (v.style(t.elem, e, t.end), (t.setAttr = !0))
+ }
+ }
+ ),
+ x.fn.addBack ||
+ (x.fn.addBack = function (t) {
+ return this.add(
+ null == t ? this.prevObject : this.prevObject.filter(t)
+ )
+ }),
+ (x.effects.animateClass = function (o, t, e, i) {
+ var n = x.speed(t, e, i)
+ return this.queue(function () {
+ var i = x(this),
+ t = i.attr('class') || '',
+ e = (e = n.children ? i.find('*').addBack() : i).map(
+ function () {
+ return { el: x(this), start: J(this) }
+ }
+ ),
+ s = function () {
+ x.each(q, function (t, e) {
+ o[e] && i[e + 'Class'](o[e])
+ })
+ }
+ s(),
+ (e = e.map(function () {
+ return (
+ (this.end = J(this.el[0])),
+ (this.diff = (function (t, e) {
+ var i,
+ s,
+ o = {}
+ for (i in e)
+ (s = e[i]),
+ t[i] !== s &&
+ (j[i] ||
+ (!x.fx.step[i] &&
+ isNaN(parseFloat(s))) ||
+ (o[i] = s))
+ return o
+ })(this.start, this.end)),
+ this
+ )
+ })),
+ i.attr('class', t),
+ (e = e.map(function () {
+ var t = this,
+ e = x.Deferred(),
+ i = x.extend({}, n, {
+ queue: !1,
+ complete: function () {
+ e.resolve(t)
+ },
+ })
+ return this.el.animate(this.diff, i), e.promise()
+ })),
+ x.when.apply(x, e.get()).done(function () {
+ s(),
+ x.each(arguments, function () {
+ var e = this.el
+ x.each(this.diff, function (t) {
+ e.css(t, '')
+ })
+ }),
+ n.complete.call(i[0])
+ })
+ })
+ }),
+ x.fn.extend({
+ addClass:
+ ((F = x.fn.addClass),
+ function (t, e, i, s) {
+ return e
+ ? x.effects.animateClass.call(this, { add: t }, e, i, s)
+ : F.apply(this, arguments)
+ }),
+ removeClass:
+ ((B = x.fn.removeClass),
+ function (t, e, i, s) {
+ return 1 < arguments.length
+ ? x.effects.animateClass.call(
+ this,
+ { remove: t },
+ e,
+ i,
+ s
+ )
+ : B.apply(this, arguments)
+ }),
+ toggleClass:
+ ((A = x.fn.toggleClass),
+ function (t, e, i, s, o) {
+ return 'boolean' == typeof e || void 0 === e
+ ? i
+ ? x.effects.animateClass.call(
+ this,
+ e ? { add: t } : { remove: t },
+ i,
+ s,
+ o
+ )
+ : A.apply(this, arguments)
+ : x.effects.animateClass.call(
+ this,
+ { toggle: t },
+ e,
+ i,
+ s
+ )
+ }),
+ switchClass: function (t, e, i, s, o) {
+ return x.effects.animateClass.call(
+ this,
+ { add: e, remove: t },
+ i,
+ s,
+ o
+ )
+ },
+ }),
+ x.expr &&
+ x.expr.pseudos &&
+ x.expr.pseudos.animated &&
+ (x.expr.pseudos.animated =
+ ((X = x.expr.pseudos.animated),
+ function (t) {
+ return !!x(t).data(Z) || X(t)
+ })),
+ !1 !== x.uiBackCompat &&
+ x.extend(x.effects, {
+ save: function (t, e) {
+ for (var i = 0, s = e.length; i < s; i++)
+ null !== e[i] && t.data(Q + e[i], t[0].style[e[i]])
+ },
+ restore: function (t, e) {
+ for (var i, s = 0, o = e.length; s < o; s++)
+ null !== e[s] &&
+ ((i = t.data(Q + e[s])), t.css(e[s], i))
+ },
+ setMode: function (t, e) {
+ return (e =
+ 'toggle' === e
+ ? t.is(':hidden')
+ ? 'show'
+ : 'hide'
+ : e)
+ },
+ createWrapper: function (i) {
+ if (i.parent().is('.ui-effects-wrapper')) return i.parent()
+ var s = {
+ width: i.outerWidth(!0),
+ height: i.outerHeight(!0),
+ float: i.css('float'),
+ },
+ t = x('
')
+ .addClass('ui-effects-wrapper')
+ .css({
+ fontSize: '100%',
+ background: 'transparent',
+ border: 'none',
+ margin: 0,
+ padding: 0,
+ }),
+ e = { width: i.width(), height: i.height() },
+ o = document.activeElement
+ try {
+ o.id
+ } catch (t) {
+ o = document.body
+ }
+ return (
+ i.wrap(t),
+ (i[0] !== o && !x.contains(i[0], o)) ||
+ x(o).trigger('focus'),
+ (t = i.parent()),
+ 'static' === i.css('position')
+ ? (t.css({ position: 'relative' }),
+ i.css({ position: 'relative' }))
+ : (x.extend(s, {
+ position: i.css('position'),
+ zIndex: i.css('z-index'),
+ }),
+ x.each(
+ ['top', 'left', 'bottom', 'right'],
+ function (t, e) {
+ ;(s[e] = i.css(e)),
+ isNaN(parseInt(s[e], 10)) &&
+ (s[e] = 'auto')
+ }
+ ),
+ i.css({
+ position: 'relative',
+ top: 0,
+ left: 0,
+ right: 'auto',
+ bottom: 'auto',
+ })),
+ i.css(e),
+ t.css(s).show()
+ )
+ },
+ removeWrapper: function (t) {
+ var e = document.activeElement
+ return (
+ t.parent().is('.ui-effects-wrapper') &&
+ (t.parent().replaceWith(t),
+ (t[0] !== e && !x.contains(t[0], e)) ||
+ x(e).trigger('focus')),
+ t
+ )
+ },
+ }),
+ x.extend(x.effects, {
+ version: '1.13.1',
+ define: function (t, e, i) {
+ return (
+ i || ((i = e), (e = 'effect')),
+ (x.effects.effect[t] = i),
+ (x.effects.effect[t].mode = e),
+ i
+ )
+ },
+ scaledDimensions: function (t, e, i) {
+ if (0 === e)
+ return {
+ height: 0,
+ width: 0,
+ outerHeight: 0,
+ outerWidth: 0,
+ }
+ var s = 'horizontal' !== i ? (e || 100) / 100 : 1,
+ e = 'vertical' !== i ? (e || 100) / 100 : 1
+ return {
+ height: t.height() * e,
+ width: t.width() * s,
+ outerHeight: t.outerHeight() * e,
+ outerWidth: t.outerWidth() * s,
+ }
+ },
+ clipToBox: function (t) {
+ return {
+ width: t.clip.right - t.clip.left,
+ height: t.clip.bottom - t.clip.top,
+ left: t.clip.left,
+ top: t.clip.top,
+ }
+ },
+ unshift: function (t, e, i) {
+ var s = t.queue()
+ 1 < e && s.splice.apply(s, [1, 0].concat(s.splice(e, i))),
+ t.dequeue()
+ },
+ saveStyle: function (t) {
+ t.data(G, t[0].style.cssText)
+ },
+ restoreStyle: function (t) {
+ ;(t[0].style.cssText = t.data(G) || ''), t.removeData(G)
+ },
+ mode: function (t, e) {
+ t = t.is(':hidden')
+ return (
+ 'toggle' === e && (e = t ? 'show' : 'hide'),
+ (e = (t ? 'hide' === e : 'show' === e) ? 'none' : e)
+ )
+ },
+ getBaseline: function (t, e) {
+ var i, s
+ switch (t[0]) {
+ case 'top':
+ i = 0
+ break
+ case 'middle':
+ i = 0.5
+ break
+ case 'bottom':
+ i = 1
+ break
+ default:
+ i = t[0] / e.height
+ }
+ switch (t[1]) {
+ case 'left':
+ s = 0
+ break
+ case 'center':
+ s = 0.5
+ break
+ case 'right':
+ s = 1
+ break
+ default:
+ s = t[1] / e.width
+ }
+ return { x: s, y: i }
+ },
+ createPlaceholder: function (t) {
+ var e,
+ i = t.css('position'),
+ s = t.position()
+ return (
+ t
+ .css({
+ marginTop: t.css('marginTop'),
+ marginBottom: t.css('marginBottom'),
+ marginLeft: t.css('marginLeft'),
+ marginRight: t.css('marginRight'),
+ })
+ .outerWidth(t.outerWidth())
+ .outerHeight(t.outerHeight()),
+ /^(static|relative)/.test(i) &&
+ ((i = 'absolute'),
+ (e = x('<' + t[0].nodeName + '>')
+ .insertAfter(t)
+ .css({
+ display: /^(inline|ruby)/.test(t.css('display'))
+ ? 'inline-block'
+ : 'block',
+ visibility: 'hidden',
+ marginTop: t.css('marginTop'),
+ marginBottom: t.css('marginBottom'),
+ marginLeft: t.css('marginLeft'),
+ marginRight: t.css('marginRight'),
+ float: t.css('float'),
+ })
+ .outerWidth(t.outerWidth())
+ .outerHeight(t.outerHeight())
+ .addClass('ui-effects-placeholder')),
+ t.data(Q + 'placeholder', e)),
+ t.css({ position: i, left: s.left, top: s.top }),
+ e
+ )
+ },
+ removePlaceholder: function (t) {
+ var e = Q + 'placeholder',
+ i = t.data(e)
+ i && (i.remove(), t.removeData(e))
+ },
+ cleanUp: function (t) {
+ x.effects.restoreStyle(t), x.effects.removePlaceholder(t)
+ },
+ setTransition: function (s, t, o, n) {
+ return (
+ (n = n || {}),
+ x.each(t, function (t, e) {
+ var i = s.cssUnit(e)
+ 0 < i[0] && (n[e] = i[0] * o + i[1])
+ }),
+ n
+ )
+ },
+ }),
+ x.fn.extend({
+ effect: function () {
+ function t(t) {
+ var e = x(this),
+ i = x.effects.mode(e, a) || n
+ e.data(Z, !0),
+ h.push(i),
+ n &&
+ ('show' === i || (i === n && 'hide' === i)) &&
+ e.show(),
+ (n && 'none' === i) || x.effects.saveStyle(e),
+ 'function' == typeof t && t()
+ }
+ var s = tt.apply(this, arguments),
+ o = x.effects.effect[s.effect],
+ n = o.mode,
+ e = s.queue,
+ i = e || 'fx',
+ r = s.complete,
+ a = s.mode,
+ h = []
+ return x.fx.off || !o
+ ? a
+ ? this[a](s.duration, r)
+ : this.each(function () {
+ r && r.call(this)
+ })
+ : !1 === e
+ ? this.each(t).each(l)
+ : this.queue(i, t).queue(i, l)
+ function l(t) {
+ var e = x(this)
+ function i() {
+ 'function' == typeof r && r.call(e[0]),
+ 'function' == typeof t && t()
+ }
+ ;(s.mode = h.shift()),
+ !1 === x.uiBackCompat || n
+ ? 'none' === s.mode
+ ? (e[a](), i())
+ : o.call(e[0], s, function () {
+ e.removeData(Z),
+ x.effects.cleanUp(e),
+ 'hide' === s.mode && e.hide(),
+ i()
+ })
+ : (e.is(':hidden') ? 'hide' === a : 'show' === a)
+ ? (e[a](), i())
+ : o.call(e[0], s, i)
+ }
+ },
+ show:
+ ((K = x.fn.show),
+ function (t) {
+ if (et(t)) return K.apply(this, arguments)
+ t = tt.apply(this, arguments)
+ return (t.mode = 'show'), this.effect.call(this, t)
+ }),
+ hide:
+ ((U = x.fn.hide),
+ function (t) {
+ if (et(t)) return U.apply(this, arguments)
+ t = tt.apply(this, arguments)
+ return (t.mode = 'hide'), this.effect.call(this, t)
+ }),
+ toggle:
+ ((Y = x.fn.toggle),
+ function (t) {
+ if (et(t) || 'boolean' == typeof t)
+ return Y.apply(this, arguments)
+ t = tt.apply(this, arguments)
+ return (t.mode = 'toggle'), this.effect.call(this, t)
+ }),
+ cssUnit: function (t) {
+ var i = this.css(t),
+ s = []
+ return (
+ x.each(['em', 'px', '%', 'pt'], function (t, e) {
+ 0 < i.indexOf(e) && (s = [parseFloat(i), e])
+ }),
+ s
+ )
+ },
+ cssClip: function (t) {
+ return t
+ ? this.css(
+ 'clip',
+ 'rect(' +
+ t.top +
+ 'px ' +
+ t.right +
+ 'px ' +
+ t.bottom +
+ 'px ' +
+ t.left +
+ 'px)'
+ )
+ : it(this.css('clip'), this)
+ },
+ transfer: function (t, e) {
+ var i = x(this),
+ s = x(t.to),
+ o = 'fixed' === s.css('position'),
+ n = x('body'),
+ r = o ? n.scrollTop() : 0,
+ a = o ? n.scrollLeft() : 0,
+ n = s.offset(),
+ n = {
+ top: n.top - r,
+ left: n.left - a,
+ height: s.innerHeight(),
+ width: s.innerWidth(),
+ },
+ s = i.offset(),
+ h = x("
")
+ h.appendTo('body')
+ .addClass(t.className)
+ .css({
+ top: s.top - r,
+ left: s.left - a,
+ height: i.innerHeight(),
+ width: i.innerWidth(),
+ position: o ? 'fixed' : 'absolute',
+ })
+ .animate(n, t.duration, t.easing, function () {
+ h.remove(), 'function' == typeof e && e()
+ })
+ },
+ }),
+ (x.fx.step.clip = function (t) {
+ t.clipInit ||
+ ((t.start = x(t.elem).cssClip()),
+ 'string' == typeof t.end && (t.end = it(t.end, t.elem)),
+ (t.clipInit = !0)),
+ x(t.elem).cssClip({
+ top: t.pos * (t.end.top - t.start.top) + t.start.top,
+ right:
+ t.pos * (t.end.right - t.start.right) + t.start.right,
+ bottom:
+ t.pos * (t.end.bottom - t.start.bottom) +
+ t.start.bottom,
+ left: t.pos * (t.end.left - t.start.left) + t.start.left,
+ })
+ }),
+ ($ = {}),
+ x.each(['Quad', 'Cubic', 'Quart', 'Quint', 'Expo'], function (e, t) {
+ $[t] = function (t) {
+ return Math.pow(t, e + 2)
+ }
+ }),
+ x.extend($, {
+ Sine: function (t) {
+ return 1 - Math.cos((t * Math.PI) / 2)
+ },
+ Circ: function (t) {
+ return 1 - Math.sqrt(1 - t * t)
+ },
+ Elastic: function (t) {
+ return 0 === t || 1 === t
+ ? t
+ : -Math.pow(2, 8 * (t - 1)) *
+ Math.sin(((80 * (t - 1) - 7.5) * Math.PI) / 15)
+ },
+ Back: function (t) {
+ return t * t * (3 * t - 2)
+ },
+ Bounce: function (t) {
+ for (var e, i = 4; t < ((e = Math.pow(2, --i)) - 1) / 11; );
+ return (
+ 1 / Math.pow(4, 3 - i) -
+ 7.5625 * Math.pow((3 * e - 2) / 22 - t, 2)
+ )
+ },
+ }),
+ x.each($, function (t, e) {
+ ;(x.easing['easeIn' + t] = e),
+ (x.easing['easeOut' + t] = function (t) {
+ return 1 - e(1 - t)
+ }),
+ (x.easing['easeInOut' + t] = function (t) {
+ return t < 0.5 ? e(2 * t) / 2 : 1 - e(-2 * t + 2) / 2
+ })
+ })
+ ;(O = x.effects),
+ x.effects.define('blind', 'hide', function (t, e) {
+ var i = {
+ up: ['bottom', 'top'],
+ vertical: ['bottom', 'top'],
+ down: ['top', 'bottom'],
+ left: ['right', 'left'],
+ horizontal: ['right', 'left'],
+ right: ['left', 'right'],
+ },
+ s = x(this),
+ o = t.direction || 'up',
+ n = s.cssClip(),
+ r = { clip: x.extend({}, n) },
+ a = x.effects.createPlaceholder(s)
+ ;(r.clip[i[o][0]] = r.clip[i[o][1]]),
+ 'show' === t.mode &&
+ (s.cssClip(r.clip),
+ a && a.css(x.effects.clipToBox(r)),
+ (r.clip = n)),
+ a && a.animate(x.effects.clipToBox(r), t.duration, t.easing),
+ s.animate(r, {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ })
+ }),
+ x.effects.define('bounce', function (t, e) {
+ var i,
+ s,
+ o = x(this),
+ n = t.mode,
+ r = 'hide' === n,
+ a = 'show' === n,
+ h = t.direction || 'up',
+ l = t.distance,
+ c = t.times || 5,
+ n = 2 * c + (a || r ? 1 : 0),
+ p = t.duration / n,
+ u = t.easing,
+ d = 'up' === h || 'down' === h ? 'top' : 'left',
+ f = 'up' === h || 'left' === h,
+ g = 0,
+ t = o.queue().length
+ for (
+ x.effects.createPlaceholder(o),
+ h = o.css(d),
+ l = l || o['top' == d ? 'outerHeight' : 'outerWidth']() / 3,
+ a &&
+ (((s = { opacity: 1 })[d] = h),
+ o
+ .css('opacity', 0)
+ .css(d, f ? 2 * -l : 2 * l)
+ .animate(s, p, u)),
+ r && (l /= Math.pow(2, c - 1)),
+ (s = {})[d] = h;
+ g < c;
+ g++
+ )
+ ((i = {})[d] = (f ? '-=' : '+=') + l),
+ o.animate(i, p, u).animate(s, p, u),
+ (l = r ? 2 * l : l / 2)
+ r &&
+ (((i = { opacity: 0 })[d] = (f ? '-=' : '+=') + l),
+ o.animate(i, p, u)),
+ o.queue(e),
+ x.effects.unshift(o, t, 1 + n)
+ }),
+ x.effects.define('clip', 'hide', function (t, e) {
+ var i = {},
+ s = x(this),
+ o = t.direction || 'vertical',
+ n = 'both' === o,
+ r = n || 'horizontal' === o,
+ n = n || 'vertical' === o,
+ o = s.cssClip()
+ ;(i.clip = {
+ top: n ? (o.bottom - o.top) / 2 : o.top,
+ right: r ? (o.right - o.left) / 2 : o.right,
+ bottom: n ? (o.bottom - o.top) / 2 : o.bottom,
+ left: r ? (o.right - o.left) / 2 : o.left,
+ }),
+ x.effects.createPlaceholder(s),
+ 'show' === t.mode && (s.cssClip(i.clip), (i.clip = o)),
+ s.animate(i, {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ })
+ }),
+ x.effects.define('drop', 'hide', function (t, e) {
+ var i = x(this),
+ s = 'show' === t.mode,
+ o = t.direction || 'left',
+ n = 'up' === o || 'down' === o ? 'top' : 'left',
+ r = 'up' === o || 'left' === o ? '-=' : '+=',
+ a = '+=' == r ? '-=' : '+=',
+ h = { opacity: 0 }
+ x.effects.createPlaceholder(i),
+ (o =
+ t.distance ||
+ i['top' == n ? 'outerHeight' : 'outerWidth'](!0) / 2),
+ (h[n] = r + o),
+ s && (i.css(h), (h[n] = a + o), (h.opacity = 1)),
+ i.animate(h, {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ })
+ }),
+ x.effects.define('explode', 'hide', function (t, e) {
+ var i,
+ s,
+ o,
+ n,
+ r,
+ a,
+ h = t.pieces ? Math.round(Math.sqrt(t.pieces)) : 3,
+ l = h,
+ c = x(this),
+ p = 'show' === t.mode,
+ u = c.show().css('visibility', 'hidden').offset(),
+ d = Math.ceil(c.outerWidth() / l),
+ f = Math.ceil(c.outerHeight() / h),
+ g = []
+ function m() {
+ g.push(this),
+ g.length === h * l &&
+ (c.css({ visibility: 'visible' }), x(g).remove(), e())
+ }
+ for (i = 0; i < h; i++)
+ for (n = u.top + i * f, a = i - (h - 1) / 2, s = 0; s < l; s++)
+ (o = u.left + s * d),
+ (r = s - (l - 1) / 2),
+ c
+ .clone()
+ .appendTo('body')
+ .wrap('
')
+ .css({
+ position: 'absolute',
+ visibility: 'visible',
+ left: -s * d,
+ top: -i * f,
+ })
+ .parent()
+ .addClass('ui-effects-explode')
+ .css({
+ position: 'absolute',
+ overflow: 'hidden',
+ width: d,
+ height: f,
+ left: o + (p ? r * d : 0),
+ top: n + (p ? a * f : 0),
+ opacity: p ? 0 : 1,
+ })
+ .animate(
+ {
+ left: o + (p ? 0 : r * d),
+ top: n + (p ? 0 : a * f),
+ opacity: p ? 1 : 0,
+ },
+ t.duration || 500,
+ t.easing,
+ m
+ )
+ }),
+ x.effects.define('fade', 'toggle', function (t, e) {
+ var i = 'show' === t.mode
+ x(this)
+ .css('opacity', i ? 0 : 1)
+ .animate(
+ { opacity: i ? 1 : 0 },
+ {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ }
+ )
+ }),
+ x.effects.define('fold', 'hide', function (e, t) {
+ var i = x(this),
+ s = e.mode,
+ o = 'show' === s,
+ n = 'hide' === s,
+ r = e.size || 15,
+ a = /([0-9]+)%/.exec(r),
+ h = e.horizFirst ? ['right', 'bottom'] : ['bottom', 'right'],
+ l = e.duration / 2,
+ c = x.effects.createPlaceholder(i),
+ p = i.cssClip(),
+ u = { clip: x.extend({}, p) },
+ d = { clip: x.extend({}, p) },
+ f = [p[h[0]], p[h[1]]],
+ s = i.queue().length
+ a && (r = (parseInt(a[1], 10) / 100) * f[n ? 0 : 1]),
+ (u.clip[h[0]] = r),
+ (d.clip[h[0]] = r),
+ (d.clip[h[1]] = 0),
+ o &&
+ (i.cssClip(d.clip),
+ c && c.css(x.effects.clipToBox(d)),
+ (d.clip = p)),
+ i
+ .queue(function (t) {
+ c &&
+ c
+ .animate(x.effects.clipToBox(u), l, e.easing)
+ .animate(x.effects.clipToBox(d), l, e.easing),
+ t()
+ })
+ .animate(u, l, e.easing)
+ .animate(d, l, e.easing)
+ .queue(t),
+ x.effects.unshift(i, s, 4)
+ }),
+ x.effects.define('highlight', 'show', function (t, e) {
+ var i = x(this),
+ s = { backgroundColor: i.css('backgroundColor') }
+ 'hide' === t.mode && (s.opacity = 0),
+ x.effects.saveStyle(i),
+ i
+ .css({
+ backgroundImage: 'none',
+ backgroundColor: t.color || '#ffff99',
+ })
+ .animate(s, {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ })
+ }),
+ x.effects.define('size', function (s, e) {
+ var o,
+ i = x(this),
+ t = ['fontSize'],
+ n = [
+ 'borderTopWidth',
+ 'borderBottomWidth',
+ 'paddingTop',
+ 'paddingBottom',
+ ],
+ r = [
+ 'borderLeftWidth',
+ 'borderRightWidth',
+ 'paddingLeft',
+ 'paddingRight',
+ ],
+ a = s.mode,
+ h = 'effect' !== a,
+ l = s.scale || 'both',
+ c = s.origin || ['middle', 'center'],
+ p = i.css('position'),
+ u = i.position(),
+ d = x.effects.scaledDimensions(i),
+ f = s.from || d,
+ g = s.to || x.effects.scaledDimensions(i, 0)
+ x.effects.createPlaceholder(i),
+ 'show' === a && ((a = f), (f = g), (g = a)),
+ (o = {
+ from: { y: f.height / d.height, x: f.width / d.width },
+ to: { y: g.height / d.height, x: g.width / d.width },
+ }),
+ ('box' !== l && 'both' !== l) ||
+ (o.from.y !== o.to.y &&
+ ((f = x.effects.setTransition(i, n, o.from.y, f)),
+ (g = x.effects.setTransition(i, n, o.to.y, g))),
+ o.from.x !== o.to.x &&
+ ((f = x.effects.setTransition(i, r, o.from.x, f)),
+ (g = x.effects.setTransition(i, r, o.to.x, g)))),
+ ('content' !== l && 'both' !== l) ||
+ (o.from.y !== o.to.y &&
+ ((f = x.effects.setTransition(i, t, o.from.y, f)),
+ (g = x.effects.setTransition(i, t, o.to.y, g)))),
+ c &&
+ ((c = x.effects.getBaseline(c, d)),
+ (f.top = (d.outerHeight - f.outerHeight) * c.y + u.top),
+ (f.left = (d.outerWidth - f.outerWidth) * c.x + u.left),
+ (g.top = (d.outerHeight - g.outerHeight) * c.y + u.top),
+ (g.left = (d.outerWidth - g.outerWidth) * c.x + u.left)),
+ delete f.outerHeight,
+ delete f.outerWidth,
+ i.css(f),
+ ('content' !== l && 'both' !== l) ||
+ ((n = n.concat(['marginTop', 'marginBottom']).concat(t)),
+ (r = r.concat(['marginLeft', 'marginRight'])),
+ i.find('*[width]').each(function () {
+ var t = x(this),
+ e = x.effects.scaledDimensions(t),
+ i = {
+ height: e.height * o.from.y,
+ width: e.width * o.from.x,
+ outerHeight: e.outerHeight * o.from.y,
+ outerWidth: e.outerWidth * o.from.x,
+ },
+ e = {
+ height: e.height * o.to.y,
+ width: e.width * o.to.x,
+ outerHeight: e.height * o.to.y,
+ outerWidth: e.width * o.to.x,
+ }
+ o.from.y !== o.to.y &&
+ ((i = x.effects.setTransition(t, n, o.from.y, i)),
+ (e = x.effects.setTransition(t, n, o.to.y, e))),
+ o.from.x !== o.to.x &&
+ ((i = x.effects.setTransition(
+ t,
+ r,
+ o.from.x,
+ i
+ )),
+ (e = x.effects.setTransition(t, r, o.to.x, e))),
+ h && x.effects.saveStyle(t),
+ t.css(i),
+ t.animate(e, s.duration, s.easing, function () {
+ h && x.effects.restoreStyle(t)
+ })
+ })),
+ i.animate(g, {
+ queue: !1,
+ duration: s.duration,
+ easing: s.easing,
+ complete: function () {
+ var t = i.offset()
+ 0 === g.opacity && i.css('opacity', f.opacity),
+ h ||
+ (i
+ .css(
+ 'position',
+ 'static' === p ? 'relative' : p
+ )
+ .offset(t),
+ x.effects.saveStyle(i)),
+ e()
+ },
+ })
+ }),
+ x.effects.define('scale', function (t, e) {
+ var i = x(this),
+ s = t.mode,
+ s =
+ parseInt(t.percent, 10) ||
+ (0 === parseInt(t.percent, 10) || 'effect' !== s ? 0 : 100),
+ s = x.extend(
+ !0,
+ {
+ from: x.effects.scaledDimensions(i),
+ to: x.effects.scaledDimensions(
+ i,
+ s,
+ t.direction || 'both'
+ ),
+ origin: t.origin || ['middle', 'center'],
+ },
+ t
+ )
+ t.fade && ((s.from.opacity = 1), (s.to.opacity = 0)),
+ x.effects.effect.size.call(this, s, e)
+ }),
+ x.effects.define('puff', 'hide', function (t, e) {
+ t = x.extend(!0, {}, t, {
+ fade: !0,
+ percent: parseInt(t.percent, 10) || 150,
+ })
+ x.effects.effect.scale.call(this, t, e)
+ }),
+ x.effects.define('pulsate', 'show', function (t, e) {
+ var i = x(this),
+ s = t.mode,
+ o = 'show' === s,
+ n = 2 * (t.times || 5) + (o || 'hide' === s ? 1 : 0),
+ r = t.duration / n,
+ a = 0,
+ h = 1,
+ s = i.queue().length
+ for (
+ (!o && i.is(':visible')) ||
+ (i.css('opacity', 0).show(), (a = 1));
+ h < n;
+ h++
+ )
+ i.animate({ opacity: a }, r, t.easing), (a = 1 - a)
+ i.animate({ opacity: a }, r, t.easing),
+ i.queue(e),
+ x.effects.unshift(i, s, 1 + n)
+ }),
+ x.effects.define('shake', function (t, e) {
+ var i = 1,
+ s = x(this),
+ o = t.direction || 'left',
+ n = t.distance || 20,
+ r = t.times || 3,
+ a = 2 * r + 1,
+ h = Math.round(t.duration / a),
+ l = 'up' === o || 'down' === o ? 'top' : 'left',
+ c = 'up' === o || 'left' === o,
+ p = {},
+ u = {},
+ d = {},
+ o = s.queue().length
+ for (
+ x.effects.createPlaceholder(s),
+ p[l] = (c ? '-=' : '+=') + n,
+ u[l] = (c ? '+=' : '-=') + 2 * n,
+ d[l] = (c ? '-=' : '+=') + 2 * n,
+ s.animate(p, h, t.easing);
+ i < r;
+ i++
+ )
+ s.animate(u, h, t.easing).animate(d, h, t.easing)
+ s
+ .animate(u, h, t.easing)
+ .animate(p, h / 2, t.easing)
+ .queue(e),
+ x.effects.unshift(s, o, 1 + a)
+ }),
+ x.effects.define('slide', 'show', function (t, e) {
+ var i,
+ s,
+ o = x(this),
+ n = {
+ up: ['bottom', 'top'],
+ down: ['top', 'bottom'],
+ left: ['right', 'left'],
+ right: ['left', 'right'],
+ },
+ r = t.mode,
+ a = t.direction || 'left',
+ h = 'up' === a || 'down' === a ? 'top' : 'left',
+ l = 'up' === a || 'left' === a,
+ c =
+ t.distance ||
+ o['top' == h ? 'outerHeight' : 'outerWidth'](!0),
+ p = {}
+ x.effects.createPlaceholder(o),
+ (i = o.cssClip()),
+ (s = o.position()[h]),
+ (p[h] = (l ? -1 : 1) * c + s),
+ (p.clip = o.cssClip()),
+ (p.clip[n[a][1]] = p.clip[n[a][0]]),
+ 'show' === r &&
+ (o.cssClip(p.clip),
+ o.css(h, p[h]),
+ (p.clip = i),
+ (p[h] = s)),
+ o.animate(p, {
+ queue: !1,
+ duration: t.duration,
+ easing: t.easing,
+ complete: e,
+ })
+ }),
+ !1 !== x.uiBackCompat &&
+ x.effects.define('transfer', function (t, e) {
+ x(this).transfer(t, e)
+ })
+})
diff --git a/v1/src/simulator/vendor/table2csv.js b/v1/src/simulator/vendor/table2csv.js
new file mode 100644
index 00000000..ab734062
--- /dev/null
+++ b/v1/src/simulator/vendor/table2csv.js
@@ -0,0 +1,113 @@
+jQuery.fn.table2CSV = function (options) {
+ var options = jQuery.extend(
+ {
+ separator: ',',
+ header: [],
+ headerSelector: 'none',
+ columnSelector: 'td, th',
+ delivery: 'value', // popup, value, download
+ // filename: 'test.csv', // filename to download
+ transform_gt_lt: true, // make > and < to > and <
+ },
+ options
+ )
+
+ var csvData = []
+ var headerArr = []
+ var el = this
+
+ //header
+ var numCols = options.header.length
+ var tmpRow = [] // construct header avalible array
+
+ if (numCols > 0) {
+ for (var i = 0; i < numCols; i++) {
+ tmpRow[tmpRow.length] = formatData(options.header[i])
+ }
+ } else {
+ $(el)
+ .filter(':visible')
+ .find(options.headerSelector)
+ .each(function () {
+ if ($(this).css('display') != 'none')
+ tmpRow[tmpRow.length] = formatData($(this).html())
+ })
+ }
+
+ row2CSV(tmpRow)
+
+ // actual data
+ $(el)
+ .find('tr')
+ .each(function () {
+ var tmpRow = []
+ $(this)
+ .filter(':visible')
+ .find(options.columnSelector)
+ .each(function () {
+ if ($(this).css('display') != 'none')
+ tmpRow[tmpRow.length] = formatData($(this).html())
+ })
+ row2CSV(tmpRow)
+ })
+ if (options.delivery == 'popup') {
+ var mydata = csvData.join('\n')
+ if (options.transform_gt_lt) {
+ mydata = sinri_recover_gt_and_lt(mydata)
+ }
+ return popup(mydata)
+ } else if (options.delivery == 'download') {
+ var mydata = csvData.join('\n')
+ if (options.transform_gt_lt) {
+ mydata = sinri_recover_gt_and_lt(mydata)
+ }
+ var url = 'data:text/csv;charset=utf8,' + encodeURIComponent(mydata)
+ window.open(url)
+ return true
+ } else {
+ var mydata = csvData.join('\n')
+ if (options.transform_gt_lt) {
+ mydata = sinri_recover_gt_and_lt(mydata)
+ }
+ return mydata
+ }
+
+ function sinri_recover_gt_and_lt(input) {
+ var regexp = new RegExp(/>/g)
+ var input = input.replace(regexp, '>')
+ var regexp = new RegExp(/</g)
+ var input = input.replace(regexp, '<')
+ return input
+ }
+
+ function row2CSV(tmpRow) {
+ var tmp = tmpRow.join('') // to remove any blank rows
+ // alert(tmp);
+ if (tmpRow.length > 0 && tmp != '') {
+ var mystr = tmpRow.join(options.separator)
+ csvData[csvData.length] = mystr
+ }
+ }
+ function formatData(input) {
+ // double " according to rfc4180
+ var regexp = new RegExp(/["]/g)
+ var output = input.replace(regexp, '""')
+ //HTML
+ var regexp = new RegExp(/\<[^\<]+\>/g)
+ var output = output.replace(regexp, '')
+ output = output.replace(/ /gi, ' ') //replace
+ if (output == '') return ''
+ return '"' + output.trim() + '"'
+ }
+ function popup(data) {
+ var generator = window.open('', 'csv', 'height=400,width=600')
+ generator.document.write('
CSV ')
+ generator.document.write('')
+ generator.document.write('
')
+ generator.document.write('')
+ generator.document.close()
+ return true
+ }
+}
diff --git a/v1/src/store/SimulatorStore/SimulatorStore.ts b/v1/src/store/SimulatorStore/SimulatorStore.ts
new file mode 100644
index 00000000..69aa9cb3
--- /dev/null
+++ b/v1/src/store/SimulatorStore/SimulatorStore.ts
@@ -0,0 +1,13 @@
+import { extractStore } from '../extractStore'
+import { defineStore } from 'pinia'
+import { useActions } from './actions'
+import { useGetters } from './getters'
+import { useState } from './state'
+
+export const SimulatorStore = defineStore('simulatorStore', () => {
+ return {
+ ...extractStore(useState()),
+ ...extractStore(useGetters()),
+ ...extractStore(useActions()),
+ }
+})
diff --git a/v1/src/store/SimulatorStore/actions.ts b/v1/src/store/SimulatorStore/actions.ts
new file mode 100644
index 00000000..e127bc5f
--- /dev/null
+++ b/v1/src/store/SimulatorStore/actions.ts
@@ -0,0 +1,16 @@
+import { defineStore } from 'pinia'
+import { useState } from './state'
+
+export const useActions = defineStore('simulatorStore.actions', () => {
+ const state = useState()
+
+ function showTitle(): void {
+ console.log(state.title)
+ }
+
+ // Note you are free to define as many internal functions as you want.
+ // You only expose the functions that are returned.
+ return {
+ showTitle,
+ }
+})
diff --git a/v1/src/store/SimulatorStore/getters.ts b/v1/src/store/SimulatorStore/getters.ts
new file mode 100644
index 00000000..6d409942
--- /dev/null
+++ b/v1/src/store/SimulatorStore/getters.ts
@@ -0,0 +1,15 @@
+import { defineStore } from 'pinia'
+import { computed } from 'vue'
+import { useState } from './state'
+
+export const useGetters = defineStore('simulatorStore.getters', () => {
+ const state = useState()
+
+ const getTitle = computed((): string => {
+ return `${state.title} !!!`
+ })
+
+ return {
+ getTitle,
+ }
+})
diff --git a/v1/src/store/SimulatorStore/state.ts b/v1/src/store/SimulatorStore/state.ts
new file mode 100644
index 00000000..1bad89ad
--- /dev/null
+++ b/v1/src/store/SimulatorStore/state.ts
@@ -0,0 +1,66 @@
+import { defineStore } from 'pinia'
+
+// use camel case variable names
+export interface State {
+ title: string
+ activeCircuit:
+ | Object
+ | {
+ id: number | string
+ name: string
+ }
+ circuit_list: Array
+ dialogBox: {
+ // create_circuit: boolean
+ // delete_circuit: boolean
+ combinationalanalysis_dialog: boolean
+ hex_bin_dec_converter_dialog: boolean
+ saveimage_dialog: boolean
+ theme_dialog: boolean
+ customshortcut_dialog: boolean
+ insertsubcircuit_dialog: boolean
+ exportverilog_dialog: boolean
+ save_project_dialog: boolean
+ open_project_dialog: boolean
+ export_project_dialog: boolean
+ import_project_dialog: boolean
+ }
+ // createCircuit: Object | { circuitName: string }
+ combinationalAnalysis: Object
+}
+
+export const useState = defineStore({
+ id: 'simulatorStore.state',
+
+ state: (): State => {
+ return {
+ title: 'Welcome to CircuitVerse Simulator',
+ activeCircuit: {},
+ circuit_list: [],
+ dialogBox: {
+ // create_circuit: false,
+ // delete_circuit: false,
+ combinationalanalysis_dialog: false,
+ hex_bin_dec_converter_dialog: false,
+ saveimage_dialog: false,
+ theme_dialog: false,
+ customshortcut_dialog: false,
+ insertsubcircuit_dialog: false,
+ exportverilog_dialog: false,
+ save_project_dialog: false,
+ open_project_dialog: false,
+ export_project_dialog: false,
+ import_project_dialog: false,
+ },
+ // createCircuit: {
+ // circuitName: 'Untitled Circuit',
+ // },
+ combinationalAnalysis: {
+ inputNameList: 'eg. In A, In B',
+ outputNameList: 'eg. Out X, Out Y',
+ booleanExpression: 'Example: (AB)',
+ decimalColumnBox: false,
+ },
+ }
+ },
+})
diff --git a/v1/src/store/authStore.ts b/v1/src/store/authStore.ts
new file mode 100644
index 00000000..12dd433c
--- /dev/null
+++ b/v1/src/store/authStore.ts
@@ -0,0 +1,57 @@
+import { defineStore } from 'pinia'
+
+interface AuthStoreType {
+ isLoggedIn: boolean
+ userId: string | number
+ username: string
+ locale: string
+ isAdmin: boolean
+}
+
+interface UserInfo {
+ isLoggedIn: boolean
+ id: string
+ attributes: {
+ name: string
+ locale: string
+ admin: boolean
+ }
+}
+export const useAuthStore = defineStore({
+ id: 'authStore',
+ state: (): AuthStoreType => ({
+ isLoggedIn: false,
+ userId: '',
+ username: '',
+ locale: 'en',
+ isAdmin: false,
+ }),
+ actions: {
+ setUserInfo(userInfo: UserInfo): void {
+ this.isLoggedIn = true
+ this.userId = userInfo.id ?? ''
+ this.username = userInfo.attributes.name ?? ''
+ this.locale = userInfo.attributes.locale ?? 'en'
+ this.isAdmin = userInfo.attributes.admin
+ },
+ },
+ getters: {
+ getIsLoggedIn(): boolean {
+ return this.isLoggedIn
+ },
+ getUserId(): string | number {
+ return this.userId
+ },
+ getUsername(): string {
+ return this.username
+ },
+ getLocale(): string {
+ return this.locale
+ },
+ getIsAdmin(): boolean {
+ return this.isAdmin
+ },
+ },
+})
+
+// TODO: extract store verify and check better ways to impliment
diff --git a/v1/src/store/extractStore.ts b/v1/src/store/extractStore.ts
new file mode 100644
index 00000000..f7b48129
--- /dev/null
+++ b/v1/src/store/extractStore.ts
@@ -0,0 +1,40 @@
+import type {
+ PiniaCustomStateProperties,
+ StoreActions,
+ StoreGeneric,
+ StoreGetters,
+ StoreState,
+} from 'pinia'
+import type { ToRefs } from 'vue'
+import { isReactive, isRef, toRaw, toRef } from 'vue'
+
+type Extracted = ToRefs<
+ StoreState &
+ StoreGetters &
+ PiniaCustomStateProperties>
+> &
+ StoreActions
+
+/**
+ * Creates an object of references with all the state, getters, actions
+ * and plugin-added state properties of the store.
+ *
+ * @param store - store to extract the refs from
+ */
+export function extractStore(
+ store: SS
+): Extracted {
+ const rawStore = toRaw(store)
+ const refs: Record = {}
+
+ for (const [key, value] of Object.entries(rawStore)) {
+ if (isRef(value) || isReactive(value)) {
+ refs[key] = toRef(store, key)
+ } else if (typeof value === 'function') {
+ refs[key] = value
+ }
+ }
+
+ // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+ return refs as Extracted
+}
diff --git a/v1/src/store/projectStore.ts b/v1/src/store/projectStore.ts
new file mode 100644
index 00000000..3a09d0c8
--- /dev/null
+++ b/v1/src/store/projectStore.ts
@@ -0,0 +1,37 @@
+import { defineStore } from 'pinia'
+
+interface projectStoreType {
+ project: {
+ // id: number //use later if needed
+ name: string
+ nameDefined: boolean
+ }
+}
+
+export const useProjectStore = defineStore({
+ id: 'projectStore',
+ state: (): projectStoreType => ({
+ project: {
+ // id: 0, //use later if needed
+ name: 'Untitled',
+ nameDefined: false,
+ },
+ }),
+ actions: {
+ setProjectName(projectName: string): void {
+ this.project.name = projectName
+ this.project.nameDefined = true
+ },
+ setProjectNameDefined(defined: boolean = true): void {
+ this.project.nameDefined = defined
+ },
+ },
+ getters: {
+ getProjectName(): string {
+ return this.project.name
+ },
+ getProjectNameDefined(): boolean {
+ return this.project.nameDefined
+ },
+ },
+})
diff --git a/v1/src/store/promptStore.ts b/v1/src/store/promptStore.ts
new file mode 100644
index 00000000..612c35b3
--- /dev/null
+++ b/v1/src/store/promptStore.ts
@@ -0,0 +1,113 @@
+import { HTMLContent } from '@tiptap/core'
+import { defineStore } from 'pinia'
+
+interface promptStoreType {
+ resolvePromise: Function
+ // resolvePromise: (value?: string | undefined) => void
+ prompt: {
+ activate: boolean
+ messageText: string
+ isPersistent: boolean
+ buttonList: Array<{
+ text: string
+ emitOption: string
+ }>
+ inputList: Array<{
+ text: string
+ val: string
+ placeholder: string
+ id: string
+ class: string
+ style: string
+ type: string
+ }>
+ }
+ confirm: {
+ activate: boolean
+ messageText: string
+ isPersistent: boolean
+ buttonList: Array<{
+ text: string
+ emitOption: string | boolean
+ }>
+ }
+ DeleteCircuit: {
+ activate: boolean
+ messageText: string
+ isPersistent: boolean
+ buttonList: Array<{
+ text: string
+ emitOption: string
+ }>
+ circuitItem: object
+ }
+ UpdateProjectDetail: {
+ activate: boolean
+ projectId: number
+ projectName: string
+ projectTags: string
+ projectType: Readonly | string
+ projectDescription: HTMLContent
+ }
+}
+
+export const usePromptStore = defineStore({
+ id: 'promptStore',
+ state: (): promptStoreType => ({
+ resolvePromise: (): any => {},
+ prompt: {
+ activate: false,
+ messageText: '',
+ isPersistent: false,
+ buttonList: [],
+ inputList: [],
+ },
+ confirm: {
+ activate: false,
+ messageText: '',
+ isPersistent: false,
+ buttonList: [],
+ },
+ DeleteCircuit: {
+ activate: false,
+ messageText: '',
+ isPersistent: false,
+ buttonList: [],
+ circuitItem: {},
+ },
+ UpdateProjectDetail: {
+ activate: false,
+ projectId: 0,
+ projectName: '',
+ projectTags: '',
+ projectType: 'Public',
+ projectDescription: '',
+ },
+ }),
+ actions: {
+ // resolvePromise(): any {},
+ setProjectName(projectName: string): void {
+ this.UpdateProjectDetail.projectName = projectName
+ },
+ setProjectId(projectId: number): void {
+ this.UpdateProjectDetail.projectId = projectId
+ },
+ },
+ getters: {
+ getProjectName(): string {
+ return this.UpdateProjectDetail.projectName
+ },
+ getProjectId(): number {
+ return this.UpdateProjectDetail.projectId
+ },
+ getProjectTags(): string {
+ return this.UpdateProjectDetail.projectTags
+ },
+ getProjectType(): Readonly | string {
+ return this.UpdateProjectDetail.projectType
+ },
+ getProjectDescription(): HTMLContent {
+ return this.UpdateProjectDetail.projectDescription
+ },
+ },
+})
diff --git a/v1/src/styles/color_theme.scss b/v1/src/styles/color_theme.scss
new file mode 100644
index 00000000..5bdc9fff
--- /dev/null
+++ b/v1/src/styles/color_theme.scss
@@ -0,0 +1,551 @@
+:root {
+ --primary: #454545;
+
+ --bg-navbar: #454545;
+ --text-navbar--alt: #000;
+ --qp-br-tl: #333;
+ --qp-br-rd: #535353;
+
+ --br-circuit: #454545;
+ --br-circuit-cur: #fff;
+ --bg-tabs: #8b8b8b;
+ --bg-circuit: #bbb;
+
+ --text-lite: #fff;
+ --text-dark: #000;
+ --text-panel: #fff;
+ --text-circuit: #000;
+
+ --context-text: #fff;
+ --context-text-hov: #000;
+
+ --cus-radio_label: #656565;
+
+ --br-secondary: #7d7d7d;
+
+ --br-primary: #fff;
+ --bg-primary-moz: hsla(0, 0%, 27%, 0.902);
+ --bg-primary-chr: hsla(0, 0%, 27%, 0.702);
+ --bg-icons: #7d7d7d;
+ --bg-text: #cacaca;
+ --bg-secondary: #bbb;
+ --canvas-stroke:#eee;
+ --canvas-fill: #fff;
+ --bg-toggle-btn-primary: #42b983;
+ --primary-btn-hov: #3ca877;
+ --btn-danger: #dc5656;
+ --btn-danger-darken: #b03662;
+ --disable: #6c8b93;
+ --qp-box-shadow-1: #3b3b3b;
+ --qp-box-shadow-2: #4f4f4f;
+ --cus-btn-hov--bg: #ddd;
+ --cus-btn-hov-text: #000;
+ --node: green;
+ --stroke: black;
+ --fill: white;
+ --hover-and-sel: rgba(255, 255, 32, 0.8);
+ --wire-draw: #000;
+ --wire-cnt: green;
+ --wire-pow: Lime;
+ --wire-sel: blue;
+ --wire-lose: red;
+ --mini-map: green;
+ --mini-map-stroke: darkgreen;
+ --input-text: green;
+ --secondary-stroke: red;
+ --text: black;
+ --wire-norm: black;
+ --node-norm: green;
+ --splitter: black;
+ --output-rect: blue;
+}
+
+::-moz-selection {
+ color: var(--text-lite);
+ background: var(--bg-icons);
+}
+
+::selection {
+ color: var(--text-lite);
+ background: var(--bg-icons);
+}
+
+.navbar-menu > li > a {
+ color: #fff;
+}
+
+.projectName {
+ color: #fff;
+}
+
+.header {
+ background: var(--bg-navbar);
+}
+
+.dropdown > ul {
+ background-color: var(--bg-primary-moz);
+ border: 0.5px solid var(--bg-tabs);
+}
+
+@supports (backdrop-filter: blur()) {
+ .dropdown > ul {
+ background-color: var(--bg-primary-chr);
+ }
+}
+
+.dropdown > ul::before {
+ border-top: 1px solid var(--bg-tabs);
+ border-right: 1px solid var(--bg-tabs);
+}
+
+.dropdown > ul::after {
+ border-top: 1.5px solid var(--primary);
+}
+
+.dropdown-menu > li > a {
+ color: #fff !important;
+}
+
+.signIn-btn {
+ color: #fff !important;
+}
+
+.dropdown-menu > li > a:hover {
+ color: var(--text-navbar--alt) !important;
+ background: var(--bg-text);
+}
+
+#contextMenu {
+ border: 0.5px solid var(--bg-tabs);
+ background-color: var(--bg-primary-moz);
+ color: var(--context-text);
+}
+
+#contextMenu ul li:hover {
+ color: var(--context-text-hov);
+ background: var(--bg-text);
+}
+
+@supports (backdrop-filter: blur()) {
+ #contextMenu {
+ background-color: var(--bg-primary-chr);
+ }
+}
+
+.draggable-panel {
+ background: var(--primary);
+ border: 2px solid var(--br-primary);
+ box-shadow: 0px 0px 10px #4545457f;
+}
+
+.panel-header {
+ color: var(--text-panel);
+ background: var(--primary);
+}
+
+.panel-body {
+ color: var(--text-panel);
+ border-top: 1px solid var(--br-secondary);
+}
+
+.panel-header::before {
+ border-top: 2px solid var(--text-panel);
+}
+
+.search-input {
+ color: var(--text-panel);
+ border: 1px solid var(--br-secondary);
+}
+
+.timing-diagram-toolbar input {
+ color: var(--text-panel);
+ border: 1px solid var(--br-secondary);
+}
+
+.search-results,
+.search-close {
+ color: var(--text-panel);
+}
+
+#exitViewBtn {
+ border: 1px solid var(--br-primary);
+}
+.ce-hidden,
+.prop-hidden,
+#exitViewBtn {
+ color: var(--text-panel);
+ background: var(--primary);
+}
+
+.ui-accordion-header {
+ color: var(--text-panel) !important;
+}
+
+.panelHeader:hover {
+ background-color: var(--bg-icons);
+}
+
+.panelHeader:after,
+.panelHeader:before {
+ background-color: var(--br-primary);
+ border: 1px solid var(--br-primary);
+}
+
+.ui-accordion .ui-accordion-content {
+ background-color: white;
+}
+
+.icon {
+ background-color: white;
+}
+
+.custom-tooltip-styling {
+ background-color: var(--bg-icons) !important;
+ color: var(--text-panel) !important;
+ border: 1px solid var(--br-primary);
+}
+
+.icon:hover {
+ background-color: var(--bg-icons);
+}
+
+.search-results::-webkit-scrollbar-thumb {
+ background-color: #585858;
+}
+
+.search-results::-webkit-scrollbar-thumb:hover {
+ background-color: var(--primary);
+}
+
+.timing-diagram-toolbar {
+ background-color: var(--bg-tabs);
+}
+
+#tabsBar {
+ background-color: var(--bg-tabs);
+ border-top: 1px solid var(--br-primary);
+ border-bottom: 1px solid var(--br-primary);
+}
+
+#tabsBar .circuits {
+ border: 1px solid var(--br-circuit);
+}
+
+#tabsBar .circuits {
+ color: var(--text-circuit);
+ background-color: var(--bg-tabs);
+}
+
+#tabsBar .current {
+ color: var(--text-circuit);
+ background-color: var(--bg-circuit);
+ border: 1px solid var(--br-circuit-cur);
+}
+
+#tabsBar .current > span {
+}
+
+#tabsBar button {
+ color: var(--text-panel);
+ background-color: var(--primary);
+ border: 1px solid var(--br-circuit-cur);
+}
+
+#tabsBar button:hover {
+ color: var(--text-panel);
+
+ border: 1px solid var(--br-circuit-cur);
+}
+
+.moduleProperty input,
+.moduleProperty textarea {
+ color: var(--text-panel);
+}
+
+.moduleProperty {
+ background: var(--primary);
+ border: 2px solid var(--br-primary);
+ box-shadow: 0px 0px 10px #4545457f;
+ color: var(--text-panel);
+}
+
+#moduleProperty-title {
+ color: var(--text-panel);
+}
+
+.moduleProperty input,
+.moduleProperty select,
+.moduleProperty textarea {
+ border: 1px solid var(--br-secondary) !important;
+ color: var(--text-panel);
+}
+
+.moduleProperty input:focus,
+.moduleProperty select:focus,
+.moduleProperty textarea:focus {
+ color: var(--text-panel);
+ border-color: var(--br-primary) !important;
+}
+
+.input-group div button {
+ color: var(--text-lite);
+}
+
+.input-group-prepend button:hover {
+ background: rgba(202, 202, 202, 0.5);
+}
+
+.input-group-append button:hover {
+ background: rgba(202, 202, 202, 0.5);
+}
+
+.slider {
+ background-color: #ccc;
+ box-shadow: inset 0px 0px 5px rgba(69, 69, 69, 0.255);
+}
+
+.slider:before {
+ background-color: white;
+ box-shadow: 0px 0px 7px rgba(69, 69, 69, 0.8);
+}
+
+input:checked + .slider {
+ background-color: var(--bg-toggle-btn-primary);
+}
+
+.custom-btn--primary {
+ background-color: var(--bg-toggle-btn-primary);
+ color: var(--text-lite);
+}
+.custom-btn--primary:hover {
+ background-color: var(--primary-btn-hov);
+ color: var(--text-lite);
+}
+.custom-btn--secondary {
+ border: 1px solid white;
+ color: var(--text-lite);
+}
+.custom-btn--secondary:hover {
+ background-color: #ddd;
+ color: var(--cus-btn-hov-text);
+}
+
+.custom-btn--secondary:active,
+.custom-btn--secondary:focus {
+ border: 1px solid white;
+}
+
+.custom-btn--tertiary {
+ background-color: var(--btn-danger);
+ color: var(--text-lite);
+}
+
+.custom-btn--tertiary:hover {
+ background-color: var(--btn-danger-darken);
+ color: var(--text-lite);
+}
+
+#HelpButton {
+ border: 2px solid var(--br-primary);
+ color: var(--text-panel);
+}
+
+select {
+ background: var(--bg-secondary);
+ background-color: var(--primary);
+ color: var(--text-lite);
+}
+
+#layoutDialog {
+ border: 2px solid var(--br-primary);
+ box-shadow: 0px 0px 10px #4545457f;
+ background-color: var(--primary);
+ color: var(--text-panel);
+}
+
+#layoutDialog > div span:before {
+ color: var(--text-panel);
+}
+
+.panel-heading {
+ color: var(--text-panel);
+}
+
+.ui-dialog {
+ border: 0.5px solid var(--br-primary) !important;
+ background: var(--bg-primary-moz) !important;
+}
+
+@supports (backdrop-filter: blur()) {
+ .ui-dialog {
+ background-color: var(--bg-primary-chr) !important;
+ }
+}
+
+.ui-widget-header {
+ color: var(--text-lite) !important;
+ border-bottom: 0.5px solid var(--br-primary);
+}
+
+.option {
+ background-color: white;
+ color: var(--cus-radio_label);
+}
+
+.custom-radio span {
+ border: 3px solid var(--cus-radio_label);
+}
+
+.custom-radio span:after {
+ background: var(--cus-radio_label);
+}
+
+#saveImageDialog {
+ border: 1px solid var(--br-secondary);
+}
+.download-dialog-section-2 {
+ color: var(--text-lite);
+}
+
+.download-dialog-section-2 .active-btn {
+ background: var(--bg-toggle-btn-primary);
+ color: var(--text-lite);
+}
+
+.download-dialog-section-2 .inactive-btn {
+ color: var(--text-lite);
+}
+
+.download-dialog-section-3 {
+ border: 1px solid var(--br-secondary);
+}
+
+.download-dialog-section-3 > span {
+ color: var(--text-lite);
+}
+
+.ui-dialog-titlebar-close::before:hover {
+ background-color: var(--primary);
+}
+
+.ui-dialog .ui-dialog-buttonpane button:hover {
+ color: var(--cus-btn-hov-text) !important;
+ background: var(--cus-btn-hov--bg);
+ border: 1px solid transparent;
+}
+
+.render-btn {
+ color: var(--text-lite);
+ border: 1px solid white;
+}
+
+.render-btn:active {
+ border: 1px solid var(--br-primary);
+}
+
+.render-btn:hover {
+ background: #3ba374;
+ color: var(--text-lite);
+ border: 1px solid transparent;
+}
+
+#combinationalAnalysis {
+ border: 1px solid var(--br-secondary);
+ color: var(--text-lite);
+}
+
+#combinationalAnalysis p input {
+ border-bottom: 1px solid white !important;
+ color: var(--text-lite);
+}
+
+.content-table tr th {
+ background-color: var(--primary);
+ color: var(--text-lite);
+}
+
+.content-table th,
+.content-table td {
+ background-color: #f3f3f3;
+}
+
+#openProjectDialog {
+ color: var(--text-lite);
+}
+
+#openProjectDialog > label {
+ border: 1px solid var(--br-primary);
+ color: var(--text-lite);
+}
+
+#openProjectDialog > label > span {
+ border: 3px solid white;
+}
+
+#openProjectDialog > label > span:after {
+ background: var(--text-lite);
+}
+
+#insertSubcircuitDialog {
+ color: var(--text-lite);
+}
+
+.disable::after {
+ background: var(--disable);
+}
+
+.radio-green {
+ background: #42b983;
+}
+
+.btn-group-toggle {
+ border: 1px solid var(--br-secondary) !important;
+}
+
+.set {
+ border: 2px solid cyan !important;
+}
+
+.theme {
+ color: var(--text-panel) !important;
+ background: var(--bg-icons) !important;
+ border-radius: 1.5px;
+}
+
+.input-group-prepend button:hover {
+ background: var(--bg-secondary) !important;
+ color: var(--text-lite) !important;
+}
+
+.input-group-append button:hover {
+ background: var(--bg-secondary) !important;
+ color: var(--text-lite) !important;
+}
+
+.input-group-prepend button {
+ color: var(--text-panel) !important;
+}
+
+.input-group-append button {
+ color: var(--text-panel) !important;
+}
+
+#Rectangle_1072 {
+ stroke: var(--text-panel);
+}
+
+#Path_36 {
+ fill: var(--text-panel);
+}
+
+.layout--btn-group {
+ display: block;
+ margin-right: 25px;
+ margin-top: -10px;
+}
+
+#clockProperty {
+ background: var(--primary);
+ border: 1px solid var(--br-primary);
+ color: var(--text-panel);
+}
diff --git a/v1/src/styles/css/0-helpers/_color-config.scss b/v1/src/styles/css/0-helpers/_color-config.scss
new file mode 100644
index 00000000..dfe909f0
--- /dev/null
+++ b/v1/src/styles/css/0-helpers/_color-config.scss
@@ -0,0 +1,22 @@
+//
+// Color configuration
+//
+
+$primary: $charcoal; //base color theme
+$input: $silver; //input border (mainly bottom)
+$text-primary: $white; //global font color
+$text-secondary: $silver; //placeholder text
+$sim-primary: $white; //simulator bg
+$sim-secondary: $very-light-grey; //simulator gridlines
+$dialog-primary: $primary; //dialog boxes bg color
+$dialog-secondary: $grey; //dialog boxes box border color
+$button-primary: $medium-sea-green; //btn primary
+$button-secondary: $roman; //delete button
+$error-primary: $carousel-pink; //error text color
+$box-shadow: $grey-shadow; //box shadow
+$border-primary: $white; //border color
+$border-secondary: $suva-grey; //dropdown border color
+$border-tertiary: $silver; //input box border
+$bg-primary--nav: $suva-grey; //nav-bar bg color
+$bg-secondary--nav: $primary; //active nav-bar menu bg color
+$bg-tertiary--nav: $gainsboro; //inactive nav-bar menu bg color
diff --git a/v1/src/styles/css/0-helpers/_functions.scss b/v1/src/styles/css/0-helpers/_functions.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/0-helpers/_mixins.scss b/v1/src/styles/css/0-helpers/_mixins.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/0-helpers/_variables.scss b/v1/src/styles/css/0-helpers/_variables.scss
new file mode 100644
index 00000000..93711734
--- /dev/null
+++ b/v1/src/styles/css/0-helpers/_variables.scss
@@ -0,0 +1,16 @@
+//
+// Color Variables
+//
+
+$charcoal: #454545;
+$silver: #bbbbbb;
+$gainsboro: #dddddd;
+$white: #ffffff;
+$grey: #7d7d7d;
+$very-light-grey: #cacaca;
+$suva-grey: #8b8b8b;
+$medium-sea-green: #42b983;
+$roman: #dc5656;
+$grey-shadow: #4545457f;
+$fire-brick: #ac3522;
+$carousel-pink: #f8d7da;
diff --git a/v1/src/styles/css/2-basics/_buttons.scss b/v1/src/styles/css/2-basics/_buttons.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/_close.scss b/v1/src/styles/css/2-basics/_close.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/_global.scss b/v1/src/styles/css/2-basics/_global.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/_links.scss b/v1/src/styles/css/2-basics/_links.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/_toggle.scss b/v1/src/styles/css/2-basics/_toggle.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/_typography.scss b/v1/src/styles/css/2-basics/_typography.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/2-basics/base.scss b/v1/src/styles/css/2-basics/base.scss
new file mode 100644
index 00000000..f7f722b9
--- /dev/null
+++ b/v1/src/styles/css/2-basics/base.scss
@@ -0,0 +1,11 @@
+/* base/default rule set here
+ no class or ID selectors
+*/
+
+html {
+ box-sizing: border-box;
+}
+
+* *:before *:after {
+ box-sizing: inherit;
+}
diff --git a/v1/src/styles/css/2-basics/reset.scss b/v1/src/styles/css/2-basics/reset.scss
new file mode 100644
index 00000000..ba934af9
--- /dev/null
+++ b/v1/src/styles/css/2-basics/reset.scss
@@ -0,0 +1,64 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+ v2.0 | 20110126
+ License: none (public domain)
+*/
+
+/* File modified - uncomment below */
+/*
+html, body, div, span, applet, object, iframe,
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+a, abbr, acronym, address, big, cite, code,
+del, dfn, em, img, ins, kbd, q, s, samp,
+small, strike, strong, sub, sup, tt, var,
+b, u, i, center,
+dl, dt, dd, ol, ul, li,
+fieldset, form, label, legend,
+table, caption, tbody, tfoot, thead, tr, th, td,
+article, aside, canvas, details, embed,
+figure, figcaption, footer, header, hgroup,
+menu, nav, output, ruby, section, summary,
+time, mark, audio, video {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ font-size: 100%;
+ font: inherit;
+ vertical-align: baseline;
+}
+*/
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+ display: block;
+}
+body {
+ line-height: 1;
+}
+ol,
+ul {
+ list-style: none;
+}
+blockquote,
+q {
+ quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+ content: '';
+ content: none;
+}
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
diff --git a/v1/src/styles/css/3-sub-components/_navigation.scss b/v1/src/styles/css/3-sub-components/_navigation.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/3-sub-components/_searchbar.scss b/v1/src/styles/css/3-sub-components/_searchbar.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/3-sub-components/_shortcut-menu.scss b/v1/src/styles/css/3-sub-components/_shortcut-menu.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/3-sub-components/_zoom-slider.scss b/v1/src/styles/css/3-sub-components/_zoom-slider.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_bool-logic-dialog.scss b/v1/src/styles/css/4-components/_bool-logic-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_canvas.scss b/v1/src/styles/css/4-components/_canvas.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_circuitelements.scss b/v1/src/styles/css/4-components/_circuitelements.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_context-menu.scss b/v1/src/styles/css/4-components/_context-menu.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_dropdown.scss b/v1/src/styles/css/4-components/_dropdown.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_header.scss b/v1/src/styles/css/4-components/_header.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_layout-dialog.scss b/v1/src/styles/css/4-components/_layout-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_navbar.scss b/v1/src/styles/css/4-components/_navbar.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_new-circuit-dialog.scss b/v1/src/styles/css/4-components/_new-circuit-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_properties.scss b/v1/src/styles/css/4-components/_properties.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_save-img-dialog.scss b/v1/src/styles/css/4-components/_save-img-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_shortcut-dialog.scss b/v1/src/styles/css/4-components/_shortcut-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/4-components/_tabs-bar.scss b/v1/src/styles/css/4-components/_tabs-bar.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/v1/src/styles/css/5-layout/simulator.scss b/v1/src/styles/css/5-layout/simulator.scss
new file mode 100644
index 00000000..89b84d4d
--- /dev/null
+++ b/v1/src/styles/css/5-layout/simulator.scss
@@ -0,0 +1,321 @@
+/* old ui ruleset starts here */
+.deleteOfflineProject {
+ float: right;
+ cursor: pointer;
+ padding: 2px;
+}
+
+.pointerCursor {
+ cursor: pointer;
+}
+
+.defaultCursor {
+ cursor: default;
+}
+
+#container {
+ display: table;
+ width: 100%;
+ height: 100%;
+}
+
+#container > div {
+ display: table-row;
+ height: 0;
+}
+
+#container > div.fill {
+ height: auto;
+}
+
+/* END OF MODULES */
+
+#restrictedDiv {
+ position: absolute;
+ top: 10px;
+ margin-left: 10px;
+ width: 560px;
+ z-index: 100;
+}
+
+#restrictedElementsDiv {
+ position: absolute;
+ top: 90px;
+ right: 10px;
+ z-index: 100;
+ width: 200px;
+}
+
+#MessageDiv {
+ position: absolute;
+ left: 30px;
+ bottom: 30px;
+ z-index: 110;
+}
+
+.errorMessage {
+ height: auto;
+ width: 100%;
+ padding: 2px;
+ margin: 2px;
+ border: 1px solid red;
+ border-radius: 3px;
+ background-color: #fee;
+ font-size: 15px;
+}
+
+.normalMessage {
+ height: auto;
+ width: 100%;
+ padding: 2px;
+ margin: 2px;
+ border: 1px solid green;
+ border-radius: 3px;
+ background-color: #99ff33;
+ font-size: 15px;
+}
+
+#canvasArea {
+ display: block;
+ position: relative;
+ width: 100%;
+ background-color: red;
+}
+
+.simulation {
+ position: relative;
+ width: auto;
+ height: 100%;
+ overflow: hidden;
+ background-color: 'white';
+}
+
+.left {
+ float: left;
+}
+
+.right {
+ float: right;
+}
+
+.objectPropertyAttributeChecked.btn {
+ width: 100%;
+ margin-bottom: 5px;
+}
+
+/* For loading screen - pace.js */
+
+.pace {
+ -webkit-pointer-events: none;
+ pointer-events: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ position: fixed;
+ width: 100vw;
+ height: 100vh;
+ background-color: #fff;
+ z-index: 100000;
+}
+
+.pace-inactive {
+ display: none;
+}
+
+#Help {
+ visibility: hidden;
+ /* Hidden by default. Visible on click */
+ min-width: 250px;
+ /* Set a default minimum width */
+ margin-left: -125px;
+ /* Divide value of min-width by 2 */
+ background-color: #333;
+ /* Black background color */
+ color: #fff;
+ /* White text color */
+ text-align: center;
+ /* Centered text */
+ border-radius: 2px;
+ /* Rounded borders */
+ padding: 16px;
+ /* Padding */
+ position: fixed;
+ /* Sit on top of the screen */
+ z-index: 1;
+ /* Add a z-index if needed */
+ right: 50px;
+ /* Center the snackbar */
+ bottom: 50px;
+ /* 30px from the bottom */
+ opacity: 0;
+}
+
+#Help.show {
+ visibility: visible;
+ /* Show the snackbar */
+ opacity: 1;
+ -webkit-transition-delay: 0.5s;
+ /* Safari */
+ transition-delay: 0.5s;
+ -webkit-transition-duration: 0.3s;
+ /* Safari */
+ transition-duration: 0.3s;
+}
+
+@-webkit-keyframes fadein {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+@keyframes fadein {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+@-webkit-keyframes fadeout {
+ from {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes fadeout {
+ from {
+ bottom: 0px;
+ opacity: 1;
+ }
+ to {
+ bottom: 0;
+ opacity: 0;
+ }
+}
+
+.pace .pace-progress {
+ background: #29d;
+ position: fixed;
+ z-index: 2000;
+ top: 0;
+ right: 100%;
+ width: 50%;
+ height: 5px;
+}
+
+/* LOADING ICON CSS STARTS*/
+
+.sk-folding-cube {
+ margin: 20px auto;
+ width: 40px;
+ height: 40px;
+ position: relative;
+ -webkit-transform: rotateZ(45deg);
+ transform: rotateZ(45deg);
+}
+
+.sk-folding-cube .sk-cube {
+ float: left;
+ width: 50%;
+ height: 50%;
+ position: relative;
+ -webkit-transform: scale(1.1);
+ -ms-transform: scale(1.1);
+ transform: scale(1.1);
+}
+
+.sk-folding-cube .sk-cube:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #09f;
+ -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
+ animation: sk-foldCubeAngle 2.4s infinite linear both;
+ -webkit-transform-origin: 100% 100%;
+ -ms-transform-origin: 100% 100%;
+ transform-origin: 100% 100%;
+}
+
+.sk-folding-cube .sk-cube2 {
+ -webkit-transform: scale(1.1) rotateZ(90deg);
+ transform: scale(1.1) rotateZ(90deg);
+}
+
+.sk-folding-cube .sk-cube3 {
+ -webkit-transform: scale(1.1) rotateZ(180deg);
+ transform: scale(1.1) rotateZ(180deg);
+}
+
+.sk-folding-cube .sk-cube4 {
+ -webkit-transform: scale(1.1) rotateZ(270deg);
+ transform: scale(1.1) rotateZ(270deg);
+}
+
+.sk-folding-cube .sk-cube2:before {
+ -webkit-animation-delay: 0.3s;
+ animation-delay: 0.3s;
+}
+
+.sk-folding-cube .sk-cube3:before {
+ -webkit-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+
+.sk-folding-cube .sk-cube4:before {
+ -webkit-animation-delay: 0.9s;
+ animation-delay: 0.9s;
+}
+
+@-webkit-keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+
+@keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+
+/* LOADING ICON CSS ENDS*/
diff --git a/v1/src/styles/css/UX.css b/v1/src/styles/css/UX.css
new file mode 100644
index 00000000..e5011d8a
--- /dev/null
+++ b/v1/src/styles/css/UX.css
@@ -0,0 +1,969 @@
+.deleteOfflineProject {
+ float: right;
+ cursor: pointer;
+ padding: 2px;
+}
+
+#contextMenu {
+ width: 150px;
+ visibility: hidden;
+ box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.2);
+ border: 1px solid rgba(0, 0, 0, 0.2);
+ position: fixed;
+ z-index: 100;
+ background: #fff;
+ opacity: 0;
+ top: 100;
+ left: 100;
+ cursor: pointer;
+ color: #000;
+ padding-bottom: 4px;
+ padding-top: 4px;
+ transition: opacity 0.2s ease-in-out;
+ user-select: none;
+}
+
+#contextMenu ul {
+ margin: 0;
+ padding: 0;
+ font: 16px sans-serif;
+}
+
+#contextMenu ul li {
+ list-style: none;
+ padding: 8px;
+ padding-left: 20px;
+}
+
+#contextMenu ul li a {
+ text-decoration: none;
+ color: #000 !important;
+}
+
+#contextMenu ul li:hover {
+ background: rgba(0, 0, 0, 0.1);
+}
+
+button:focus {
+ outline: 0;
+}
+
+.side {
+ height: 100%;
+ background-color: #333;
+ padding: 3px;
+ color: #fff;
+ border-side: 1px solid #0099ff;
+ border-bottom: 40px solid #0099ff;
+ padding: 0.5em;
+}
+
+.option {
+ display: block;
+ background-color: black;
+ border: 1px solid #005cb3;
+ color: #0099ff;
+ padding: 5px;
+ width: 200px;
+ margin: 3px;
+ word-wrap: break-word;
+ overflow-x: hidden;
+}
+
+.pannel-heading {
+ background-color: #f5f5f5;
+}
+
+#layoutDialog {
+ position: absolute;
+ right: 100px;
+ top: 100px;
+ z-index: 101;
+ width: 200px;
+ height: 230px;
+ border: 1px solid grey;
+ border-radius: 2px;
+ background-color: white;
+ overflow-x: hidden;
+}
+
+.projectName {
+ /*margin:3px;*/
+ color: #0099ff;
+ margin: 0 auto;
+ text-align: center;
+ font-size: 1.4em;
+ position: static;
+ left: 50%;
+ display: block;
+ width: 500px;
+ text-align: center;
+ margin-left: -250px;
+}
+
+.inline {
+ width: auto;
+ padding-right: 20px;
+ display: inline-block;
+}
+
+.option:hover {
+ border-color: #0099ff;
+}
+
+input[type='radio']:checked ~ label {
+ color: #0dff92;
+}
+
+.option input[type='radio'] {
+ margin-right: 5px;
+ /*position: absolute;*/
+ visibility: hidden;
+}
+
+.option input[type='radio']:checked {
+ /*position: absolute;*/
+ visibility: visible;
+}
+
+.zoomButton:focus {
+ outline: 0;
+}
+
+.zoomButton {
+ padding: 5px;
+ opacity: 0.3;
+}
+
+.zoomButton:hover {
+ /*height:20px;
+ width:20px;*/
+ opacity: 0.8;
+ transition: opacity 0.2s;
+}
+
+.ui-accordion-header-icon.ui-icon {
+ /*background-image: url("./ui-icons_white_256x240.png");*/
+}
+
+.noSelect {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -o-user-select: none;
+}
+
+.pointerCursor {
+ cursor: pointer;
+}
+
+.defaultCursor {
+ cursor: default;
+}
+
+#container {
+ display: table;
+ width: 100%;
+ height: 100%;
+}
+
+#container > div {
+ display: table-row;
+ height: 0;
+}
+
+#container > div.fill {
+ height: auto;
+}
+
+#modules-header {
+ margin-bottom: 0.5em;
+ font-size: 1.3em;
+ text-transform: uppercase;
+ font-family: Arial, Helvetica, sans-serif;
+ color: #0099ff;
+ text-align: center;
+ padding-top: 0.3em;
+}
+
+.panel {
+ padding: 0em;
+ background-color: #333;
+ margin: 0;
+ border-radius: 0;
+ margin-bottom: 0em;
+ border: 1px solid #0099ff;
+}
+
+.ui-accordion-header {
+ background-color: #333;
+ color: #fff;
+ border: 1px solid #0099ff;
+ border-radius: 0;
+ margin: 0em;
+ padding: 0em;
+ outline: none;
+}
+
+.ui-accordion-header.ui-accordion-header-active.ui-state-active {
+ background-color: #0099ff;
+ outline: none;
+ margin-bottom: 0;
+}
+
+.ui-accordion-header.ui-state-hover {
+ background-color: #0066cc;
+ outline: none;
+ /*margin-bottom: 0;*/
+}
+
+/* MODULES */
+
+.moduleProperty {
+ display: none;
+ background-color: #333;
+ color: #fff;
+ /*padding-bottom: 2em;*/
+ margin-top: 1em;
+}
+
+#moduleProperty-inner {
+ border: 1px solid #0099ff;
+ padding: 1em;
+ /*margin-bottom: 1em;*/
+}
+
+#moduleProperty-toolTip {
+ padding: 10px;
+ /*font-size: 1.1em;*/
+ color: #0099ff;
+}
+
+#moduleProperty-title {
+ text-transform: uppercase;
+ font-size: 1.3em;
+ color: #0099ff;
+ margin-bottom: 0.55em;
+ text-align: center;
+}
+
+#moduleProperty-header {
+ font-size: 1.1em;
+ text-transform: uppercase;
+ margin-bottom: 0.5em;
+}
+
+#moduleProperty-inner > p {
+ margin: 0;
+ margin-top: 0.2em;
+}
+
+input,
+select {
+ padding: 0.25rem;
+}
+
+.moduleProperty input,
+.moduleProperty select {
+ background-color: #333;
+ border: none;
+ border-bottom: 2px solid #ccc;
+}
+
+.moduleProperty input:active,
+.moduleProperty input:focus,
+.moduleProperty select:active,
+.moduleProperty select:focus {
+ border-bottom: 2px solid #0099ff;
+}
+
+.navbar.navbar-default {
+ margin: 0px;
+ border-radius: 0px;
+ border: 0;
+ padding: 0px;
+ min-height: 0px;
+ border-bottom: 1px solid #0099ff;
+}
+
+.navbar-brand {
+ padding: 7px 15px;
+ height: auto;
+}
+
+/* END OF MODULES */
+
+#tabsBar {
+ width: 100%;
+ /*height: 3em;*/
+ margin-left: 20px;
+ background-color: #000;
+}
+
+#tabsBar div {
+ display: inline-block;
+ /*padding-left: 0.5em;*/
+ margin: 0.1em;
+ color: #fff;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ position: relative;
+}
+
+#tabsBar .circuits {
+ color: #fff;
+ text-align: center;
+ background-color: #00284d;
+ padding-left: 0.5em;
+ padding-right: 1.5em;
+ border: 1px solid #005cb3;
+ border-radius: 0.1em;
+}
+
+#tabsBar .circuits:hover {
+ background-color: #00ace6;
+ /*border: 1px solid #0099ff;*/
+ transition-duration: 100ms;
+}
+
+#tabsBar .current {
+ /*background-color: #0086b3;*/
+ background-color: #004280;
+ border: 1px solid #0099ff;
+}
+
+.tabsCloseButton:hover {
+ color: #fff;
+ font-family: 'Gill Sans', sans-serif;
+ margin-left: 1em;
+ opacity: 0.5;
+}
+.tabsCloseButton {
+ color: #111;
+ font-family: 'Gill Sans', sans-serif;
+ margin-left: 1em;
+ opacity: 1;
+ position: absolute;
+ top: 5px;
+ right: 3;
+}
+
+th,
+td {
+ padding-left: 15px;
+ padding-right: 15px;
+ text-align: left;
+ border: 1px solid #0099ff;
+ color: white;
+}
+
+#booleanTable {
+ width: 200px;
+}
+
+table {
+ border-collapse: collapse;
+ -webkit-user-select: none;
+ /* Chrome/Safari */
+ -moz-user-select: none;
+ /* Firefox */
+ -ms-user-select: none;
+ /* IE10+ */
+ /* Rules below not implemented in browsers yet */
+ -o-user-select: none;
+ user-select: none;
+}
+
+body,
+html {
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+}
+
+#restrictedDiv {
+ position: absolute;
+ top: 10px;
+ margin-left: 10px;
+ width: 560px;
+ z-index: 100;
+}
+
+#restrictedElementsDiv {
+ position: absolute;
+ top: 90px;
+ right: 10px;
+ z-index: 100;
+ width: 200px;
+}
+
+#MessageDiv {
+ position: absolute;
+ margin-left: 30px;
+ bottom: 100px;
+ /*height:auto;*/
+ /*width:60%;*/
+ /*padding: 2px;*/
+ /*border: 3px solid red;*/
+ /*border-radius: 6px;*/
+ /*background-color: #fcc;*/
+ z-index: 10;
+}
+
+.errorMessage {
+ /*position: absolute;*/
+ /*margin-left: 30%;*/
+ /*bottom: 1px;*/
+ height: auto;
+ width: 100%;
+ /*margin-bottom: 10px;*/
+ padding: 2px;
+ margin: 2px;
+ border: 1px solid red;
+ border-radius: 3px;
+ background-color: #fee;
+ font-size: 15px;
+ /*z-index: 10;*/
+}
+
+.normalMessage {
+ /*position: absolute;*/
+ /*margin-left: 30%;*/
+ /*bottom: 150px;*/
+ height: auto;
+ width: 100%;
+ /*margin-bottom: 10px;*/
+ padding: 2px;
+ margin: 2px;
+ border: 1px solid green;
+ border-radius: 3px;
+ background-color: #99ff33;
+ font-size: 15px;
+ /*z-index: 10;*/
+}
+
+#canvasArea {
+ display: block;
+ position: relative;
+ /*height: 100%;*/
+ width: 100%;
+ background-color: red;
+}
+
+.simulation {
+ position: relative;
+ width: auto;
+ height: 100%;
+ overflow: hidden;
+ background-color: 'white';
+}
+
+.switch {
+ position: relative;
+ display: inline-block;
+ width: 43px;
+ height: 17px;
+ margin-bottom: 0px;
+}
+
+.switch input {
+ display: none;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 2;
+ left: 0;
+ right: 0;
+ bottom: -2;
+ background-color: #ccc;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+.slider:before {
+ position: absolute;
+ content: '';
+ height: 17px;
+ width: 17px;
+ left: 0px;
+ bottom: 0px;
+ background-color: white;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+input:checked + .slider {
+ background-color: #2196f3;
+}
+
+input:focus + .slider {
+ box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider:before {
+ -webkit-transform: translateX(26px);
+ -ms-transform: translateX(26px);
+ transform: translateX(26px);
+}
+
+/* Rounded sliders */
+
+.slider.round {
+ border-radius: 34px;
+}
+
+.slider.round:before {
+ border-radius: 50%;
+}
+
+/* Slider for white background */
+.slider2 {
+ position: absolute;
+ cursor: pointer;
+ top: 2;
+ left: 0;
+ right: 0;
+ bottom: -2;
+ /* border: 1px solid black; */
+ background-color: #ccc;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+.slider2:before {
+ position: absolute;
+ content: '';
+ height: 17px;
+ width: 17px;
+ left: 0px;
+ bottom: 0px;
+ background-color: #aaa;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+input:checked + .slider2 {
+ background-color: #2196f3;
+}
+
+input:focus + .slider2 {
+ box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider2:before {
+ -webkit-transform: translateX(26px);
+ -ms-transform: translateX(26px);
+ transform: translateX(26px);
+}
+
+/* Rounded sliders */
+
+.slider2.round {
+ border-radius: 34px;
+}
+
+.slider2.round:before {
+ border-radius: 50%;
+}
+
+#miniMap {
+ position: fixed;
+ z-index: 2;
+ bottom: 20px;
+ right: 40px;
+ /*height:150px;
+ width: 25%;*/
+ overflow-y: scroll;
+ background-color: black;
+ /*border:1px solid #aaa;*/
+ opacity: 0.97;
+ box-shadow: 0px 0px 15px #888888;
+ overflow: hidden;
+ /*transition: opacity .25s ease-in-out;*/
+}
+
+#plot {
+ position: fixed;
+ z-index: 1;
+ bottom: 0;
+ right: 0;
+ /*display: block;*/
+ /*height: 0px;*/
+ /*width: 100%;*/
+ overflow-y: scroll;
+ background-color: #eee;
+ /*background-blend-mode: color;*/
+}
+
+.left {
+ float: left;
+}
+
+.right {
+ float: right;
+}
+
+.icon {
+ position: relative;
+ height: 70px;
+ width: 70px;
+ /*margin: 1px;*/
+ margin-bottom: 5px;
+ margin-left: 3px;
+ display: inline-block;
+ background-color: white;
+ border-radius: 4px;
+ /*border-color: #0099ff;*/
+ border: 2px solid #0099ff;
+ text-align: center;
+ font-size: 8px;
+ padding: 5px;
+}
+
+img {
+ display: none;
+}
+
+div.icon img {
+ -webkit-user-drag: none;
+ -khtml-user-drag: none;
+ -moz-user-drag: none;
+ -o-user-drag: none;
+ user-drag: none;
+ /*margin: auto;*/
+ width: 100%;
+ /*height:100%;*/
+ display: inline-block;
+}
+
+.img__description {
+ position: absolute;
+ /*top: 0;*/
+ bottom: -16;
+ text-align: center;
+ left: 0;
+ right: 0;
+ background-color: #0099ff;
+ color: white;
+ font-size: 8px;
+ /*background: rgba(29, 106, 154, 0.72);
+ color: #fff;*/
+ visibility: hidden;
+ border-bottom-left-radius: 2px;
+ border-bottom-right-radius: 2px;
+ opacity: 0;
+ /* transition effect. not necessary */
+ transition: opacity 0.2s, visibility 0.2s;
+}
+
+.icon:hover .img__description {
+ visibility: visible;
+ opacity: 1;
+}
+
+.icon:hover {
+ /*background-color: #cce5ff;*/
+ /*border-color: blue;*/
+ margin-bottom: 1px;
+ height: 74px;
+ background-color: #f5f5f5;
+ transition: height 0.2s margin 0.2s;
+}
+
+.objectPropertyAttributeChecked.btn {
+ width: 100%;
+ margin-bottom: 5px;
+}
+
+/* For loading screen - pace.js */
+
+.pace {
+ -webkit-pointer-events: none;
+ pointer-events: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ width: 100%;
+ height: 100%;
+ background-color: #fff;
+}
+
+.pace-inactive {
+ display: none;
+}
+
+#Help {
+ visibility: hidden;
+ /* Hidden by default. Visible on click */
+ min-width: 250px;
+ /* Set a default minimum width */
+ margin-left: -125px;
+ /* Divide value of min-width by 2 */
+ background-color: #333;
+ /* Black background color */
+ color: #fff;
+ /* White text color */
+ text-align: center;
+ /* Centered text */
+ border-radius: 2px;
+ /* Rounded borders */
+ padding: 16px;
+ /* Padding */
+ position: fixed;
+ /* Sit on top of the screen */
+ z-index: 1;
+ /* Add a z-index if needed */
+ right: 50px;
+ /* Center the snackbar */
+ bottom: 50px;
+ /* 30px from the bottom */
+ opacity: 0;
+}
+
+#Help.show {
+ visibility: visible;
+ /* Show the snackbar */
+ opacity: 1;
+ -webkit-transition-delay: 0.5s;
+ /* Safari */
+ transition-delay: 0.5s;
+ -webkit-transition-duration: 0.3s;
+ /* Safari */
+ transition-duration: 0.3s;
+}
+
+/* Animations to fade the snackbar in and out */
+
+@-webkit-keyframes fadein {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+@keyframes fadein {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+@-webkit-keyframes fadeout {
+ from {
+ opacity: 1;
+ }
+ to {
+ opacity: 0;
+ }
+}
+
+@keyframes fadeout {
+ from {
+ bottom: 0px;
+ opacity: 1;
+ }
+ to {
+ bottom: 0;
+ opacity: 0;
+ }
+}
+
+.pace .pace-progress {
+ background: #29d;
+ position: fixed;
+ z-index: 2000;
+ top: 0;
+ right: 100%;
+ width: 50%;
+ height: 5px;
+}
+
+/* dropdown-menu styles */
+
+.dropdown-menu {
+ background-color: black;
+ border: 1px solid #09f;
+ border-top: none;
+}
+
+.navbar-nav > li > a {
+ padding: 7px 15px;
+}
+
+.dropdown-menu > li > a {
+ color: #939393 !important;
+ padding: 3px 14px;
+}
+
+.dropdown-menu > li > a:hover {
+ color: #4db8ff !important;
+ background-color: black;
+}
+
+.ui-dialog {
+ background: #222;
+}
+
+.ui-dialog p {
+ color: #9d9d9d;
+}
+
+.ui-widget-header {
+ border: 1px solid #0099ff;
+ color: #0099ff;
+}
+
+.ui-dialog-buttonpane {
+ background-color: black;
+}
+
+.ui-dialog-titlebar {
+ background-color: black;
+}
+
+.ui-dialog-titlebar-close {
+ background-image: url('../img/cross.png');
+ position: absolute;
+ right: 0.3em;
+ top: 50%;
+ width: 21px;
+ margin: -10px 0 0 0;
+ padding: 1px;
+ height: 20px;
+}
+
+.ui-icon-close {
+ background-position: -80px -128px;
+}
+
+.ui-dialog .ui-dialog-buttonpane button {
+ background-color: #004280;
+ border: 1px solid #09f;
+ color: white;
+}
+
+.navbar .nav.pull-right {
+ float: right;
+ margin-right: 10px;
+ /*set margin this way in your custom stylesheet*/
+}
+
+/* LOADING ICON CSS STARTS*/
+
+.sk-folding-cube {
+ margin: 20px auto;
+ width: 40px;
+ height: 40px;
+ position: relative;
+ -webkit-transform: rotateZ(45deg);
+ transform: rotateZ(45deg);
+}
+
+.sk-folding-cube .sk-cube {
+ float: left;
+ width: 50%;
+ height: 50%;
+ position: relative;
+ -webkit-transform: scale(1.1);
+ -ms-transform: scale(1.1);
+ transform: scale(1.1);
+}
+
+.sk-folding-cube .sk-cube:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #09f;
+ -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
+ animation: sk-foldCubeAngle 2.4s infinite linear both;
+ -webkit-transform-origin: 100% 100%;
+ -ms-transform-origin: 100% 100%;
+ transform-origin: 100% 100%;
+}
+
+.sk-folding-cube .sk-cube2 {
+ -webkit-transform: scale(1.1) rotateZ(90deg);
+ transform: scale(1.1) rotateZ(90deg);
+}
+
+.sk-folding-cube .sk-cube3 {
+ -webkit-transform: scale(1.1) rotateZ(180deg);
+ transform: scale(1.1) rotateZ(180deg);
+}
+
+.sk-folding-cube .sk-cube4 {
+ -webkit-transform: scale(1.1) rotateZ(270deg);
+ transform: scale(1.1) rotateZ(270deg);
+}
+
+.sk-folding-cube .sk-cube2:before {
+ -webkit-animation-delay: 0.3s;
+ animation-delay: 0.3s;
+}
+
+.sk-folding-cube .sk-cube3:before {
+ -webkit-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+
+.sk-folding-cube .sk-cube4:before {
+ -webkit-animation-delay: 0.9s;
+ animation-delay: 0.9s;
+}
+
+@-webkit-keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+
+@keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+
+/* LOADING ICON CSS ENDS*/
diff --git a/v1/src/styles/css/assets/layout-panel/down.svg b/v1/src/styles/css/assets/layout-panel/down.svg
new file mode 100644
index 00000000..d8e8d105
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/down.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/layout-panel/left.svg b/v1/src/styles/css/assets/layout-panel/left.svg
new file mode 100644
index 00000000..f73a40ff
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/left.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/layout-panel/minus.svg b/v1/src/styles/css/assets/layout-panel/minus.svg
new file mode 100644
index 00000000..b26d17f4
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/minus.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/layout-panel/plus.svg b/v1/src/styles/css/assets/layout-panel/plus.svg
new file mode 100644
index 00000000..364e696d
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/plus.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/layout-panel/right.svg b/v1/src/styles/css/assets/layout-panel/right.svg
new file mode 100644
index 00000000..bef89def
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/right.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/layout-panel/up.svg b/v1/src/styles/css/assets/layout-panel/up.svg
new file mode 100644
index 00000000..7c014709
--- /dev/null
+++ b/v1/src/styles/css/assets/layout-panel/up.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/logo.svg b/v1/src/styles/css/assets/logo.svg
new file mode 100644
index 00000000..ffae4558
--- /dev/null
+++ b/v1/src/styles/css/assets/logo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/delete.svg b/v1/src/styles/css/assets/shorcuts/delete.svg
new file mode 100644
index 00000000..3611bbac
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/delete.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/download.svg b/v1/src/styles/css/assets/shorcuts/download.svg
new file mode 100644
index 00000000..9dc67f1e
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/download.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/dragDots.svg b/v1/src/styles/css/assets/shorcuts/dragDots.svg
new file mode 100644
index 00000000..dacde439
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/dragDots.svg
@@ -0,0 +1,86 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/fit.svg b/v1/src/styles/css/assets/shorcuts/fit.svg
new file mode 100644
index 00000000..4cc765e2
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/fit.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/new.svg b/v1/src/styles/css/assets/shorcuts/new.svg
new file mode 100644
index 00000000..bc1bb3bd
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/new.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/redo.svg b/v1/src/styles/css/assets/shorcuts/redo.svg
new file mode 100644
index 00000000..30e00a4c
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/redo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/save-online.svg b/v1/src/styles/css/assets/shorcuts/save-online.svg
new file mode 100644
index 00000000..bb414b9a
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/save-online.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/save.svg b/v1/src/styles/css/assets/shorcuts/save.svg
new file mode 100644
index 00000000..9e3c8da5
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/save.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/shorcuts/undo.svg b/v1/src/styles/css/assets/shorcuts/undo.svg
new file mode 100644
index 00000000..c82d8b64
--- /dev/null
+++ b/v1/src/styles/css/assets/shorcuts/undo.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/small-components/chevron-down.svg b/v1/src/styles/css/assets/small-components/chevron-down.svg
new file mode 100644
index 00000000..e4c8404d
--- /dev/null
+++ b/v1/src/styles/css/assets/small-components/chevron-down.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/assets/small-components/close.svg b/v1/src/styles/css/assets/small-components/close.svg
new file mode 100644
index 00000000..8dc79fa4
--- /dev/null
+++ b/v1/src/styles/css/assets/small-components/close.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/v1/src/styles/css/custom_mailer.css b/v1/src/styles/css/custom_mailer.css
new file mode 100644
index 00000000..3284a610
--- /dev/null
+++ b/v1/src/styles/css/custom_mailer.css
@@ -0,0 +1,6 @@
+.navbar,
+.navbar-search-active,
+.footer-empty-div,
+.footer-container-fluid {
+ display: none;
+}
diff --git a/v1/src/styles/css/embed.css b/v1/src/styles/css/embed.css
new file mode 100644
index 00000000..ed09eb73
--- /dev/null
+++ b/v1/src/styles/css/embed.css
@@ -0,0 +1,261 @@
+.switch {
+ position: relative;
+ display: inline-block;
+ width: 43px;
+ height: 17px;
+ margin-bottom: 0px;
+}
+
+.switch input {
+ display: none;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 2;
+ left: 0;
+ right: 0;
+ bottom: -2;
+ background-color: #ccc;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+.slider:before {
+ position: absolute;
+ content: '';
+ height: 17px;
+ width: 17px;
+ left: 0px;
+ bottom: 0px;
+ background-color: white;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+
+#clockProperty {
+ padding: 10px;
+}
+
+#clockPropertyHeader {
+ border-radius: 3px;
+}
+#clockProperty {
+ padding: 10px;
+ border-radius: 6px;
+ opacity: 0.1;
+ transition: 0.4s;
+ height: 109px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+}
+#clockProperty:hover {
+ opacity: 1;
+ -webkit-transition: 0.4s;
+ transition: 0.4s;
+}
+input:checked + .slider {
+ /* background-color: #2196F3; */
+}
+
+input:focus + .slider {
+ box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider:before {
+ -webkit-transform: translateX(26px);
+ -ms-transform: translateX(26px);
+ transform: translateX(26px);
+}
+
+#tabsBar .circuits {
+ color: #000;
+ text-align: center;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+ border: 1px solid #111;
+ display: inline-block;
+}
+button:focus {
+ outline: 0;
+}
+#tabsBar .circuits:hover {
+ background-color: lightgray;
+ /*border: 1px solid #0099ff;*/
+ transition-duration: 100ms;
+}
+#tabsBar .current {
+ transition-duration: 100ms;
+}
+
+.noSelect {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -o-user-select: none;
+}
+.pointerCursor {
+ cursor: pointer;
+}
+.defaultCursor {
+ cursor: default;
+}
+.simulation {
+ position: relative;
+ width: auto;
+ height: 100%;
+ overflow: hidden;
+ background-color: 'white';
+}
+
+#elementName {
+ position: absolute;
+ left: 6px;
+ bottom: 6px;
+ background-color: white;
+ z-index: 101;
+ color: black;
+ padding: 1px;
+ border: 0.5px solid black;
+ display: none;
+}
+
+/* LOADING ICON CSS STARTS*/
+.sk-folding-cube {
+ margin: 20px auto;
+ width: 40px;
+ height: 40px;
+ position: relative;
+ -webkit-transform: rotateZ(45deg);
+ transform: rotateZ(45deg);
+}
+
+.sk-folding-cube .sk-cube {
+ float: left;
+ width: 50%;
+ height: 50%;
+ position: relative;
+ -webkit-transform: scale(1.1);
+ -ms-transform: scale(1.1);
+ transform: scale(1.1);
+}
+.sk-folding-cube .sk-cube:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: #09f;
+ -webkit-animation: sk-foldCubeAngle 2.4s infinite linear both;
+ animation: sk-foldCubeAngle 2.4s infinite linear both;
+ -webkit-transform-origin: 100% 100%;
+ -ms-transform-origin: 100% 100%;
+ transform-origin: 100% 100%;
+}
+.sk-folding-cube .sk-cube2 {
+ -webkit-transform: scale(1.1) rotateZ(90deg);
+ transform: scale(1.1) rotateZ(90deg);
+}
+.sk-folding-cube .sk-cube3 {
+ -webkit-transform: scale(1.1) rotateZ(180deg);
+ transform: scale(1.1) rotateZ(180deg);
+}
+.sk-folding-cube .sk-cube4 {
+ -webkit-transform: scale(1.1) rotateZ(270deg);
+ transform: scale(1.1) rotateZ(270deg);
+}
+.sk-folding-cube .sk-cube2:before {
+ -webkit-animation-delay: 0.3s;
+ animation-delay: 0.3s;
+}
+.sk-folding-cube .sk-cube3:before {
+ -webkit-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+.sk-folding-cube .sk-cube4:before {
+ -webkit-animation-delay: 0.9s;
+ animation-delay: 0.9s;
+}
+@-webkit-keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+
+@keyframes sk-foldCubeAngle {
+ 0%,
+ 10% {
+ -webkit-transform: perspective(140px) rotateX(-180deg);
+ transform: perspective(140px) rotateX(-180deg);
+ opacity: 0;
+ }
+ 25%,
+ 75% {
+ -webkit-transform: perspective(140px) rotateX(0deg);
+ transform: perspective(140px) rotateX(0deg);
+ opacity: 1;
+ }
+ 90%,
+ 100% {
+ -webkit-transform: perspective(140px) rotateY(180deg);
+ transform: perspective(140px) rotateY(180deg);
+ opacity: 0;
+ }
+}
+/* LOADING ICON CSS ENDS*/
+
+#restrictedElementsDiv {
+ position: absolute;
+ bottom: 10;
+ right: 2;
+ z-index: 100;
+ width: 215px;
+ font-size: 14px;
+ background-color: gainsboro;
+ border: 1px solid #0d3349;
+ opacity: 0.1;
+ padding: 3px 5px;
+}
+
+#restrictedElementsDiv:hover {
+ opacity: 1;
+ transition: 0.4s;
+}
+
+.zoom-wrapper {
+ position: absolute;
+ bottom: 1px;
+ right: 0px;
+ font-size: 10px;
+ z-index: 100;
+}
+
+.zoom-wrapper button {
+ opacity: 0.3;
+}
+.zoom-wrapper button:hover {
+ opacity: 1;
+}
+
+.embed-fullscreen-btn {
+ border-radius: 20px;
+}
diff --git a/v1/src/styles/css/error.css b/v1/src/styles/css/error.css
new file mode 100644
index 00000000..cf03badb
--- /dev/null
+++ b/v1/src/styles/css/error.css
@@ -0,0 +1,24 @@
+.error-code {
+ color: #42b983;
+ font-family: 'CircuitBoredNF';
+ font-size: 142px;
+}
+
+.help-text-main {
+ color: #1c1c1c;
+ font-family: 'Segoe UI';
+ font-size: 22px;
+ font-weight: 400;
+ margin: 0;
+}
+
+.return {
+ color: #42b983;
+ display: inline-block;
+ font-family: 'Segoe UI';
+ font-weight: 700;
+}
+
+.return:hover {
+ color: #42b983;
+}
diff --git a/v1/src/styles/css/main.stylesheet.css b/v1/src/styles/css/main.stylesheet.css
new file mode 100644
index 00000000..b487179b
--- /dev/null
+++ b/v1/src/styles/css/main.stylesheet.css
@@ -0,0 +1,1956 @@
+/*
+************
+* This stylesheet is to be made modular later
+************
+*/
+
+@import './5-layout/simulator.scss';
+@import './2-basics/base.scss';
+@import './2-basics/reset.scss';
+@import './shortcut.panel.css';
+@import './embed.css';
+@import './plugin-stylesheets/checkBo.min.css';
+/** new UI ruleset starts here */
+/*! Adding color variables to root, required later for hokey binding */
+
+/* typography */
+@font-face {
+ font-family: Raleway;
+ src: url('https://fonts.gstatic.com/s/raleway/v18/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVvaorCIPrcVIT9d0c8.woff');
+}
+
+/* typography */
+@font-face {
+ font-family: 'Nunito', sans-serif;
+ src: url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;1,200&display=swap');
+}
+
+/** Global Styles starts here */
+
+body {
+ line-height: 1 !important;
+}
+
+body,
+html {
+ font-family: 'Nunito', sans-serif;
+ font-weight: 200;
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+ position: fixed;
+}
+
+button:focus {
+ outline: 0;
+}
+
+a {
+ color: var(--text-primary);
+}
+
+a:hover {
+ color: white;
+ text-decoration: none;
+}
+
+select > option {
+ color: black;
+ padding: 2px 4px;
+ margin-right: 5px;
+}
+
+select:focus,
+select > option:focus {
+ border: none;
+ outline: none;
+}
+
+input[type='number']:focus {
+ background-color: transparent;
+ outline: none;
+ border: none;
+ color: white;
+}
+
+table {
+ border-collapse: collapse;
+ -webkit-user-select: none;
+ /* Chrome/Safari */
+ -moz-user-select: none;
+ /* Firefox */
+ -ms-user-select: none;
+ /* IE10+ */
+ /* Rules below not implemented in browsers yet */
+ -o-user-select: none;
+ user-select: none;
+}
+
+button {
+ background: none;
+ color: inherit;
+ border: none;
+ padding: 0;
+ font: inherit;
+ cursor: pointer;
+ outline: inherit;
+ box-shadow: none;
+}
+
+button:not('.quick-btn button'):active {
+ background: transparent !important;
+}
+
+button:active,
+button:focus {
+ box-shadow: none !important;
+ border: none;
+ outline: none;
+ /* border-color: white !important; */
+}
+
+button:focus {
+ box-shadow: none;
+}
+
+input[type='text']:focus {
+ background: transparent;
+ /* color: white; */
+}
+
+/*! Global styles ends here */
+
+.noSelect {
+ -moz-user-select: none;
+ -webkit-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ -o-user-select: none;
+}
+
+.navbar-menu {
+ position: relative;
+ transition: all 0.2s ease-in-out;
+}
+
+.navbar-menu > li > a {
+ border: 1px solid transparent;
+ border-radius: 1px;
+ padding: 2px 8px;
+ transition: all 0.2s ease-in-out;
+ margin-right: 10px;
+}
+
+.navbar-menu > li > a span,
+.acc-caret {
+ content: '';
+ background: url(./assets/small-components/chevron-down.svg) center/cover
+ no-repeat;
+ display: inline-block;
+ height: 5px;
+ width: 5px;
+ position: absolute;
+ right: 0;
+ top: 50%;
+ transform: translateY(-66%);
+ padding: 4px;
+ margin: 0 5px;
+ transition: all 0.2s ease-in-out;
+}
+
+.acc-caret {
+ right: -17px;
+}
+.navbar-menu > li > a:hover {
+ border-bottom: 1px solid white;
+ text-decoration: none;
+}
+
+.navbar-menu > li > a:hover span,
+.acc-drop:hover .acc-caret {
+ background: none;
+}
+
+.projectName {
+ position: relative;
+ left: 0.5rem;
+ font-size: 1em;
+ text-align: center;
+ display: inline-block;
+ width: 35vw;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+@media (max-width: 991px) {
+ .projectName {
+ visibility: hidden;
+ }
+}
+
+.account-btn {
+ position: absolute;
+ right: 13px;
+ padding: 4px 10px;
+ border: 1px solid transparent;
+ border-radius: 1px;
+ transition: all 0.2s ease-in-out;
+}
+
+.account-btn:hover {
+ border-bottom: 1px solid white;
+ text-decoration: none;
+}
+
+.user-field {
+ display: inline-block;
+ max-width: 11rem;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ text-align: right;
+}
+
+@media (max-width: 991px) {
+ .user-field {
+ visibility: hidden;
+ }
+}
+
+.signIn-btn {
+ color: var(--text-primary);
+}
+
+.cur-user,
+.signIn-btn {
+ color: #fff;
+}
+
+.signIn-btn:hover {
+ color: var(--text-primary);
+ text-decoration: none;
+}
+
+.logo {
+ background: url(./assets/logo.svg) center/cover;
+ height: 30px;
+ width: 105px;
+ display: inline-block;
+ margin-right: 36px;
+}
+
+/* dropdown-menu styles */
+
+.dropdown > ul {
+ border-radius: 5px;
+ text-align: center;
+ position: absolute;
+ left: 50%;
+ transform: translate(-50%, 13px);
+}
+
+.draggable-panel-css {
+ border-radius: 5px;
+ z-index: 70;
+ transition: background 0.5s ease-out;
+ position: fixed;
+}
+
+@supports (backdrop-filter: blur()) {
+ .dropdown > ul {
+ backdrop-filter: blur(5px);
+ }
+}
+
+.mw-override {
+ min-width: 110px;
+}
+
+.dropdown > ul::before {
+ background-color: transparent;
+ content: '';
+ width: 10px;
+ display: inline-block;
+ height: 10px;
+ position: absolute;
+ transform: translate(-50%, -13px) rotate(-45deg);
+}
+
+.dropdown > ul::after {
+ content: '';
+ width: 11.5px;
+ display: inline-block;
+ height: 10px;
+ position: absolute;
+ transform: translate(-50%, -15.5px);
+ top: 14.5px;
+}
+
+.dropdown-menu > li > a {
+ padding: 7px 0;
+ width: 90%;
+ margin: auto;
+ transition: all 0.2s ease-in-out;
+ text-align: left;
+ padding-left: 10px;
+}
+
+.dropdown-menu > li > a:hover {
+ border-radius: 7px;
+ opacity: 1;
+}
+
+@media (max-width: 991px) {
+ .navbar-nav .dropdown-menu {
+ position: absolute !important;
+ float: none;
+ }
+}
+
+#contextMenu {
+ width: 150px;
+ visibility: hidden;
+ position: fixed;
+ z-index: 1000;
+ opacity: 0;
+ top: 100;
+ left: 100;
+ cursor: pointer;
+ padding-bottom: 7px;
+ padding-top: 7px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ border-radius: 5px;
+}
+
+#contextMenu ul {
+ margin: 0;
+ padding: 0;
+}
+
+#contextMenu ul li {
+ list-style: none;
+ padding: 8px;
+ padding-left: 20px;
+ width: 90%;
+ margin: auto;
+}
+
+#contextMenu ul li:hover {
+ border-radius: 7px;
+ opacity: 1;
+}
+
+@supports (backdrop-filter: blur()) {
+ #contextMenu {
+ backdrop-filter: blur(5px);
+ }
+ #contextMenu ul li:hover {
+ backdrop-filter: blur(50px);
+ -webkit-backdrop-filter: blur(50px);
+ }
+}
+
+/** ce-panel styling starts */
+
+.ce-panel {
+ font: inherit;
+ width: 240px;
+ top: 90px;
+ left: 10px;
+}
+
+.accordion > :last-child {
+ margin-bottom: 15px;
+}
+
+.draggable-panel-css .panel-header {
+ border-radius: 5px;
+ border-top-right-radius: 5px;
+ padding-top: 15px;
+ padding: 10px;
+ padding-top: 15px;
+ padding-left: 17px;
+ font-weight: bold;
+ font-size: 16px;
+ text-transform: uppercase;
+ text-align: left;
+ cursor: move;
+}
+
+.draggable-panel-css .panel-header::before {
+ content: '';
+ width: 34px;
+ border-radius: 2px;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 6px;
+}
+
+.draggable-panel-css .panel-body {
+ padding-top: 10px;
+}
+
+.draggable-panel-css .panel {
+ padding: 0em;
+ margin: 0;
+ border-radius: 0;
+ margin-bottom: 0em;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ max-height: 185px;
+ border-radius: 2px;
+ overflow: auto;
+}
+
+.ui-accordion-header {
+ background-color: transparent;
+ margin: 0em;
+ padding: 0em;
+ outline: none;
+}
+
+.ui-accordion-header.ui-accordion-header-active.ui-state-active {
+ outline: none;
+}
+
+.ui-accordion-header.ui-state-hover {
+ outline: none;
+}
+
+.ui-accordion-header-icon.ui-icon {
+ display: none;
+}
+
+.accordion {
+ width: 90%;
+ margin: auto;
+ position: relative;
+}
+
+/* expansion panel styles - start */
+.v-expansion-panel {
+ background-color: transparent;
+ color: var(--text-panel);
+}
+.v-expansion-panel--active > .v-expansion-panel-title {
+ min-height: 48px;
+}
+.v-expansion-panel-title__overlay {
+ border-radius: 3px;
+ outline: none;
+ background-color: #ededed;
+ font-weight: 400;
+}
+
+.v-expansion-panel__shadow {
+ box-shadow: none;
+}
+
+.v-expansion-panel-title {
+ cursor: pointer;
+ position: relative;
+ margin: 2px 0 0;
+ padding: 0 0.5em 0 0.7em;
+ font-size: 100%;
+ font-weight: 400;
+ line-height: 1.3;
+}
+
+.v-expansion-panel-text {
+ background-color: var(--text-panel);
+ color: black;
+}
+.v-expansion-panel-text__wrapper {
+ padding: 0;
+}
+/* expansion panel styles - ends */
+
+.panelHeader {
+ border: none;
+ border-radius: 0;
+ transition: all 0.2s ease-in-out;
+}
+
+.panelHeader:hover {
+ border-radius: 3px;
+}
+
+.panelHeader:after,
+.panelHeader:before {
+ content: '';
+ height: 8px;
+ display: inline-block;
+ right: 15px;
+ position: absolute;
+ border-radius: 5px;
+ top: 50%;
+ transform: translateY(-50%) rotate(132deg);
+ transition: 0.2s ease-out;
+ background-color: white;
+}
+
+.panelHeader:after {
+ transform: translate(260%, -50%) rotate(226deg);
+}
+
+.ui-accordion-header-active:before {
+ transition: 0.2s ease-out;
+ transform-origin: left;
+ transform: translate(29%, -40%) rotate(50deg);
+ top: 46%;
+}
+
+.ui-accordion-header-active:after {
+ transform-origin: bottom;
+ transform: translate(420%, -50%) rotate(310deg);
+ transition: 0.2s ease-out;
+ top: 46%;
+}
+
+.ui-accordion-header-active:hover {
+ background-color: transparent;
+}
+
+.ui-accordion .ui-accordion-content {
+ border: none;
+ padding: 0;
+}
+
+.icon {
+ position: relative;
+ width: 50px;
+ margin: 5px;
+ display: inline-block;
+ text-align: center;
+ font-size: 8px;
+}
+
+img {
+ display: none;
+}
+
+div.icon img {
+ -webkit-user-drag: none;
+ -khtml-user-drag: none;
+ -moz-user-drag: none;
+ -o-user-drag: none;
+ width: 100%;
+ display: inline-block;
+}
+
+.custom-tooltip-styling {
+ box-shadow: none;
+ border-radius: 3px;
+ font: inherit;
+ font-size: 14px;
+ font-weight: 100;
+}
+
+.icon:hover {
+ border-radius: 3px;
+}
+
+/*! ce-panel styling ends */
+
+/** custom scroll styling starts here */
+
+.search-results {
+ scrollbar-width: thin; /* for firefox */
+}
+
+.search-results::-webkit-scrollbar {
+ margin-right: 3px;
+ width: 6px;
+}
+
+/*! custom scroll styling starts ends here */
+
+/*! ce-panel styling ends */
+
+/** tab bar styling starts */
+
+#tabsBar {
+ width: 100%;
+ /* height: 23.5px; */
+ display: block;
+ align-items: center;
+ z-index: 99;
+ /* position: absolute;
+ top: 47px; */
+}
+
+.embed-tabs {
+ background-color: transparent !important;
+}
+
+#tabsBar .placeholder {
+ justify-content: space-between;
+ padding: 1px;
+ display: inline-block;
+ margin: 2px;
+ text-align: center;
+ /* min-width: 110px; */
+ font-size: 14px;
+ transition: all 0.2s ease-in-out;
+}
+
+.placeholder::before {
+ display: inline-block;
+ padding: 2px 5px;
+ content: '|';
+}
+
+#tabsBar .circuits {
+ justify-content: space-between;
+ border-radius: 3px;
+ padding: 1px;
+ display: inline-flex;
+ align-items: center;
+ margin: 2px;
+ text-align: center;
+ /* min-width: 110px; */
+ font-size: 14px;
+ transition: all 0.2s ease-in-out;
+}
+
+#tabsBar .circuits > span {
+ display: inline-block;
+ padding: 2px 5px;
+}
+
+.circuitName {
+ cursor: pointer;
+}
+
+#tabsBar button {
+ order: 99; /* could have better solution */
+ width: 20px;
+ align-items: center;
+ display: inline;
+ font-size: 20px;
+ text-align: center;
+ padding-bottom: 5px;
+ text-decoration: none;
+ outline: none;
+ border-radius: 1px;
+ transition: all 0.1s ease-in-out;
+ border-radius: 4px;
+ margin-left: 1px;
+}
+
+#tabsBar button:focus {
+ outline: none !important;
+ box-shadow: none !important;
+}
+#tabsBar button:active {
+ outline: none !important;
+ box-shadow: none !important;
+}
+
+/*! tab bar styling ends */
+/** Module property styling starts here */
+
+.moduleProperty {
+ font: inherit;
+ width: 250px;
+ top: 90px;
+ right: 10px;
+}
+
+.layoutElementPanel {
+ width: 220px;
+ font: inherit;
+ display: none;
+ top: 90px;
+ left: 10px;
+}
+
+.timing-diagram-panel {
+ border-radius: 5px;
+ z-index: 70;
+ transition: background 0.5s ease-out;
+ position: fixed;
+ cursor: pointer;
+ left: 300px;
+ top: 90px;
+}
+
+.timing-diagram-panel .panel-header {
+ border-radius: 5px;
+ border-top-right-radius: 5px;
+ padding: 3px;
+ font-weight: bold;
+ font-size: 16px;
+ text-transform: uppercase;
+ text-align: left;
+ cursor: move;
+}
+
+/* Testbench UI Styling begin */
+
+.testbench-manual-panel {
+ border-radius: 5px;
+ z-index: 100;
+ transition: background 0.5s ease-out;
+ position: fixed;
+ cursor: pointer;
+ left: 10px;
+ top: 470px;
+}
+
+.testbench-manual-panel .panel-header {
+ border-radius: 5px;
+ border-top-right-radius: 5px;
+ padding: 3px;
+ font-weight: bold;
+ font-size: 16px;
+ text-transform: uppercase;
+ text-align: left;
+ cursor: move;
+}
+
+.tb-case-arrow {
+ border: solid var(--text-panel);
+ border-width: 0 3px 3px 0;
+ display: inline-block;
+ padding: 3px;
+}
+
+.tb-case-arrow-right {
+ transform: rotate(-45deg);
+ -webkit-transform: rotate(-45deg);
+}
+
+.tb-case-arrow-left {
+ transform: rotate(135deg);
+ -webkit-transform: rotate(135deg);
+}
+
+.testbench-manual-panel .panel-body {
+ width: 700px;
+}
+
+.testbench-manual-panel b {
+ font-weight: bold;
+}
+
+.tb-manual-test-data {
+ /*text-align: center;*/
+ margin-top: 10px;
+ border-bottom: 1px solid var(--br-secondary);
+ padding-left: 8px;
+ padding-right: 8px;
+}
+
+.tb-manual-test-data .tb-data {
+ margin-right: 10px;
+}
+
+.tb-data span {
+ vertical-align: middle;
+ display: inline-block;
+ max-width: 200px;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+
+.tb-data#data-title {
+ float: left;
+}
+
+.tb-data#data-type {
+ float: right;
+}
+
+.tb-manual-table {
+ position: relative;
+ display: inline-block;
+ margin-top: 10px;
+ color: var(--text-panel);
+ max-width: 650px;
+ overflow-x: auto;
+ white-space: nowrap;
+}
+
+.tb-manual-table td,
+.tb-manual-table th {
+ padding-left: 15px;
+ padding-right: 15px;
+ padding-top: 12px;
+ padding-bottom: 12px;
+ text-align: center;
+ min-width: 80px;
+}
+
+.tb-manual-table th {
+ background: var(--table-head-dark);
+ height: 50px;
+}
+
+.testbench-manual-panel-buttons {
+ position: relative;
+ display: table-cell;
+ flex-wrap: wrap;
+ right: 0px;
+ text-align: left;
+ width: 200px;
+}
+
+.testbench-runall-label {
+ display: none;
+}
+
+.tb-dialog-button {
+ display: inline;
+ margin: 8px;
+ border-radius: 5px !important;
+ padding-left: 8px !important;
+ padding-right: 8px !important;
+ padding-top: 4px !important;
+ padding-bottom: 4px !important;
+}
+
+.tb-manual-test-buttons {
+ display: flex;
+ margin-top: 20px;
+ margin-left: 30px;
+ margin-right: 30px;
+ height: 25px;
+ overflow: auto;
+}
+
+.tb-manual-test-buttons .tb-case-button-left {
+ border-bottom-left-radius: 5px;
+ border-top-left-radius: 5px;
+ width: 24px;
+}
+
+.tb-manual-test-buttons .tb-case-button-right {
+ border-bottom-right-radius: 5px;
+ border-top-right-radius: 5px;
+ width: 24px;
+}
+
+.tb-manual-test-buttons .tb-test-label {
+ position: relative;
+ top: 0px;
+ line-height: 25px;
+ height: 25px;
+ margin: 0px;
+ padding-left: 2px;
+ padding-right: 2px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ background: #c4c4c4;
+ color: black;
+}
+
+.tb-manual-test-buttons .tb-test-label.group-label {
+ text-align: center;
+ width: 100px;
+}
+
+.tb-manual-test-buttons .tb-test-label.case-label {
+ text-align: center;
+ width: 40px;
+}
+
+.tb-group-buttons {
+ float: left;
+}
+
+.tb-case-buttons {
+ float: right;
+}
+
+.tb-test-null {
+ width: 350px !important;
+}
+
+.validation-ui-table td,
+.validation-ui-table th {
+ padding-left: 15px;
+ padding-right: 15px;
+ padding-top: 12px;
+ padding-bottom: 12px;
+ text-align: center;
+ min-width: 80px;
+ color: white;
+}
+
+/* Testbench UI styling end */
+
+#plotArea {
+ padding: 3px;
+ width: 100%;
+}
+
+#verilogEditorPanel {
+ width: 220px;
+ font: inherit;
+ display: none;
+ top: 90px;
+ right: 300px;
+}
+
+#moduleProperty-toolTip {
+ padding: 10px;
+}
+
+#moduleProperty-inner {
+ width: 85%;
+ margin: auto;
+}
+
+#moduleProperty-header {
+ font-size: 1.1em;
+ text-transform: uppercase;
+ margin-bottom: 20px;
+ text-align: left;
+}
+
+#moduleProperty-inner > p span {
+ display: inline-block;
+ font-weight: bold;
+}
+
+#moduleProperty-inner > div span {
+ display: inline-block;
+ font-weight: bold;
+}
+
+#moduleProperty-inner > p button {
+ border-radius: 2px;
+ margin: 3px;
+}
+
+#moduleProperty-inner > div button {
+ border-radius: 2px;
+ margin: 3px;
+}
+
+#moduleProperty-inner:last-child {
+ margin-bottom: 15px;
+}
+
+.moduleProperty select {
+ background-color: transparent;
+ border: none;
+ margin-left: 2px;
+ outline: none;
+}
+
+.moduleProperty input,
+.moduleProperty textarea {
+ background-color: transparent;
+ margin-top: 7px;
+ outline: none;
+ padding: 5px 5px;
+ width: 100%;
+}
+
+.moduleProperty textarea {
+ text-align: left;
+}
+
+.moduleProperty select,
+.moduleProperty input,
+.moduleProperty textarea {
+ border-radius: 7px !important;
+}
+
+.moduleProperty input:focus,
+.moduleProperty select:focus,
+.moduleProperty textarea {
+ outline-width: 0;
+ outline: none;
+ box-shadow: none;
+}
+
+.input-group-prepend button {
+ margin-right: 5px;
+}
+.input-group-append button {
+ margin-left: 5px;
+}
+
+.input-group-prepend button:hover {
+ border-radius: 3px !important;
+}
+.input-group-append button:hover {
+ border-radius: 3px !important;
+}
+
+/* toogle */
+
+.switch {
+ position: relative;
+ width: 43px;
+ height: 17px;
+ margin-bottom: 0px;
+ float: right;
+}
+
+.switch input {
+ display: none;
+}
+
+.slider {
+ position: absolute;
+ cursor: pointer;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ -webkit-transition: 0.2s all ease;
+ transition: 0.2s all ease;
+ border-radius: 25px;
+ width: 35px;
+}
+
+.slider:before {
+ position: absolute;
+ content: '';
+ height: 20px;
+ width: 20px;
+ left: -3px;
+ top: 50%;
+ transform: translateY(-51%);
+ -webkit-transition: 0.2s all ease-in-out;
+ transition: 0.2s all ease-in-out;
+ border-radius: 50%;
+}
+
+input:checked + .slider:before {
+ transform: translate(21px, -51%);
+}
+
+/** custom button styling */
+
+.custom-btn--primary {
+ border-radius: 1px;
+}
+
+.custom-btn--secondary {
+ background-color: transparent;
+ border-radius: 1px;
+ width: 90%;
+ display: inline-block;
+ line-height: inherit;
+}
+
+.custom-btn--secondary:hover {
+ /* color: white; */
+ transition: all 0.3s ease;
+}
+
+.custom-btn--tertiary {
+ border-radius: 1px;
+}
+/* Used to force auto width on secondary button */
+.custom-btn--basic {
+ border-radius: 1px;
+ border: solid 1px;
+ background-color: transparent;
+ display: inline-block;
+ background: var(--table-head-dark);
+}
+
+.custom-btn--basic:focus {
+ border: solid 1px;
+}
+
+#HelpButton {
+ background-color: transparent;
+ border: 2px solid white;
+ width: 90%;
+ margin-bottom: 15px;
+ margin-top: 15px;
+ font-weight: bold;
+}
+
+.btn-parent {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ margin: 0;
+}
+
+/* custom spin button */
+
+/*! Module property styling starts here */
+
+/** selects styling starts here */
+
+.moduleProperty select {
+ text-align: center;
+ width: 81px;
+ height: 20px;
+ float: right;
+ font-size: 17px;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+}
+
+/*! selects styling end here */
+
+/** layout dialog styling starts here */
+
+.layout-body {
+ text-align: center;
+ padding: 10px;
+ padding-bottom: 17px;
+ font-weight: bold;
+}
+
+#layoutDialog {
+ /* display: none; */
+ right: 10px;
+ top: 90px;
+ width: 220px;
+}
+
+.layout-title span {
+ display: block;
+ font-weight: bold;
+ margin: 8px;
+}
+
+.layout-title--enable {
+ display: flex;
+ justify-content: space-between;
+ margin: 15px 0;
+ padding: 0 8px;
+}
+
+.Layout-btn {
+ width: 48%;
+ height: 30px;
+ line-height: inherit;
+}
+
+.zoomButton-up {
+ /* background: url(./assets/layout-panel/up.svg) center/cover no-repeat; */
+ display: inline-block;
+ height: 35px;
+ width: 35px;
+}
+.zoomButton-down {
+ /* background: url(./assets/layout-panel/down.svg) center/cover no-repeat; */
+ display: inline-block;
+ height: 35px;
+ width: 35px;
+}
+.zoomButton-left {
+ /* background: url(./assets/layout-panel/left.svg) center/cover no-repeat; */
+ display: inline-block;
+ height: 35px;
+ width: 35px;
+}
+.zoomButton-right {
+ /* background: url(./assets/layout-panel/right.svg) center/cover no-repeat; */
+ display: inline-block;
+ height: 35px;
+ width: 35px;
+}
+
+/*! layout dialog styling ends here */
+
+/** download dialog styling starts here */
+
+.ui-dialog {
+ /*this also affects all dialog created using jquery UI, needs to be more universe */
+ font: inherit;
+ border-radius: 5px;
+ width: 600px;
+ height: 320px;
+ padding: 10px 17px;
+ padding-bottom: 0;
+ /* border: none !important; */
+}
+
+@supports (backdrop-filter: blur()) {
+ .ui-dialog {
+ backdrop-filter: blur(5px);
+ }
+}
+
+.ui-widget-header {
+ background: transparent;
+ border: none;
+ border-radius: 0;
+}
+
+.option {
+ display: inline-flex;
+ border-radius: 7px;
+ align-items: center;
+ justify-content: space-around;
+ padding: 0 7px;
+ position: relative;
+ cursor: pointer;
+ margin: 2px 3px;
+}
+
+.option input[type='radio'] {
+ visibility: hidden;
+}
+
+.download-dialog-section-2 .btn {
+ color: var(--text-lite);
+}
+.download-dialog-section-2 .btn:hover {
+ color: var(--text-lite);
+}
+
+.download-dialog-section-2 .option {
+ background: transparent;
+}
+
+.custom-radio span {
+ height: 20px;
+ width: 20px;
+ border-radius: 50%;
+ display: block;
+ position: absolute;
+ left: 2px;
+ top: 50%;
+ transform: translateY(-50%);
+}
+
+.custom-radio span:after {
+ content: '';
+ height: 8px;
+ width: 8px;
+ border-radius: 50%;
+ display: block;
+ position: absolute;
+ left: 50%;
+ top: 50%;
+ transform: translate(-50%, -50%) scale(0);
+ transition: 300ms ease-in-out 0s;
+}
+
+.custom-radio input[type='radio']:checked ~ span:after {
+ transform: translate(-50%, -50%) scale(1);
+}
+
+#saveImageDialog {
+ border-radius: 2px;
+ padding: 13px;
+ margin: 0;
+ margin-top: 15px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ align-items: center;
+ min-height: 188px !important;
+}
+
+.download-dialog-section-2 .option {
+ padding: 0;
+}
+
+.download-dialog-section-1 > label {
+ height: 30px;
+ width: 85px;
+}
+
+.download-dialog-section-2 {
+ background: transparent;
+ width: 100%;
+ display: inline-flex;
+ justify-content: space-around;
+}
+
+.btn-group-toggle {
+ background-color: transparent;
+ overflow: hidden;
+}
+.download-dialog-section-2 .active-btn {
+ box-shadow: none;
+}
+
+.download-dialog-section-2 .btn input[type='radio']:disabled {
+ background: red !important;
+ color: red !important;
+}
+
+.download-dialog-section-2_2 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.download-dialog-section-3 {
+ border-radius: 2px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 6px 10px;
+ width: 320px;
+ position: inherit;
+}
+
+.download-dialog-section-3 > label {
+ width: 60px;
+ height: 25px;
+ margin-bottom: 0;
+}
+
+.ui-dialog-buttonpane {
+ background: transparent;
+}
+
+.ui-dialog .ui-dialog-titlebar {
+ padding: 0;
+ padding-bottom: 8px;
+ font: inherit;
+ line-height: inherit;
+ font-weight: bold;
+}
+
+.ui-dialog-titlebar-close {
+ border: none;
+ color: white;
+ position: absolute;
+ top: 15px;
+ right: 15px;
+ visibility: hidden;
+}
+
+.ui-dialog-titlebar-close::after {
+ content: '';
+ display: block;
+ position: absolute;
+ background: url(./assets/small-components/close.svg) center/cover no-repeat;
+ height: 15px;
+ width: 15px;
+ visibility: visible;
+ right: 0;
+ top: 0;
+}
+
+.ui-dialog-titlebar-close::hover {
+ border: none;
+}
+
+.ui-dialog .ui-dialog-buttonpane {
+ border: none;
+ padding: 0;
+ margin: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin: 12px;
+}
+
+.ui-dialog .ui-dialog-buttonpane button {
+ background: transparent;
+ color: white;
+ line-height: inherit;
+ border-radius: 1px;
+ font: inherit;
+}
+
+.ui-dialog .ui-dialog-buttonpane button:hover {
+ transition: all 0.3s ease;
+ border: 1px solid transparent;
+}
+
+.render-btn {
+ height: 35px;
+ border-radius: 1px;
+}
+.navbar {
+ transition: background 0.5s ease-out;
+}
+
+.navbar .nav.pull-right {
+ float: right;
+ margin-right: 10px;
+ min-width: 85px;
+}
+
+@media (max-width: 991px) {
+ .navbar .nav.pull-right {
+ display: none;
+ }
+}
+
+@media (max-width: 991px) {
+ .nav-dropdown {
+ text-align: center;
+ padding-top: 20px;
+ }
+}
+
+/*! download dialog styling end here */
+
+/** combinationalAnalysis dialog styling starts here */
+
+.ui-dialog[aria-describedby='combinationalAnalysis'] {
+ width: 460px;
+ min-height: 210px;
+ border: none;
+}
+
+#combinationalAnalysis {
+ margin-top: 10px;
+}
+
+#combinationalAnalysis p input {
+ border: 1px solid white;
+ background: transparent;
+ font: inherit;
+ text-align: center;
+}
+
+.ui-dialog input::placeholder {
+ /* Chrome, Firefox, Opera, Safari 10.1+ */
+ color: white;
+ opacity: 0.7; /* Firefox */
+}
+
+#combinationalAnalysis table {
+ width: 460px;
+}
+
+#booleanTable {
+ width: 200px;
+}
+
+.content-table {
+ border-collapse: collapse;
+ font-size: 0.9em;
+ min-width: 400px;
+}
+
+.content-table tr th {
+ font-weight: bold;
+}
+
+.content-table th,
+.content-table td {
+ padding: 5px 15px;
+ margin: 0 3px;
+ width: 20%;
+ border-radius: 2px;
+}
+
+.content-table tbody tr {
+ text-align: center;
+ display: flex;
+ margin-bottom: 4px;
+}
+
+.content-table tbody {
+ display: table-row-group;
+ overflow: auto !important;
+ margin-left: 52px;
+}
+
+.output {
+ cursor: pointer;
+}
+
+/*! combinationalAnalysis dialog styling end here */
+
+#setTestbenchData input {
+ border: 1px solid white;
+ background: transparent;
+ text-align: center;
+ font: inherit;
+ color: white;
+}
+
+#setTestbenchData p {
+ font: inherit;
+ color: white;
+}
+
+/** openProjectDialog styling starts here */
+
+#openProjectDialog {
+ display: grid;
+ /* grid-template-columns: 1fr 1fr 1fr; */
+ /* grid-gap: 0 10px; */
+ align-items: center;
+}
+
+#openProjectDialog > label {
+ margin: 4px;
+ padding: 10px;
+ background: transparent;
+ border-radius: 1px;
+ width: 100%;
+}
+
+/*! openProjectDialog styling ends here */
+
+#insertSubcircuitDialog {
+ display: block;
+ padding-bottom: 0;
+ overflow: visible;
+}
+
+#insertSubcircuitDialog > p {
+ margin-bottom: 0;
+}
+
+#insertSubcircuitDialog > label {
+ height: 30px;
+ border-radius: 3px;
+ margin: 0 5px;
+ margin-bottom: 4px;
+ justify-content: center;
+ padding-left: 10px;
+}
+
+#miniMap {
+ position: fixed;
+ z-index: 3;
+ bottom: 20px;
+ right: 40px;
+ overflow-y: scroll;
+ opacity: 0.5;
+ overflow: hidden;
+ border: none;
+}
+
+.disable::after {
+ content: '';
+ position: absolute;
+ height: 100%;
+ width: 100%;
+ cursor: not-allowed;
+ left: 0;
+}
+
+.ui-dialog .ui-dialog-buttonpane button {
+ margin-left: 0.4em;
+}
+
+.ui-dialog-titlebar-close:hover {
+ border: none;
+}
+
+.radio-green {
+ background: #42b983;
+}
+
+.search-input {
+ margin: 0 10px;
+ padding: 3px 10px;
+ width: 90%;
+ border-radius: 13px;
+ margin-bottom: 10px;
+ background: transparent !important;
+}
+
+.search-input:focus {
+ outline: none !important;
+}
+
+.search-close {
+ position: absolute;
+ right: 19px;
+ top: 6px;
+ cursor: pointer;
+}
+
+.search-results {
+ padding: 15px;
+ transition: all 0.5s ease;
+ max-height: 340px;
+ overflow-y: scroll;
+ padding-right: 0;
+}
+
+.search-results div {
+ border-radius: 3px;
+}
+
+.draggable-panel-css .minimize {
+ position: absolute;
+ right: 15px;
+ cursor: pointer;
+}
+
+.panel-button-icon {
+ cursor: pointer;
+}
+
+.panel-button {
+ cursor: pointer;
+ padding: 2px;
+}
+
+.draggable-panel-css .maximize {
+ position: absolute;
+ right: 15px;
+ cursor: pointer;
+ display: none;
+}
+
+.ce-hidden,
+.prop-hidden {
+ font-weight: bold;
+ padding: 10px;
+ font-size: 16px;
+ text-transform: uppercase;
+ border-radius: 5px;
+}
+
+.largeButton.btn {
+ width: 100%;
+ margin-bottom: 5px;
+ margin-left: 0 !important;
+}
+
+.objectPropertyAttributeChecked {
+ margin-left: 0 !important;
+}
+
+#exitViewBtn {
+ position: fixed;
+ z-index: 1000000000;
+ right: 2%;
+ top: 3%;
+ box-shadow: 0px 0px 10Xpx #4545457f;
+ padding: 10px 15px;
+ border-radius: 5px;
+}
+
+.ce-hidden,
+.prop-hidden {
+ cursor: move;
+}
+
+#canvasArea,
+#backgroundArea,
+#simulationArea,
+canvas {
+ /* cursor: wait !important; */
+}
+
+/** Color them dialog styles starts here*/
+
+.ui-dialog[aria-describedby='colorThemesDialog'] {
+ min-width: 760px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+}
+
+.colorThemesDialog {
+ height: 390px !important;
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ overflow-y: auto;
+ margin-top: 10px;
+ border: 1px solid white !important;
+}
+
+.colorThemesDialog input {
+ margin: 15px;
+}
+
+.colorThemesDialog label {
+ margin-bottom: 0;
+}
+
+.theme {
+ color: white;
+ width: 202.5px;
+ line-height: 30px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ margin: 15px;
+ border-radius: 1.5px;
+ transition: all 0.1s ease-out;
+ position: relative;
+ overflow-x: hidden;
+ height: 154px;
+}
+
+.themeNameBox {
+ display: block;
+ width: 100%;
+ cursor: pointer;
+}
+
+.themeSel {
+ background: transparent;
+ display: block;
+ width: 100%;
+ height: 100%;
+ position: absolute;
+}
+
+/*! Color them dialog styles ends here*/
+
+/*! Custom Color theme dialog styles starts here*/
+
+.ui-dialog[aria-describedby='CustomColorThemesDialog'] {
+ min-width: 760px;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+}
+
+#CustomColorThemesDialog {
+ height: 400px !important;
+ background: none;
+ overflow: auto;
+}
+
+#CustomColorThemesDialog label {
+ color: var(--text-panel);
+ width: 60%;
+ height: 30px;
+}
+
+#CustomColorThemesDialog input {
+ cursor: pointer;
+ width: 30%;
+ height: 30px;
+}
+
+/*! Custom Color theme dialog styles ends here*/
+
+.code-window .CodeMirror {
+ height: calc(100vh - 78px);
+ overflow: scroll;
+}
+
+.code-window-embed .CodeMirror {
+ height: 100%;
+ overflow: scroll;
+}
+
+.code-window-embed {
+ position: absolute;
+ top: 28px;
+ height: 100%;
+ width: 100%;
+ overflow: scroll;
+ z-index: 3;
+ display: none;
+}
+
+.code-window {
+ display: none;
+}
+
+#verilogOutput {
+ font-size: 12px;
+}
+
+.embed-fullscreen-btn {
+ border-radius: 3px;
+ width: auto;
+}
+
+#plot {
+ width: 800px;
+}
+
+.timing-diagram-toolbar {
+ padding-left: 4px;
+ padding: 2px;
+ cursor: default;
+}
+
+.timing-diagram-toolbar input {
+ width: 80px;
+ background: transparent !important;
+}
+
+#timing-diagram-log {
+ font-size: 12.5px;
+ padding: 3px;
+ margin-left: 5px;
+ /* margin-bottom: 5px; */
+ border-radius: 3px;
+}
+
+/* CustomColorInput Styles Starts Here */
+.customColorInput {
+ cursor: pointer;
+ width: 30%;
+ height: 30px;
+ overflow: visible;
+ position: relative;
+ top: 8px;
+ appearance: auto;
+ background-color: buttonface;
+ color: buttontext;
+ border-width: 1px;
+ border-style: solid;
+ border-color: buttonborder;
+ border-image: initial;
+ padding: 1px 2px;
+}
+.customColorLabel {
+ width: 60%;
+ height: 30px;
+}
+
+/* Vue Dialog Box Styles STARTS */
+
+.inputField {
+ width: 100%;
+ padding: 10px 10px;
+ margin: 8px 0;
+ box-sizing: border-box;
+ border-radius: 5px;
+ border: 1px solid #c5c5c5;
+ color: white;
+ outline: none;
+}
+
+.cAinput {
+ width: 30%;
+ padding: 0 5px;
+ margin: 8px 0;
+ box-sizing: border-box;
+ border-radius: 5px;
+ border: 1px solid #c5c5c5;
+ color: white;
+ outline: none;
+}
+
+.combinationalAnalysisInput:first-child {
+ padding-top: 20px;
+}
+
+.combinationalAnalysisInput {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-evenly;
+ align-items: baseline;
+}
+
+.inputField:focus {
+ border: 2px solid #c5c5c5;
+}
+
+.v-card-actions {
+ width: fit-content;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ margin: auto;
+}
+
+.v-input__details {
+ margin-bottom: 0.5rem;
+}
+
+/*
+.ProseMirror ul {
+ list-style-type: disc;
+}
+
+.ProseMirror ol {
+ list-style-type: decimal;
+} */
+
+.ProseMirror {
+ height: 12rem;
+ overflow-y: auto;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+ outline: none;
+}
+
+.fullscreen .ProseMirror {
+ height: 75vh;
+}
+
+/* .ProseMirror ul,
+.ProseMirror ol,
+.ProseMirror li {
+ margin: 0;
+ padding: 0;
+ list-style: inherit;
+} */
+
+.messageBoxContent {
+ height: auto;
+ width: 760px;
+ justify-content: center;
+ margin: auto;
+ backdrop-filter: blur(5px);
+ border-radius: 5px;
+ border: 0.5px solid var(--br-primary) !important;
+ background: var(--bg-primary-moz) !important;
+ background-color: var(--bg-primary-chr) !important;
+ color: white;
+}
+
+/* media query for .messageBoxContent */
+@media screen and (max-width: 991px) {
+ .messageBoxContent {
+ width: 100%;
+ }
+}
+
+.tabsbarInput {
+ align-items: center;
+}
+
+.messageBtn {
+ width: fit-content;
+ min-width: 50px;
+ border: 1px solid #c5c5c5;
+ padding: 5px 5px;
+}
+
+.messageBtn:hover {
+ background: #c5c5c5;
+ color: black;
+}
+
+.dialogHeader {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 10px;
+}
+.dialogClose {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ color: white;
+ background: none;
+ font-size: x-small;
+ box-shadow: none;
+}
+.dialogClose:hover {
+ font-weight: bold;
+ background: white;
+ opacity: 0.5;
+ color: black;
+}
+
+.dialogHeader {
+ font-weight: bold;
+ margin-bottom: 25px;
+}
+
+.downloadCheckbox {
+ width: 5px;
+ height: 5px;
+}
+/* STYLE ENDS */
diff --git a/v1/src/styles/css/plugin-stylesheets/checkBo.min.css b/v1/src/styles/css/plugin-stylesheets/checkBo.min.css
new file mode 100644
index 00000000..199f3c9b
--- /dev/null
+++ b/v1/src/styles/css/plugin-stylesheets/checkBo.min.css
@@ -0,0 +1,386 @@
+/*
+ * checkBo lightweight jQuery plugin v0.1.4 by @ElmahdiMahmoud
+ * Licensed under the MIT license - https://github.com/elmahdim/checkbo/blob/master/LICENSE
+ *
+ * Custom checkbox and radio
+ * Author URL: elmahdim.com
+ */
+
+.cb-checkbox .cb-inner,
+.cb-checkbox i {
+ width: 18px;
+ height: 18px;
+ -moz-border-radius: 3px;
+ -webkit-border-radius: 3px;
+ border-radius: 3px;
+}
+.cb-checkbox.cb-sm .cb-inner,
+.cb-checkbox.cb-sm i {
+ width: 14px;
+ height: 14px;
+}
+.cb-checkbox.cb-md .cb-inner,
+.cb-checkbox.cb-md i {
+ width: 24px;
+ height: 24px;
+ -moz-border-radius: 4px;
+ -webkit-border-radius: 4px;
+ border-radius: 4px;
+}
+.cb-checkbox.cb-lg .cb-inner,
+.cb-checkbox.cb-lg i {
+ width: 30px;
+ height: 30px;
+ -moz-border-radius: 6px;
+ -webkit-border-radius: 6px;
+ border-radius: 6px;
+}
+.cb-radio .cb-inner {
+ width: 18px;
+ height: 18px;
+}
+.cb-radio.cb-sm .cb-inner {
+ width: 14px;
+ height: 14px;
+}
+.cb-radio.cb-md .cb-inner {
+ width: 24px;
+ height: 24px;
+}
+.cb-radio.cb-lg .cb-inner {
+ width: 30px;
+ height: 30px;
+}
+.cb-checkbox,
+.cb-radio {
+ padding: 3px 0;
+ color: inherit;
+ cursor: pointer;
+ overflow: hidden;
+ font-size: inherit;
+ font-weight: 400;
+ display: inline-block;
+ line-height: 18px;
+}
+.cb-checkbox input[type='checkbox'],
+.cb-radio input[type='radio'],
+.cb-switcher input[type='checkbox'],
+.cb-switcher input[type='radio'] {
+ /* display: none; */
+}
+.cb-checkbox.disabled,
+.cb-checkbox.disabled *,
+.cb-radio.disabled,
+.cb-radio.disabled *,
+.cb-switcher.disabled,
+.cb-switcher.disabled * {
+ cursor: default;
+}
+.cb-checkbox.disabled,
+.cb-checkbox.disabled .cb-inner {
+ color: #ddd;
+}
+.cb-checkbox.disabled:hover .cb-inner {
+ border-color: #ddd;
+}
+.cb-checkbox.disabled.checked .cb-inner {
+ background-color: #ddd;
+ border-color: #ddd;
+}
+.cb-radio.disabled {
+ color: #ddd;
+}
+.cb-radio.disabled .cb-inner {
+ border-color: #ddd;
+}
+.cb-radio.disabled i {
+ background-color: transparent;
+}
+.cb-radio.disabled.checked .cb-inner {
+ border-color: #ddd;
+}
+.cb-radio.disabled.checked .cb-inner i {
+ background-color: #ddd;
+}
+.cb-radio.disabled:hover .cb-inner {
+ border-color: #ddd;
+}
+.cb-checkbox .cb-inner {
+ float: left;
+ overflow: hidden;
+ margin: 0 5px 0 0;
+ position: relative;
+ background: transparent;
+ display: inline-block;
+ border: 1px solid #d6d6d6;
+ /* -moz-transition: all 0.5s ease;
+ -o-transition: all 0.5s ease;
+ -webkit-transition: all 0.5s ease;
+ transition: all 0.5s ease; */
+}
+.cb-checkbox i {
+ top: 1px;
+ left: 2px;
+ display: block;
+ position: absolute;
+}
+.cb-checkbox i:after,
+.cb-checkbox i:before {
+ height: 0;
+ width: 2px;
+ content: '';
+ display: block;
+ position: absolute;
+ background-color: #fff;
+ /* -moz-transition: all 0.2s ease;
+ -o-transition: all 0.2s ease;
+ -webkit-transition: all 0.2s ease;
+ transition: all 0.2s ease; */
+}
+.cb-checkbox i:before {
+ top: 0;
+ left: 0;
+ -moz-transform: rotate(-45deg);
+ -ms-transform: rotate(-45deg);
+ -webkit-transform: rotate(-45deg);
+ transform: rotate(-45deg);
+}
+.cb-checkbox i:after {
+ left: 7px;
+ bottom: 5px;
+ /* -moz-transition-delay: 0.3s;
+ -o-transition-delay: 0.3s;
+ -webkit-transition-delay: 0.3s;
+ transition-delay: 0.3s; */
+ -moz-transform: rotate(30deg);
+ -ms-transform: rotate(30deg);
+ -webkit-transform: rotate(30deg);
+ transform: rotate(30deg);
+}
+.cb-radio .cb-inner {
+ float: left;
+ overflow: hidden;
+ margin: 0 5px 0 0;
+ position: relative;
+ display: inline-block;
+ border: 1px solid #d7d7d7;
+ background-color: transparent;
+ -moz-border-radius: 100%;
+ -webkit-border-radius: 100%;
+ border-radius: 100%;
+ -moz-transition: all 0.1s ease;
+ -o-transition: all 0.1s ease;
+ -webkit-transition: all 0.1s ease;
+ transition: all 0.1s ease;
+}
+.cb-radio i {
+ top: 50%;
+ left: 50%;
+ width: 6px;
+ height: 6px;
+ margin-top: -3px;
+ margin-left: -3px;
+ position: absolute;
+ background-color: transparent;
+ -moz-border-radius: 100%;
+ -webkit-border-radius: 100%;
+ border-radius: 100%;
+ -moz-transform: scale(0.05, 5);
+ -ms-transform: scale(0.05, 5);
+ -webkit-transform: scale(0.05, 5);
+ transform: scale(0.05, 5);
+ -moz-transition: all 0.2s ease;
+ -o-transition: all 0.2s ease;
+ -webkit-transition: all 0.2s ease;
+ transition: all 0.2s ease;
+}
+.cb-checkbox.cb-sm,
+.cb-radio.cb-sm {
+ line-height: 14px;
+}
+.cb-checkbox.cb-md,
+.cb-radio.cb-md {
+ line-height: 24px;
+}
+.cb-checkbox.cb-lg,
+.cb-radio.cb-lg {
+ line-height: 30px;
+}
+.cb-checkbox.cb-sm i:before {
+ top: 4px;
+ left: 1px;
+}
+.cb-checkbox.cb-sm i:after {
+ left: 5px;
+}
+.cb-checkbox.cb-md i:before {
+ top: 10px;
+ left: 5px;
+}
+.cb-checkbox.cb-md i:after {
+ bottom: 6px;
+ left: 11px;
+}
+.cb-checkbox.checked .cb-inner {
+ border-color: transparent;
+ background-color: transparent;
+}
+.cb-checkbox.checked.cb-sm i:before {
+ top: 4px;
+ left: 1px;
+}
+.cb-checkbox.checked.cb-sm i:after {
+ height: 9px;
+}
+.cb-checkbox.checked.cb-md i:before {
+ top: 10px;
+ left: 4px;
+ height: 8px;
+}
+.cb-checkbox.checked.cb-md i:after {
+ bottom: 6px;
+ left: 11px;
+ height: 16px;
+}
+.cb-checkbox.checked.cb-lg i:before {
+ top: 11px;
+ left: 6px;
+ height: 12px;
+}
+.cb-checkbox.checked.cb-lg i:after {
+ left: 14px;
+ bottom: 7px;
+ height: 20px;
+}
+.cb-checkbox.checked i:before {
+ top: 6px;
+ left: 2px;
+ height: 6px;
+}
+.cb-checkbox.checked i:after {
+ height: 12px;
+}
+.cb-radio.checked .cb-inner {
+ background: #fff;
+ box-shadow: 0 0 3px #efefef;
+}
+.cb-radio.checked i {
+ -moz-transform: scale(1.1, 1.1);
+ -ms-transform: scale(1.1, 1.1);
+ -webkit-transform: scale(1.1, 1.1);
+ transform: scale(1.1, 1.1);
+ background-color: transparent;
+}
+.cb-checkbox:hover .cb-inner,
+.cb-radio:hover .cb-inner {
+ border-color: white;
+}
+.cb-switcher {
+ display: inline-block;
+ border: 1px solid #eee;
+ background-color: #fff;
+ width: 95px;
+ height: 35px;
+ position: relative;
+ -moz-border-radius: 20px;
+ -webkit-border-radius: 20px;
+ border-radius: 20px;
+ -moz-transition: background 0.4s ease;
+ -o-transition: background 0.4s ease;
+ -webkit-transition: background 0.4s ease;
+ transition: background 0.4s ease;
+}
+.cb-switcher,
+.cb-switcher * {
+ cursor: pointer;
+}
+.cb-switcher ::-moz-selection {
+ background-color: transparent;
+}
+.cb-switcher ::selection {
+ background-color: transparent;
+}
+.cb-switcher .cb-state {
+ z-index: 1;
+ text-align: center;
+ font-size: 12px;
+}
+.cb-switcher .cb-state,
+.cb-switcher:before {
+ width: 34px;
+ height: 34px;
+ line-height: 34px;
+ position: absolute;
+ left: 0;
+ top: -1px;
+ -moz-border-radius: 100%;
+ -webkit-border-radius: 100%;
+ border-radius: 100%;
+ -moz-transition: all 0.4s ease;
+ -o-transition: all 0.4s ease;
+ -webkit-transition: all 0.4s ease;
+ transition: all 0.4s ease;
+}
+.cb-switcher:before {
+ content: '';
+ background-color: #eee;
+ -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
+ -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
+ box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
+}
+.cb-switcher.checked {
+ background-color: transparent;
+}
+.cb-switcher.checked .cb-state,
+.cb-switcher.checked:before {
+ left: 60px;
+ color: transparent;
+}
+.cb-switcher.checked:before {
+ background-color: #fff;
+ -moz-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
+ -webkit-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
+ box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.1);
+}
+.cb-switcher.checked .inner-switcher:before {
+ border-top-color: transparent;
+}
+.cb-switcher.checked .inner-switcher:after {
+ border-bottom-color: transparent;
+}
+.cb-switcher .inner-switcher:after,
+.cb-switcher .inner-switcher:before {
+ content: '';
+ position: absolute;
+ left: 50%;
+ width: 0;
+ height: 0;
+ z-index: 2;
+ margin-left: -20px;
+ border-left: 20px solid transparent;
+ border-right: 20px solid transparent;
+ -moz-transition: border 0.4s ease;
+ -o-transition: border 0.4s ease;
+ -webkit-transition: border 0.4s ease;
+ transition: border 0.4s ease;
+}
+.cb-switcher .inner-switcher:before {
+ border-top: 17px solid #fff;
+ top: 0;
+}
+.cb-switcher .inner-switcher:after {
+ border-bottom: 17px solid #fff;
+ bottom: 0;
+}
+.cb-state {
+ color: #ccc;
+ display: inline-block;
+}
+.cb-switcher-group .cb-state {
+ position: relative;
+ top: 7px;
+}
+.is-hidden {
+ display: none !important;
+ visibility: hidden !important;
+}
diff --git a/v1/src/styles/css/restrictedElements.css b/v1/src/styles/css/restrictedElements.css
new file mode 100644
index 00000000..68c21493
--- /dev/null
+++ b/v1/src/styles/css/restrictedElements.css
@@ -0,0 +1,20 @@
+.display--none {
+ display: none;
+}
+
+.circuit-element-category {
+ border-bottom: 1px solid #026e57;
+ font-weight: 500;
+ margin: 20px 0 5px;
+ padding-bottom: 5px;
+}
+
+.restricted-elements-list {
+ margin: 10px 0 25px;
+}
+
+.form-check-label {
+ font-size: 16px;
+ margin-bottom: 6px;
+ margin-top: 6px;
+}
diff --git a/v1/src/styles/css/shortcut.panel.css b/v1/src/styles/css/shortcut.panel.css
new file mode 100644
index 00000000..a2be4f72
--- /dev/null
+++ b/v1/src/styles/css/shortcut.panel.css
@@ -0,0 +1,146 @@
+.ui-dialog[aria-describedby='customShortcutDialog'] {
+ min-width: 680px;
+}
+
+#edit {
+ display: none;
+ position: absolute;
+ width: 490px;
+ height: 150px;
+ background: #2d302e;
+ border-radius: 5px;
+ z-index: 10000;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ animation: none;
+}
+
+#edit > span {
+ margin-top: 10px;
+ position: absolute;
+ text-align: center;
+ width: 100%;
+}
+
+#pressedKeys {
+ text-align: center;
+ position: absolute;
+ top: 50%;
+ width: 100%;
+}
+
+#warning {
+ position: absolute;
+ bottom: 5px;
+ width: 100%;
+ text-align: center;
+ font-size: 14px;
+ color: #dc5656;
+}
+
+#customShortcutDialog {
+ align-items: center;
+ color: white;
+ flex-direction: column;
+ max-height: 430px !important;
+ overflow: hidden !important;
+}
+
+#closeDialog {
+ font-size: 25px;
+ color: white;
+ transform: rotate(45deg);
+ position: absolute;
+ top: 0%;
+ right: 2%;
+ cursor: pointer;
+ user-select: none;
+ -moz-user-select: none;
+}
+
+#dialogTitle {
+ position: absolute;
+ top: 2%;
+ left: 3%;
+ user-select: none;
+ -moz-user-select: none;
+}
+
+#heading {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-weight: bold;
+ width: 100%;
+ height: 35px;
+ user-select: none;
+ padding-bottom: 10px;
+}
+
+#heading > span {
+ padding: 0 20px;
+}
+
+#preference {
+ max-width: 600px;
+ height: 350px;
+ overflow-y: auto;
+}
+
+#preference div {
+ display: inline-flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 35px;
+ cursor: pointer;
+ user-select: none;
+ -moz-user-select: none;
+ width: 100%;
+ padding-left: 5px;
+ padding-right: 7px;
+}
+
+/* #preference div:not('#edit-icon') > span {
+ padding: 0 30px;
+} */
+
+#preference > div:hover {
+ background-color: #7474743f;
+}
+
+#preference > div:hover span {
+ visibility: visible;
+}
+
+#edit-icon {
+ background: url(../../assets/img/edit_icon.png) no-repeat;
+ background-size: 15px 15px;
+ display: inline-block;
+ visibility: hidden;
+ width: 15px;
+ height: 15px;
+}
+
+@keyframes shake {
+ 10%,
+ 90% {
+ transform: translate(-50.5%, -50%);
+ }
+
+ 20%,
+ 80% {
+ transform: translate(-49.5%, -50%);
+ }
+
+ 30%,
+ 50%,
+ 70% {
+ transform: translate(-50.5%, -50%);
+ }
+
+ 40%,
+ 60% {
+ transform: translate(-49.5%, -50%);
+ }
+}
diff --git a/v1/src/styles/css/testCreator.css b/v1/src/styles/css/testCreator.css
new file mode 100644
index 00000000..47877b3c
--- /dev/null
+++ b/v1/src/styles/css/testCreator.css
@@ -0,0 +1,141 @@
+.tb-test-title {
+ text-align: center;
+ margin-top: 50px;
+}
+
+.lower-button {
+ height: 40px;
+ width: auto;
+ min-width: 40px;
+ background-color: #ffffff;
+ border: 2px solid black;
+ color: black;
+ /*padding: 20px;*/
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ /*font-size: 16px;*/
+ margin: 4px 2px;
+ border-radius: 4px;
+}
+
+.table-button {
+ height: 20px;
+ width: 20px;
+ background-color: #ffffff;
+ border: 2px solid black;
+ color: black;
+ text-decoration: none;
+ display: inline-block;
+ margin: 4px 4px;
+ padding: 0px;
+ border-radius: 5px;
+}
+
+.plus-button {
+ font-size: 25px;
+}
+
+.tb-minus {
+ color: red;
+}
+
+.save-buton {
+ background-color: #42b983;
+ color: white;
+ border: 1px solid gray;
+ min-width: 70px;
+}
+
+.latest-button {
+ float: left;
+}
+
+.buttons-alignment {
+ display: flex;
+ flex-direction: row;
+ align-items: flex-start;
+}
+
+.tablink {
+ background-color: #555;
+ color: white;
+ float: left;
+ border: 1px solid white;
+ border-radius: 5px;
+ outline: none;
+ cursor: pointer;
+ padding: 14px 16px;
+ font-size: 17px;
+ width: 50%;
+}
+
+/* Change background color of buttons on hover */
+.tablink:hover.tablink-no-override {
+ background-color: #a5dfc5;
+}
+
+.tablink-hover-override {
+}
+
+.tablink.tab-selected {
+ background-color: #42b983;
+ color: #fff;
+ outline: none;
+}
+
+.data-group {
+ margin-top: 2%;
+}
+
+.tb-table {
+ table-layout: fixed;
+ width: 100%;
+ height: 20px;
+ border-spacing: 5px;
+}
+
+.tb-table th,
+td {
+ border: 2px solid black;
+ border-collapse: collapse;
+ padding: 15px;
+ text-align: center;
+ transition: transform 0.2s;
+}
+
+.tb-table th {
+ text-align: center;
+}
+
+.tb-table tr th:first-child,
+tr td:first-child {
+ width: 250px;
+}
+
+.label-table {
+ margin-top: 100px;
+}
+
+.test-title {
+ display: flex;
+ width: 100%;
+ font-size: 25px;
+ margin-top: 20px;
+ margin-bottom: 10px;
+}
+
+.test-title #test-title-label {
+ width: 80%;
+ border: 1px solid;
+ border-radius: 5px;
+}
+
+.tb-handle {
+ padding: 0px !important;
+ border: 0px !important;
+}
+
+body {
+ overflow: scroll;
+}
diff --git a/v1/src/styles/css/typeahead.min.css b/v1/src/styles/css/typeahead.min.css
new file mode 100644
index 00000000..01891f6d
--- /dev/null
+++ b/v1/src/styles/css/typeahead.min.css
@@ -0,0 +1,186 @@
+.has-warning .twitter-typeahead .tt-hint,
+.has-warning .twitter-typeahead .tt-input {
+ border-color: #8a6d3b;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-warning .twitter-typeahead .tt-hint:focus,
+.has-warning .twitter-typeahead .tt-input:focus {
+ border-color: #66512c;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
+}
+.has-error .twitter-typeahead .tt-hint,
+.has-error .twitter-typeahead .tt-input {
+ border-color: #a94442;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-error .twitter-typeahead .tt-hint:focus,
+.has-error .twitter-typeahead .tt-input:focus {
+ border-color: #843534;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
+}
+.has-success .twitter-typeahead .tt-hint,
+.has-success .twitter-typeahead .tt-input {
+ border-color: #3c763d;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+}
+.has-success .twitter-typeahead .tt-hint:focus,
+.has-success .twitter-typeahead .tt-input:focus {
+ border-color: #2b542c;
+ -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
+ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
+}
+.input-group .twitter-typeahead:first-child .tt-hint,
+.input-group .twitter-typeahead:first-child .tt-input {
+ border-bottom-left-radius: 4px;
+ border-top-left-radius: 4px;
+ width: 100%;
+}
+.input-group .twitter-typeahead:last-child .tt-hint,
+.input-group .twitter-typeahead:last-child .tt-input {
+ border-bottom-right-radius: 4px;
+ border-top-right-radius: 4px;
+ width: 100%;
+}
+.input-group.input-group-sm .twitter-typeahead .tt-hint,
+.input-group.input-group-sm .twitter-typeahead .tt-input {
+ height: 30px;
+ padding: 5px 10px;
+ font-size: 12px;
+ line-height: 1.5;
+ border-radius: 3px;
+}
+select.input-group.input-group-sm .twitter-typeahead .tt-hint,
+select.input-group.input-group-sm .twitter-typeahead .tt-input {
+ height: 30px;
+ line-height: 30px;
+}
+select[multiple].input-group.input-group-sm .twitter-typeahead .tt-hint,
+select[multiple].input-group.input-group-sm .twitter-typeahead .tt-input,
+textarea.input-group.input-group-sm .twitter-typeahead .tt-hint,
+textarea.input-group.input-group-sm .twitter-typeahead .tt-input {
+ height: auto;
+}
+.input-group.input-group-sm
+ .twitter-typeahead:not(:first-child):not(:last-child)
+ .tt-hint,
+.input-group.input-group-sm
+ .twitter-typeahead:not(:first-child):not(:last-child)
+ .tt-input {
+ border-radius: 0;
+}
+.input-group.input-group-sm .twitter-typeahead:first-child .tt-hint,
+.input-group.input-group-sm .twitter-typeahead:first-child .tt-input {
+ border-radius: 3px 0 0 3px;
+}
+.input-group.input-group-sm .twitter-typeahead:last-child .tt-hint,
+.input-group.input-group-sm .twitter-typeahead:last-child .tt-input {
+ border-radius: 0 3px 3px 0;
+}
+.input-group.input-group-lg .twitter-typeahead .tt-hint,
+.input-group.input-group-lg .twitter-typeahead .tt-input {
+ height: 46px;
+ padding: 10px 16px;
+ font-size: 18px;
+ line-height: 1.33;
+ border-radius: 6px;
+}
+select.input-group.input-group-lg .twitter-typeahead .tt-hint,
+select.input-group.input-group-lg .twitter-typeahead .tt-input {
+ height: 46px;
+ line-height: 46px;
+}
+select[multiple].input-group.input-group-lg .twitter-typeahead .tt-hint,
+select[multiple].input-group.input-group-lg .twitter-typeahead .tt-input,
+textarea.input-group.input-group-lg .twitter-typeahead .tt-hint,
+textarea.input-group.input-group-lg .twitter-typeahead .tt-input {
+ height: auto;
+}
+.input-group.input-group-lg
+ .twitter-typeahead:not(:first-child):not(:last-child)
+ .tt-hint,
+.input-group.input-group-lg
+ .twitter-typeahead:not(:first-child):not(:last-child)
+ .tt-input {
+ border-radius: 0;
+}
+.input-group.input-group-lg .twitter-typeahead:first-child .tt-hint,
+.input-group.input-group-lg .twitter-typeahead:first-child .tt-input {
+ border-radius: 6px 0 0 6px;
+}
+.input-group.input-group-lg .twitter-typeahead:last-child .tt-hint,
+.input-group.input-group-lg .twitter-typeahead:last-child .tt-input {
+ border-radius: 0 6px 6px 0;
+}
+.twitter-typeahead {
+ width: 100%;
+ float: left;
+}
+.input-group .twitter-typeahead {
+ display: table-cell !important;
+}
+.twitter-typeahead .tt-hint {
+ color: #999;
+}
+.twitter-typeahead .tt-input {
+ z-index: 2;
+}
+.twitter-typeahead .tt-input[disabled],
+.twitter-typeahead .tt-input[readonly],
+fieldset[disabled] .twitter-typeahead .tt-input {
+ cursor: not-allowed;
+ background-color: #eee !important;
+}
+.tt-dropdown-menu,
+.tt-menu {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: 1000;
+ min-width: 160px;
+ width: 100%;
+ padding: 5px 0;
+ margin: 2px 0 0;
+ list-style: none;
+ font-size: 14px;
+ background-color: #fff;
+ border: 1px solid #ccc;
+ border: 1px solid rgba(0, 0, 0, 0.15);
+ border-radius: 4px;
+ -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
+ background-clip: padding-box;
+}
+.tt-dropdown-menu .tt-suggestion,
+.tt-menu .tt-suggestion {
+ display: block;
+ padding: 3px 20px;
+ clear: both;
+ font-weight: 400;
+ line-height: 1.42857143;
+ color: #333;
+}
+.tt-dropdown-menu .tt-suggestion.tt-cursor,
+.tt-dropdown-menu .tt-suggestion:hover,
+.tt-menu .tt-suggestion.tt-cursor,
+.tt-menu .tt-suggestion:hover {
+ cursor: pointer;
+ text-decoration: none;
+ outline: 0;
+ background-color: #f5f5f5;
+ color: #262626;
+}
+.tt-dropdown-menu .tt-suggestion.tt-cursor a,
+.tt-dropdown-menu .tt-suggestion:hover a,
+.tt-menu .tt-suggestion.tt-cursor a,
+.tt-menu .tt-suggestion:hover a {
+ color: #262626;
+}
+.tt-dropdown-menu .tt-suggestion p,
+.tt-menu .tt-suggestion p {
+ margin: 0;
+}
diff --git a/v1/src/styles/simulator.scss b/v1/src/styles/simulator.scss
new file mode 100644
index 00000000..f6460422
--- /dev/null
+++ b/v1/src/styles/simulator.scss
@@ -0,0 +1,39 @@
+$fa-font-path: '../../../node_modules/@fortawesome/fontawesome-free/webfonts';
+@import '../../../node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss';
+@import '../../../node_modules/@fortawesome/fontawesome-free/scss/solid.scss';
+
+.subcircuitdialog {
+ display: none;
+ overflow-x: hidden;
+ overflow-y: auto;
+}
+
+.side {
+ width: 330px;
+ max-width: 500px;
+ min-width: 200px;
+ overflow-x: hidden;
+ overflow-y: scroll;
+}
+
+.report-sidebar a {
+ color: #fff;
+ font-size: 13px;
+ padding: 10px;
+ position: fixed;
+ right: -119px;
+ text-decoration: none;
+ bottom: 30px;
+ transition: 0.3s;
+ width: 160px;
+ z-index: 999;
+}
+
+.report-sidebar span {
+ font-size: 1.2em;
+ padding-right: 20px;
+}
+
+.report-sidebar a:hover {
+ right: 0;
+}
diff --git a/v1/src/styles/tutorials.scss b/v1/src/styles/tutorials.scss
new file mode 100644
index 00000000..59c4db7b
--- /dev/null
+++ b/v1/src/styles/tutorials.scss
@@ -0,0 +1,52 @@
+@import '/node_modules/driver.js/dist/driver.min.css';
+
+#driver-highlighted-element-stage {
+ background-color: transparent !important;
+}
+
+.driver-disabled {
+ border: 1.5px solid #ddd !important;
+}
+
+.driver-btn-group button {
+ font-family: 'Nunito', sans-serif !important;
+ font-size: 14px !important;
+ border: 1.5px solid #42b983 !important;
+ text-shadow: none !important;
+ border-radius: 0px !important;
+}
+
+.driver-btn-group button:hover {
+ font-family: 'Nunito', sans-serif !important;
+ background: #42b983 !important;
+ color: white !important;
+}
+
+.driver-close-btn {
+ font-family: 'Nunito', sans-serif !important;
+ font-size: 14px !important;
+ border: none !important;
+ border-radius: 0px !important;
+ text-shadow: none !important;
+ background: #dc5656 !important;
+ color: white !important;
+ margin: auto 3px !important;
+}
+
+.driver-popover-description,
+.driver-popover-title {
+ font-family: 'Nunito', sans-serif !important;
+}
+
+.bug-guide .right {
+ top: 114px !important;
+}
+
+.tourHelpStep.driver-popover-title {
+ display: none !important;
+}
+
+.driver-next-btn {
+ color: white !important;
+ background-color: #42b983 !important;
+}