added placeholders for error text
This commit is contained in:
parent
7ee3051b5d
commit
901e83b766
12 changed files with 144 additions and 19 deletions
|
@ -1,3 +1,22 @@
|
|||
@font-face {
|
||||
font-family: 'Lekton';
|
||||
src: url('../font/Lekton/Lekton-Regular.ttf');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Lekton';
|
||||
src: url('../font/Lekton/Lekton-Bold.ttf');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Lekton';
|
||||
src: url('../font/Lekton/Lekton-Italic.ttf');
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
@ -13,8 +32,8 @@ html, body {
|
|||
/* TEXT */
|
||||
|
||||
body, button, input, textarea, label, select, option {
|
||||
font-family: monospace;
|
||||
font-size: large;
|
||||
font-family: 'Lekton', monospace;
|
||||
font-size: medium;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
|
@ -92,7 +111,6 @@ h2 {
|
|||
}
|
||||
|
||||
.h2--secondary {
|
||||
font-weight: normal;
|
||||
color: lightgrey;
|
||||
}
|
||||
|
||||
|
@ -210,6 +228,11 @@ h3 {
|
|||
color: red;
|
||||
}
|
||||
|
||||
.info-message-placeholder {
|
||||
display: block;
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
/* INPUT FIELDS */
|
||||
|
||||
/* blocks */
|
||||
|
@ -397,6 +420,7 @@ table {
|
|||
}
|
||||
|
||||
.nav-bar-link {
|
||||
font-weight: normal;
|
||||
border-bottom: 2px solid white;
|
||||
}
|
||||
.nav-bar-link:hover {
|
||||
|
@ -405,7 +429,7 @@ table {
|
|||
|
||||
.nav-bar-link--active {
|
||||
color: #1e90ff;
|
||||
border-bottom: 2px solid #1e90ff;
|
||||
border-bottom: 2px solid dodgerblue;
|
||||
}
|
||||
|
||||
/* PUBLISH FORM */
|
||||
|
@ -418,13 +442,13 @@ table {
|
|||
|
||||
.dropzone:hover {
|
||||
border: 2px dashed #1e90ff;
|
||||
background-color: lightgrey;
|
||||
background-color: gainsboro;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dropzone--drag-over {
|
||||
background-color: lightgrey;
|
||||
border: 2px dashed #1e90ff;
|
||||
background-color: gainsboro;
|
||||
border: 2px dashed dodgerblue;
|
||||
}
|
||||
|
||||
#primary-dropzone-wrapper, #publish-form-wrapper {
|
||||
|
|
BIN
public/assets/font/Lekton/Lekton-Bold.ttf
Normal file
BIN
public/assets/font/Lekton/Lekton-Bold.ttf
Normal file
Binary file not shown.
BIN
public/assets/font/Lekton/Lekton-Italic.ttf
Normal file
BIN
public/assets/font/Lekton/Lekton-Italic.ttf
Normal file
Binary file not shown.
BIN
public/assets/font/Lekton/Lekton-Regular.ttf
Normal file
BIN
public/assets/font/Lekton/Lekton-Regular.ttf
Normal file
Binary file not shown.
93
public/assets/font/Lekton/OFL.txt
Normal file
93
public/assets/font/Lekton/OFL.txt
Normal file
|
@ -0,0 +1,93 @@
|
|||
Copyright (c) 2008-2010, Isia Urbino (http://www.isiaurbino.net)
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font creation
|
||||
efforts of academic and linguistic communities, and to provide a free and
|
||||
open framework in which fonts may be shared and improved in partnership
|
||||
with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply
|
||||
to any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software components as
|
||||
distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
||||
or substituting -- in part or in whole -- any of the components of the
|
||||
Original Version, by changing formats or by porting the Font Software to a
|
||||
new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
||||
redistribute, and sell modified and unmodified copies of the Font
|
||||
Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components,
|
||||
in Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the corresponding
|
||||
Copyright Holder. This restriction only applies to the primary font name as
|
||||
presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created
|
||||
using the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
|
@ -137,7 +137,7 @@ function checkChannelName(name){
|
|||
const successDisplayElement = document.getElementById('input-success-channel-name');
|
||||
const errorDisplayElement = document.getElementById('input-error-channel-name');
|
||||
name = `@${name}`;
|
||||
checkAvailability(name, successDisplayElement, errorDisplayElement, validateChannelName, isNameAvailable, 'Sorry, that Channel name has been taken by another user', '/api/isChannelAvailable/');
|
||||
checkAvailability(name, successDisplayElement, errorDisplayElement, validateChannelName, isNameAvailable, 'Sorry, that name has already been taken', '/api/isChannelAvailable/');
|
||||
}
|
||||
|
||||
// validation function which checks all aspects of the publish submission
|
||||
|
|
|
@ -5,12 +5,14 @@
|
|||
<div id="primary-dropzone-wrapper">
|
||||
<div id="primary-dropzone" class="dropzone" 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 class="info-message-placeholder">
|
||||
<div class="info-message-placeholder"><div class="info-message info-message--failure" id="input-error-file-selection" hidden="true"></div></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<p>Drag & drop image or video here</p>
|
||||
<p>OR</p>
|
||||
<label class="input-file-label">CHOOSE FILE</label>
|
||||
</div>
|
||||
<div class="info-message info-message--failure" id="input-error-file-selection" hidden="true"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,4 +0,0 @@
|
|||
<div>
|
||||
<h2>Bugs</h2>
|
||||
<p>Spee.ch is young and under continuous development so it will have bugs. Please leave an issue on our <a href="https://github.com/lbryio/spee.ch">github</a> if you experience a problem or have suggestions.</p>
|
||||
</div>
|
|
@ -3,7 +3,9 @@
|
|||
<div class="column column--3 column--sml-10">
|
||||
<label class="label" for="new-channel-name">Name:</label>
|
||||
</div><div class="column column--6 column--sml-10">
|
||||
<div class="info-message-placeholder">
|
||||
<div id="input-error-channel-name" class="info-message info-message--failure"></div>
|
||||
</div>
|
||||
<div class="input-text--primary">
|
||||
<span>@</span>
|
||||
<input type="text" name="new-channel-name" id="new-channel-name" class="input-text" placeholder="exampleChannelName" value="" oninput="checkChannelName(event.target.value)">
|
||||
|
@ -15,7 +17,9 @@
|
|||
<div class="column column--3 column--sml-10">
|
||||
<label class="label" for="new-channel-password">Password:</label>
|
||||
</div><div class="column column--6 column--sml-10">
|
||||
<div class="info-message-placeholder">
|
||||
<div id="input-error-channel-password" class="info-message info-message--failure"></div>
|
||||
</div>
|
||||
<div class="input-text--primary">
|
||||
<input type="password" name="new-channel-password" id="new-channel-password" class="input-text" placeholder="" value="" >
|
||||
</div>
|
||||
|
|
|
@ -3,7 +3,9 @@
|
|||
<div class="column column--3 column--sml-10">
|
||||
<label class="label" for="channel-login-name-input">Name:</label>
|
||||
</div><div class="column column--6 column--sml-10">
|
||||
<div class="info-message-placeholder">
|
||||
<div id="login-error-display-element" class="info-message info-message--failure"></div>
|
||||
</div>
|
||||
<div class="input-text--primary">
|
||||
<span>@</span>
|
||||
<input type="text" id="channel-login-name-input" class="input-text" placeholder="" value="">
|
||||
|
|
|
@ -19,7 +19,9 @@
|
|||
<div class="column column--3 column--sml-10">
|
||||
<label class="label" for="channel-name-select">Channel:</label>
|
||||
</div><div class="column column--7 column--sml-10">
|
||||
<div class="info-message-placeholder">
|
||||
<div id="input-error-channel-select" class="info-message info-message--failure"></div>
|
||||
</div>
|
||||
<select type="text" id="channel-name-select" class="select select--primary select--arrow" onchange="toggleSelectedChannel(event.target.selectedOptions[0].value)">
|
||||
{{#if user}}
|
||||
<option value="{{user.channelName}}" id="publish-channel-select-channel-option">{{user.channelName}}</option>
|
||||
|
|
|
@ -3,7 +3,9 @@
|
|||
<div class="column column--3 column--sml-10">
|
||||
<label class="label">URL:</label>
|
||||
</div><div class="column column--6 column--sml-10">
|
||||
<div class="info-message-placeholder">
|
||||
<div id="input-error-claim-name" class="info-message info-message--failure" hidden="true"></div>
|
||||
</div>
|
||||
<div class="input-text--primary">
|
||||
<span class="url-text url-text--secondary">Spee.ch /</span>
|
||||
<span id="url-channel" class="url-text url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>
|
||||
|
|
Loading…
Reference in a new issue