mirror of
https://github.com/owncast/owncast.git
synced 2024-11-29 19:49:31 +03:00
streamkey field style update
This commit is contained in:
parent
ad00991f93
commit
3db97f1bec
3 changed files with 18 additions and 18 deletions
|
@ -97,7 +97,7 @@ export const TEXTFIELD_PROPS_STREAM_KEY = {
|
||||||
maxLength: TEXT_MAXLENGTH,
|
maxLength: TEXT_MAXLENGTH,
|
||||||
placeholder: 'abc123',
|
placeholder: 'abc123',
|
||||||
label: 'Stream Key',
|
label: 'Stream Key',
|
||||||
tip: 'Secret stream key',
|
tip: 'Save this key somewhere safe, you will need it to stream or login to the admin dashboard!',
|
||||||
required: true,
|
required: true,
|
||||||
};
|
};
|
||||||
export const TEXTFIELD_PROPS_FFMPEG = {
|
export const TEXTFIELD_PROPS_FFMPEG = {
|
||||||
|
|
|
@ -75,16 +75,18 @@ export default function EditInstanceDetails() {
|
||||||
onChange={handleFieldChange}
|
onChange={handleFieldChange}
|
||||||
/>
|
/>
|
||||||
<div className="streamkey-actions">
|
<div className="streamkey-actions">
|
||||||
<Tooltip className="copy-tooltip" title="Copied!" trigger="" visible={copyIsVisible}>
|
<Tooltip title="Generate a stream key">
|
||||||
|
<Button icon={<RedoOutlined />} size="small" onClick={generateStreamKey} />
|
||||||
|
</Tooltip>
|
||||||
|
|
||||||
|
<Tooltip
|
||||||
|
className="copy-tooltip"
|
||||||
|
title={copyIsVisible ? 'Copied!' : 'Copy to clipboard'}
|
||||||
|
>
|
||||||
<Button icon={<CopyOutlined />} size="small" onClick={copyStreamKey} />
|
<Button icon={<CopyOutlined />} size="small" onClick={copyStreamKey} />
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
<Button icon={<RedoOutlined />} size="small" onClick={generateStreamKey} />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="streamkey-notice">
|
|
||||||
Save this key somewhere safe, you will need it to stream or login to the admin
|
|
||||||
dashboard!
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<TextFieldWithSubmit
|
<TextFieldWithSubmit
|
||||||
fieldName="ffmpegPath"
|
fieldName="ffmpegPath"
|
||||||
|
|
|
@ -355,6 +355,10 @@
|
||||||
|
|
||||||
|
|
||||||
.field-streamkey-container {
|
.field-streamkey-container {
|
||||||
|
margin-bottom: 1.5em;
|
||||||
|
.field-tip {
|
||||||
|
color: var(--ant-warning);
|
||||||
|
}
|
||||||
.left-side {
|
.left-side {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
@ -362,21 +366,15 @@
|
||||||
}
|
}
|
||||||
.textfield-with-submit-container {
|
.textfield-with-submit-container {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
.textfield-container {
|
|
||||||
max-width: 400px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.streamkey-actions {
|
.streamkey-actions {
|
||||||
max-width: 90px;
|
white-space: nowrap;
|
||||||
button {
|
button {
|
||||||
margin: .25em;
|
margin: .25em;
|
||||||
}
|
}
|
||||||
}
|
@media (max-width: 800px) {
|
||||||
.streamkey-notice {
|
margin-top: 2em;
|
||||||
font-size: 0.75em;
|
}
|
||||||
color: var(--ant-error);
|
|
||||||
margin-left: 12em;
|
|
||||||
margin-bottom: 1em;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in a new issue