updated green check mark
This commit is contained in:
parent
c833a741fb
commit
671acec218
7 changed files with 45 additions and 25 deletions
|
@ -56,6 +56,11 @@ body, .flex-container--column {
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.flex-container--left-bottom {
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: baseline;
|
||||||
|
}
|
||||||
|
|
||||||
.hidden {
|
.hidden {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
@ -72,6 +77,11 @@ h3, p {
|
||||||
font-size: x-large;
|
font-size: x-large;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.text--large {
|
||||||
|
font-size: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
.pull-quote {
|
.pull-quote {
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
|
@ -238,8 +248,7 @@ a, a:visited {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ALIGNMENT */
|
/* ALIGNMENT */
|
||||||
.
|
.align-content-left {
|
||||||
align-content-left {
|
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -262,7 +271,7 @@ align-content-left {
|
||||||
|
|
||||||
/* ERROR MESSAGES */
|
/* ERROR MESSAGES */
|
||||||
|
|
||||||
.info-message {
|
.info-message--success, .info-message--failure {
|
||||||
|
|
||||||
font-size: medium;
|
font-size: medium;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
|
@ -328,21 +337,22 @@ option {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.text--large {
|
#claim-name-input {
|
||||||
font-size: 2rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.url-text--primary, .url-text--secondary {
|
#input-success-claim-name {
|
||||||
margin:0px;
|
|
||||||
padding:0px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.url-text--primary {
|
.span--relative {
|
||||||
color: black;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.url-text--secondary {
|
.span--absolute {
|
||||||
color: #9b9b9b;
|
position: absolute;
|
||||||
|
bottom: 0px;
|
||||||
|
right: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* modifiers */
|
/* modifiers */
|
||||||
|
@ -378,6 +388,19 @@ option {
|
||||||
width: calc(100% - 1em - 2px);
|
width: calc(100% - 1em - 2px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.url-text--primary, .url-text--secondary {
|
||||||
|
margin:0px;
|
||||||
|
padding:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.url-text--primary {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.url-text--secondary {
|
||||||
|
color: #9b9b9b;
|
||||||
|
}
|
||||||
|
|
||||||
/* BUTTONS */
|
/* BUTTONS */
|
||||||
|
|
||||||
button {
|
button {
|
||||||
|
|
|
@ -76,7 +76,7 @@
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info-message {
|
.info-message--success, .info-message--failure {
|
||||||
font-size: small;
|
font-size: small;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
</form>
|
</form>
|
||||||
<div id="primary-dropzone" class="dropzone row row--margined row--padded row--tall flex-container flex-container--column flex-container--justify-center" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" ondragenter="dragenter_handler(event)" ondragleave="dragexit_handler(event)" onclick="triggerFileChooser('siofu_input', event)">
|
<div id="primary-dropzone" class="dropzone row row--margined row--padded row--tall flex-container flex-container--column flex-container--justify-center" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" ondragenter="dragenter_handler(event)" ondragleave="dragexit_handler(event)" onclick="triggerFileChooser('siofu_input', event)">
|
||||||
<div id="primary-dropzone-instructions">
|
<div id="primary-dropzone-instructions">
|
||||||
<p class="info-message-placeholder info-message info-message--failure" id="input-error-file-selection" hidden="true"></p>
|
<p class="info-message-placeholder info-message--failure" id="input-error-file-selection" hidden="true"></p>
|
||||||
<p>Drag & drop image or video here to publish</p>
|
<p>Drag & drop image or video here to publish</p>
|
||||||
<p class="fine-print">OR</p>
|
<p class="fine-print">OR</p>
|
||||||
<p class="blue--underlined">CHOOSE FILE</p>
|
<p class="blue--underlined">CHOOSE FILE</p>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<form id="publish-channel-form">
|
<form id="publish-channel-form">
|
||||||
<p id="input-error-channel-name" class="info-message-placeholder info-message info-message--failure"></p>
|
<p id="input-error-channel-name" class="info-message-placeholder info-message--failure"></p>
|
||||||
<div class="row row--wide row--short">
|
<div class="row row--wide row--short">
|
||||||
<div class="column column--3 column--sml-10">
|
<div class="column column--3 column--sml-10">
|
||||||
<label class="label" for="new-channel-name">Name:</label>
|
<label class="label" for="new-channel-name">Name:</label>
|
||||||
|
@ -7,7 +7,7 @@
|
||||||
<div class="input-text--primary">
|
<div class="input-text--primary">
|
||||||
<span>@</span>
|
<span>@</span>
|
||||||
<input type="text" name="new-channel-name" id="new-channel-name" class="input-text" placeholder="exampleChannelName" value="" oninput="checkChannelName(event.target.value)">
|
<input type="text" name="new-channel-name" id="new-channel-name" class="input-text" placeholder="exampleChannelName" value="" oninput="checkChannelName(event.target.value)">
|
||||||
<span id="input-success-channel-name" class="info-message info-message--success"></span>
|
<span id="input-success-channel-name" class="info-message--success"></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<form id="channel-login-form">
|
<form id="channel-login-form">
|
||||||
<p id="login-error-display-element" class="info-message-placeholder info-message info-message--failure"></p>
|
<p id="login-error-display-element" class="info-message-placeholder info-message--failure"></p>
|
||||||
<div class="row row--wide row--short">
|
<div class="row row--wide row--short">
|
||||||
<div class="column column--3 column--sml-10">
|
<div class="column column--3 column--sml-10">
|
||||||
<label class="label" for="channel-login-name-input">Name:</label>
|
<label class="label" for="channel-login-name-input">Name:</label>
|
||||||
|
|
|
@ -16,7 +16,7 @@
|
||||||
<div id="channel-select-options" {{#unless user}}hidden="true"{{/unless}}>
|
<div id="channel-select-options" {{#unless user}}hidden="true"{{/unless}}>
|
||||||
<div class="row row--padded row--no-top row--no-bottom row--wide">
|
<div class="row row--padded row--no-top row--no-bottom row--wide">
|
||||||
<!--error display-->
|
<!--error display-->
|
||||||
<p id="input-error-channel-select" class="info-message-placeholder info-message info-message--failure"></p>
|
<p id="input-error-channel-select" class="info-message-placeholder info-message--failure"></p>
|
||||||
<!--channel login/create select-->
|
<!--channel login/create select-->
|
||||||
<div class="column column--3">
|
<div class="column column--3">
|
||||||
<label class="label" for="channel-name-select">Channel:</label>
|
<label class="label" for="channel-name-select">Channel:</label>
|
||||||
|
|
|
@ -1,19 +1,16 @@
|
||||||
<div class="row row--padded row--wide">
|
<div class="row row--padded row--wide">
|
||||||
<!--error display-->
|
<!--error display-->
|
||||||
<p id="input-error-claim-name" class="info-message-placeholder info-message info-message--failure" hidden="true"></p>
|
<p id="input-error-claim-name" class="info-message-placeholder info-message--failure" hidden="true"></p>
|
||||||
<!--url selection-->
|
<!--url selection-->
|
||||||
<div class="column column--3 column--sml-10">
|
<div class="column column--3 column--sml-10">
|
||||||
<label class="label">URL:</label>
|
<label class="label">URL:</label>
|
||||||
</div><div class="column column--7 column--sml-10">
|
</div><div class="column column--7 column--sml-10 input-text--primary span--relative">
|
||||||
<div class="input-text--primary">
|
|
||||||
<span class="url-text--secondary">spee.ch /</span>
|
<span class="url-text--secondary">spee.ch /</span>
|
||||||
<span id="url-channel" class="url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>
|
<span id="url-channel" class="url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>
|
||||||
<span id="url-no-channel-placeholder" class="url-text--secondary tooltip" {{#if user}}hidden="true"{{else}}{{/if}}>xyz<span class="tooltip-text">This will be a random id</span></span>
|
<span id="url-no-channel-placeholder" class="url-text--secondary tooltip" {{#if user}}hidden="true"{{else}}{{/if}}>xyz<span class="tooltip-text">This will be a random id</span></span>
|
||||||
<span id="url-channel-placeholder" class="url-text--secondary tooltip" hidden="true">@channel<span class="tooltip-text">Select a channel above</span></span>
|
<span id="url-channel-placeholder" class="url-text--secondary tooltip" hidden="true">@channel<span class="tooltip-text">Select a channel above</span></span> /
|
||||||
/
|
|
||||||
<input type="text" id="claim-name-input" class="input-text" placeholder="your-url-here" oninput="checkClaimName(event.target.value)">
|
<input type="text" id="claim-name-input" class="input-text" placeholder="your-url-here" oninput="checkClaimName(event.target.value)">
|
||||||
<span id="input-success-claim-name" class="info-message info-message--success"></span>
|
<span id="input-success-claim-name" class="info-message--success span--absolute"></span>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
Loading…
Reference in a new issue