Added minimal functionality for Robot teaching
- Added minimal HMI - Added possibility to open and close all chamber doors
This commit is contained in:
456
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiLinearGauge/Style.css
vendored
Normal file
456
Packages/Beckhoff.TwinCAT.HMI.Controls.14.4.1/runtimes/native1.12-tchmi/TcHmiLinearGauge/Style.css
vendored
Normal file
@@ -0,0 +1,456 @@
|
||||
/** Styles for all themes */
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge,
|
||||
.tchmi-linear-gauge {
|
||||
padding: 8px 25px;
|
||||
/* Prevent overflow if the border radius is huge */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template,
|
||||
.tchmi-linear-gauge-template {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels,
|
||||
.tchmi-linear-gauge-template-labels {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span,
|
||||
.tchmi-linear-gauge-template-labels span {
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span.hidden,
|
||||
.tchmi-linear-gauge-template-labels span.hidden {
|
||||
visibility: hidden;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span.first,
|
||||
.tchmi-linear-gauge-template-labels span.first {
|
||||
transform: translateX(calc(-50% + 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span.last,
|
||||
.tchmi-linear-gauge-template-labels span.last {
|
||||
transform: translateX(calc(-50% - 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-ticks,
|
||||
.tchmi-linear-gauge-template-ticks {
|
||||
flex-basis: 10px;
|
||||
flex-shrink: 0;
|
||||
margin: 2px 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick,
|
||||
.tchmi-linear-gauge-template-tick {
|
||||
width: 2px;
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.major,
|
||||
.tchmi-linear-gauge-template-tick.major {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.minor,
|
||||
.tchmi-linear-gauge-template-tick.minor {
|
||||
height: 60%;
|
||||
top: 40%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.first,
|
||||
.tchmi-linear-gauge-template-tick.first {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.last,
|
||||
.tchmi-linear-gauge-template-tick.last {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-track,
|
||||
.tchmi-linear-gauge-template-track {
|
||||
flex-grow: 1;
|
||||
flex-shrink: 0;
|
||||
flex-basis: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-filler,
|
||||
.tchmi-linear-gauge-template-filler {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-filler.inverted,
|
||||
.tchmi-linear-gauge-template-filler.inverted {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
right: 0;
|
||||
transform-origin: right;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-knob,
|
||||
.tchmi-linear-gauge-template-knob {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
overflow: visible;
|
||||
background: transparent;
|
||||
z-index: 2;
|
||||
display: none;
|
||||
cursor: ew-resize;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-range,
|
||||
.tchmi-linear-gauge-template-range {
|
||||
flex-basis: 5px;
|
||||
flex-shrink: 0;
|
||||
margin: 2px 0;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-rangechild,
|
||||
.tchmi-linear-gauge-template-rangechild {
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-description,
|
||||
.tchmi-linear-gauge-template-description {
|
||||
margin: 2px 0 3px 0;
|
||||
color: #4993da;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-value .content,
|
||||
.tchmi-linear-gauge-template-value .content {
|
||||
text-align: right;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-value .hidden,
|
||||
.tchmi-linear-gauge-template-value .hidden {
|
||||
visibility: hidden;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit .content,
|
||||
.tchmi-linear-gauge-template-unit .content {
|
||||
width: 16px;
|
||||
white-space: nowrap;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/* Overrides for reverse flex */
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template.flex-reverse,
|
||||
.tchmi-linear-gauge-template.flex-reverse {
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template.flex-reverse
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.minor,
|
||||
.tchmi-linear-gauge-template.flex-reverse .tchmi-linear-gauge-template-tick.minor {
|
||||
top: auto;
|
||||
}
|
||||
|
||||
/* Overrides for vertical orientation*/
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical,
|
||||
.tchmi-linear-gauge.vertical {
|
||||
padding: 20px 10px;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .flex-reverse,
|
||||
.tchmi-linear-gauge.vertical .flex-reverse {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-labels {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-labels span {
|
||||
transform: translateY(50%);
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span.first,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-labels span.first {
|
||||
transform: translateY(calc(50% - 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels span.last,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-labels span.last {
|
||||
transform: translateY(calc(50% + 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical
|
||||
.flex-reverse
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-labels
|
||||
span,
|
||||
.tchmi-linear-gauge.vertical .flex-reverse .tchmi-linear-gauge-template-labels span {
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-ticks,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-ticks {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-tick {
|
||||
height: 2px;
|
||||
transform: translateY(50%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.major,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-tick.major {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.minor,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-tick.minor {
|
||||
width: 60%;
|
||||
left: 40%;
|
||||
top: auto;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical
|
||||
.flex-reverse
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.minor,
|
||||
.tchmi-linear-gauge.vertical .flex-reverse .tchmi-linear-gauge-template-tick.minor {
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.first,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-tick.first {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-tick.last,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-tick.last {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-filler,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-filler {
|
||||
width: 100%;
|
||||
height: 0;
|
||||
bottom: 0;
|
||||
transform-origin: bottom;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-filler.inverted,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-filler.inverted {
|
||||
width: 100%;
|
||||
height: 0;
|
||||
top: 0;
|
||||
transform-origin: top;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-knob,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-knob {
|
||||
left: 50%;
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
cursor: ns-resize;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-range,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-range {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-rangechild,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-rangechild {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-description,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-description {
|
||||
margin: 0 3px 0 2px;
|
||||
flex-direction: column-reverse;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-value,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-value {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-value .content,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-value .content {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-value .hidden,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-value .hidden {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical
|
||||
.flex-reverse
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit,
|
||||
.tchmi-linear-gauge.vertical .flex-reverse .tchmi-linear-gauge-template-unit {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit
|
||||
.content:not(.horizontal),
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit .content.vertical,
|
||||
.tchmi-linear-gauge.vertical .tchmi-linear-gauge-template-unit .content:not(.horizontal),
|
||||
.tchmi-linear-gauge-template-unit .content.vertical {
|
||||
display: inline-block;
|
||||
transform: rotateZ(-90deg);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge:not(.vertical)
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit
|
||||
.content.vertical,
|
||||
.tchmi-linear-gauge:not(.vertical) .tchmi-linear-gauge-template-unit .content.vertical {
|
||||
width: auto !important;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge:not(.vertical)
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-unit
|
||||
.content.vertical::after,
|
||||
.tchmi-linear-gauge:not(.vertical) .tchmi-linear-gauge-template-unit .content.vertical::after {
|
||||
content: '';
|
||||
display: block;
|
||||
padding: 50% 0;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.TcHmi_Controls_System_TcHmiControl-operate-disallowed
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-template-knob,
|
||||
.tchmi-linear-gauge.TcHmi_Controls_System_TcHmiControl-operate-disallowed .tchmi-linear-gauge-template-knob {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge-invalid-notification {
|
||||
position: absolute;
|
||||
width: 30px; /* is used for internal calc*/
|
||||
height: 30px; /* is used for internal calc*/
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .container-markers-label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .container-markers-label {
|
||||
justify-content: right;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .container-single-marker-label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .container-single-marker-label {
|
||||
flex-direction: row;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-label {
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-triangle {
|
||||
position: relative;
|
||||
width: 0;
|
||||
height: 0;
|
||||
align-self: center;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
border-bottom: 10px solid;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-triangle.reverse {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .marker-triangle {
|
||||
transform: rotate(90deg);
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .marker-triangle.reverse {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .container-marker-lines {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-line {
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .marker-line {
|
||||
height: 2px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-line.first {
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .marker-line.last {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .marker-line.first {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .marker-line.last {
|
||||
transform: translateY(100%);
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .container-single-marker-label.first {
|
||||
transform: translateX(calc(-50% + 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge .container-single-marker-label.last {
|
||||
transform: translateX(calc(-50% - 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .container-single-marker-label.first {
|
||||
transform: translateY(calc(50% - 1px));
|
||||
}
|
||||
|
||||
.TcHmi_Controls_Beckhoff_TcHmiLinearGauge.vertical .container-single-marker-label.last {
|
||||
transform: translateY(calc(50% + 1px));
|
||||
}
|
||||
Reference in New Issue
Block a user