/** * InteractiveWritePrompt */ .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid { width: 500px; display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: auto auto auto; column-gap: 20px; grid-template-areas: 'user reviewer' 'value value' 'ainfo ainfo'; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid:has( .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Reviewer[style*='display: none'] ) { grid-template-areas: 'user value' 'ainfo ainfo'; grid-template-rows: auto auto; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid:has( .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-User[style*='display: none'] ) { grid-template-columns: 1fr; grid-template-areas: 'value' 'ainfo'; grid-template-rows: auto auto; } @media (max-width: 640px) { .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid { width: 250px; grid-template-columns: 1fr; grid-template-areas: 'user' 'reviewer' 'value' 'ainfo'; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid:has( .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Reviewer[style*='display: none'] ) { grid-template-areas: 'user' 'value' 'ainfo'; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Grid:has( .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-User[style*='display: none'] ) { grid-template-areas: 'value' 'ainfo'; } } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-User { grid-area: user; width: 240px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Reviewer { grid-area: reviewer; width: 240px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Value { grid-area: value; width: 240px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Content-Container-Additional-Information { grid-area: ainfo; min-width: 240px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Symbol-Headline-Container h2 { margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Symbol-Headline-Container { display: flex; align-items: center; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Symbol-Progress-Container { width: 20px; height: 20px; margin-left: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner-Container-Container { width: 64px; height: 64px; margin-left: -22px; margin-top: -22px; transform: scale(0.25); } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Message { margin-bottom: 10px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Auth-Input-Username { margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Auth-Combobox-Username { margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Auth-Input-Password { margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Textblock-PrevValue { margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Editor-Container { min-width: 240px; height: 26px; margin-bottom: 5px; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Auth-Textbox-Comment { margin-bottom: 5px; } /** Loading Spinner Usage:
*/ @keyframes TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner-Container { position: relative; width: 100%; height: 100%; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner { display: inline-block; width: 64px; height: 64px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; max-width: 100%; max-height: 100%; overflow: hidden; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner div { box-sizing: border-box; display: block; position: absolute; width: 51px; height: 51px; margin: 6px; border: 6px solid var(--TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner-Color); border-radius: 50%; animation: TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: var(--TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner-Color) transparent transparent transparent; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner div:nth-child(1) { animation-delay: -0.45s; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner div:nth-child(2) { animation-delay: -0.3s; } .TcHmi_Controls_Helpers_Popup_InteractiveWritePrompt-Loading-Spinner div:nth-child(3) { animation-delay: -0.15s; }