@openhab-ui/setup-and-maintenance/css/rule.css

Configuration and maintenance interface for openHAB

.fullflex,main.rule,nav.sidebar.rule{display:flex;flex-direction:column}.fullflex{flex:1}.fullflex>form{margin-top:20px;display:grid;align-items:center;grid-template-areas:"l1 rulename l2 ruleuid" "l3 desc desc desc" "l4 tags buttons buttons";grid-template-columns:min-content 1fr min-content auto;grid-gap:10px}.fullflex>form label[for=rulename]{grid-area:l1}.fullflex>form #rulename{grid-area:rulename}.fullflex>form label[for=ruleuid]{grid-area:l2}.fullflex>form #ruleuid{grid-area:ruleuid}.fullflex>form label[for=ruledescription]{grid-area:l3}.fullflex>form #ruledescription{grid-area:desc}.fullflex>form label[for=ruletags]{grid-area:l4}.fullflex>form #ruletags{grid-area:tags;padding:0;height:initial}.fullflex>form .buttons{justify-self:flex-end;grid-area:buttons}.search{position:sticky;z-index:10;width:-moz-available;width:-webkit-fill-available;width:fill-available;height:initial}.rete-background{position:absolute;width:100%;height:100%}.rete-background.default{background-size:32px 32px;background-image:linear-gradient(to right,#ccc 1px,transparent 1px),linear-gradient(to bottom,#ccc 1px,transparent 1px)}.moduletypelist{display:grid;grid-gap:10px;padding:10px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.moduletype{min-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.connection{overflow:visible!important}.connection .main-path{fill:none;stroke-width:5px;stroke:#f4c37d}.socket{background:#ff7214;display:inline-block;cursor:pointer;border:1px solid #fff;border-radius:12px;width:24px;height:24px;margin:6px;vertical-align:middle;z-index:2;box-sizing:border-box}.socket:hover{border-width:4px}.socket.multiple{border-color:#ff0}.socket.output{margin-right:-12px}.socket.input{margin-left:-12px}h3.trigger{border-bottom:1px solid var(--success)}h3.condition{border-bottom:1px solid var(--info)}h3.action{border-bottom:1px solid var(--danger)}.node.trigger{border:1px solid var(--success)}.node.condition{border:1px solid var(--info)}.node.action{border:1px solid var(--danger)}.node.action::after,.node.action::before,.node.condition::before,.node.trigger::after{content:"";transition:opacity .5s;width:20px;position:absolute;top:-1px;bottom:-1px;z-index:-2;opacity:.1}.node.action::before,.node.condition::before{left:-20px;clip-path:polygon(100% 50%,0 0,100% 0,100% 100%,0 100%)}.node.action:hover::after,.node.action:hover::before,.node.condition:hover::before,.node.trigger:hover::after{opacity:1}.node.action::after,.node.trigger::after{right:-20px;clip-path:polygon(0% 0,100% 50%,0% 100%)}.node.trigger::after,.node.trigger::before{background-color:var(--success)}.node.action::after,.node.action::before{background-color:var(--danger)}.node.condition::after,.node.condition::before{background-color:var(--info)}.nodewrapper{position:absolute;z-index:0;display:flex}.node{border:1px solid transparent;transition:box-shadow 135ms cubic-bezier(.4,0,.2,1);color:var(--color);background-color:var(--card-bg);min-width:192px;min-height:96px;box-sizing:content-box;position:relative;user-select:none;display:grid;grid-gap:10px;grid-template-areas:"title title title" "input control output" "actions actions actions";grid-template-rows:min-content 1fr min-content;grid-template-columns:min-content 1fr min-content}.node:hover{box-shadow:0 1px 3px 1px rgba(60,64,67,.2),0 2px 8px 4px rgba(60,64,67,.1)}.node.selected{background:#ffd92c;border-color:#e3c000}.node .title{grid-area:title;color:var(--color);font-family:sans-serif;font-size:18px;padding:8px;max-width:300px}.node .title>div:nth-of-type(2){font-size:12px}.node .output{grid-area:output;text-align:right}.node .input>div,.node .output>div{white-space:nowrap}.node .input{grid-area:input;text-align:left}.node .input-title,.node .output-title{vertical-align:middle;color:#000;display:inline-block;font-family:sans-serif;font-size:14px;line-height:24px;overflow-x:hidden;max-width:80px;text-overflow:ellipsis}.node .input-control{z-index:1;width:calc(100% - 36px);vertical-align:middle;display:inline-block}.node .control{grid-area:control;display:grid;grid-template-columns:min-content minmax(auto,230px);grid-template-rows:min-content;align-items:flex-start;grid-gap:10px;min-width:300px}.node .control label{min-width:60px;max-width:105px}.node .control label,.node .control ui-switch{overflow-x:hidden;text-overflow:ellipsis;white-space:nowrap}.node .actions{grid-area:actions;display:flex;margin-bottom:5px;margin-right:5px;margin-left:5px}oh-rule-components{flex:1;overflow-y:auto}.remove{float:right;font-size:1.7rem;left:10px;top:-10px}#scripteditor{display:grid;grid-template-areas:"buttonbar buttonbar" "editor snippets";grid-template-rows:min-content auto;grid-template-columns:1fr 200px;background-color:var(--background-color);border-radius:5px;box-shadow:0 1px 1px 0 rgba(60,64,67,.08),0 1px 3px 1px rgba(60,64,67,.16)}#scripteditor>.buttonbar{grid-area:buttonbar;display:flex;align-items:center}#scripteditor>.snippets{grid-area:snippets}#scripteditor>.snippets ul{list-style:none}#scripteditor>ui-codeeditor{grid-area:editor;flex:1;display:block;margin:10px;border-radius:10px}:not(.wide) nav oh-vue-list>div{padding-left:20px;padding-right:20px;max-height:calc(100vh - 180px);overflow-y:auto}.wide nav oh-vue-list>div{max-height:calc(100vh - 180px);overflow-y:scroll}