Add content hub and a11y changes from Drupal git

See Drupal 7 git for git history for these commits.
pull/92/head
Thomas Marstrander 2020-08-28 10:30:06 +02:00
parent 35eb39c469
commit fb6278744c
No known key found for this signature in database
GPG Key ID: 59D7F1EC8B90E9A6
15 changed files with 1401 additions and 5 deletions

BIN
fonts/h5p-core-26.eot Normal file

Binary file not shown.

112
fonts/h5p-core-26.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 93 KiB

BIN
fonts/h5p-core-26.ttf Normal file

Binary file not shown.

BIN
fonts/h5p-core-26.woff Normal file

Binary file not shown.

BIN
fonts/h5p-hub-publish.eot Normal file

Binary file not shown.

38
fonts/h5p-hub-publish.svg Normal file
View File

@ -0,0 +1,38 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
<json>
<![CDATA[
{
"fontFamily": "h5p-hub",
"description": "Font generated by IcoMoon.",
"majorVersion": 1,
"minorVersion": 3,
"version": "Version 1.3",
"fontId": "h5p-hub",
"psName": "h5p-hub",
"subFamily": "Regular",
"fullName": "h5p-hub"
}
]]>
</json>
</metadata>
<defs>
<font id="h5p-hub" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="dropdown" data-tags="dropdown" d="M1004.654 717.002c-11.526 11.526-27.853 19.209-45.142 19.209h-895.161c-35.538 0-63.391-27.853-64.352-63.391 0-17.289 6.724-33.616 19.209-46.103l447.582-447.582c24.013-24.972 63.391-25.933 88.363-1.92 0.961 0.961 0.961 0.961 1.92 1.92l447.582 447.582c24.972 24.013 25.933 63.391 1.92 88.363-0.961 0.961-0.961 0.961-1.92 1.92z" />
<glyph unicode="&#xe901;" glyph-name="info" data-tags="info" d="M745.14 76.307c-0.699 25.827-20.941 46.069-46.768 46.768h-46.069v418.813c-1.395 25.827-21.639 46.069-46.768 46.069h-279.209c-25.827 0-46.768-20.941-47.465-46.768v-92.837c0.699-25.827 20.941-46.069 46.768-46.768h46.768v-279.209h-46.069c-25.827-0.699-46.069-20.941-46.768-46.768v-92.837c0.699-25.827 20.941-46.069 46.768-46.768h372.045c25.827 0.699 46.069 20.941 46.768 46.768v93.534zM638.343 946.041c-8.376 9.075-20.242 13.96-32.806 13.96h-185.673c-25.827-0.699-46.069-20.941-46.768-46.768v-139.604c0.699-25.827 20.941-46.069 46.768-46.768h186.372c25.129 1.395 45.371 21.639 46.069 46.768v139.604c0 12.564-5.584 24.43-13.96 32.806z" />
<glyph unicode="&#xe902;" glyph-name="thick-arrow" data-tags="thick-arrow" d="M997.162 446.653c0.634 22.167-8.234 44.336-24.701 59.537l-428.789 428.789c-32.302 32.936-85.505 33.568-118.44 0.634 0 0-0.634-0.634-0.634-0.634l-49.403-49.403c-32.936-32.302-32.936-84.871-1.266-117.806 0.634-0.634 0.634-0.634 1.266-1.266l192.544-193.81h-463.625c-21.535 0.634-41.802-8.234-55.737-24.701-14.567-16.467-22.167-38.002-21.535-59.537v-84.238c-0.634-21.535 6.967-43.068 21.535-59.537 13.935-16.467 34.202-25.335 55.737-24.701h464.259l-193.81-190.644c-32.936-32.936-33.568-86.138-0.634-119.073 0 0 0.634-0.634 0.634-0.634l49.403-49.403c32.936-32.302 86.138-32.302 119.073 0l429.423 429.423c15.201 15.201 24.067 35.468 24.701 57.003v0z" />
<glyph unicode="&#xe903;" glyph-name="check" data-tags="check" d="M1021.469 686.541c0 17.084-6.328 32.903-18.349 44.924l-89.849 89.215c-24.677 24.677-64.539 24.677-89.215 0.633 0 0 0 0-0.633-0.633l-432.156-432.79-193.616 194.25c-24.677 24.677-64.539 24.677-89.215 0.633 0 0 0 0-0.633-0.633l-89.215-89.215c-24.677-24.677-24.677-64.539-0.633-89.215 0 0 0 0 0.633-0.633l327.755-327.755c24.677-24.677 64.539-24.677 89.215-0.633 0 0 0 0 0.633 0.633l569.46 569.46c12.022 12.022 18.349 27.84 18.349 44.924v0l-2.531-3.163z" />
<glyph unicode="&#xe904;" glyph-name="close" data-tags="close" d="M1024 856.869l-103.131 103.131-408.869-408.869-408.869 408.869-103.131-103.131 408.869-408.869-408.869-408.869 103.131-103.131 408.869 408.869 408.869-408.869 103.131 103.131-408.869 408.869z" />
<glyph unicode="&#xe905;" glyph-name="plus" data-tags="plus" d="M597.333 533.333v426.667h-170.667v-426.667h-426.667v-170.667h426.667v-426.667h170.667v426.667h426.667v170.667z" />
<glyph unicode="&#xe906;" glyph-name="filters" data-tags="filters" d="M217.543 834.589v98.249c0 14.999-12.163 27.162-27.162 27.162h-8.785c-14.999 0-27.162-12.163-27.162-27.162v-98.249c-63.792-14.19-110.78-70.3-110.78-137.38s46.988-123.189 109.844-137.208l0.936-592.841c0-14.999 12.163-27.162 27.162-27.162h7.99c14.999 0 27.162 12.163 27.162 27.162v588.669c69.551 9.191 122.666 68.109 122.666 139.435 0 71.041-52.699 129.772-121.13 139.246zM549.82 417.644v515.184c0 14.999-12.163 27.162-27.162 27.162h-4.796c-14.999 0-27.162-12.163-27.162-27.162v-513.593c-71.358-12.114-125.020-73.469-125.020-147.364s53.662-135.26 124.145-147.242l0.884-159.869c0-14.999 12.163-27.162 27.162-27.162h4.796c14.999 0 27.162 12.163 27.162 27.162v159.745c67.325 15.43 116.8 74.826 116.8 145.772s-49.464 130.342-115.794 145.579zM980.345 594.96c-0.075 69.212-51.022 126.499-117.453 136.489l-0.764 201.379c0 14.999-12.163 27.162-27.162 27.162h-6.387c-14.999 0-27.162-12.163-27.162-27.162v-205.273c-58.17-16.849-99.977-69.642-99.977-132.191s41.807-115.342 99-131.95l0.967-500.252c0-14.999 12.163-27.162 27.162-27.162h4.796c14.999 0 27.162 12.163 27.162 27.162v496.022c67.608 9.329 119.206 66.436 119.809 135.722z" />
<glyph unicode="&#xe907;" glyph-name="arrow-line" data-tags="arrow-line" d="M995.878 700.739l-43.703 43.703c-17.591 16.506-41.326 26.645-67.432 26.645s-49.837-10.139-67.483-26.693l-303.387-303.389-305.935 304.692c-17.468 16.781-41.244 27.116-67.432 27.116s-49.958-10.335-67.464-27.148l-44.92-44.92c-17.371-17.206-28.122-41.062-28.122-67.432s10.752-50.226 28.112-67.421l414.583-414.583c17.206-17.371 41.062-28.122 67.432-28.122s50.226 10.752 67.421 28.112l418.329 414.583c17.371 17.206 28.122 41.062 28.122 67.432s-10.752 50.226-28.112 67.421z" />
<glyph unicode="&#xe908;" glyph-name="check-empty" data-tags="check-empty" d="M910.2 846.2v-796.4h-796.4v796.4h796.4zM910.2 960h-796.4c-62.6 0-113.8-51.2-113.8-113.8v-796.4c0-62.6 51.2-113.8 113.8-113.8h796.4c62.6 0 113.8 51.2 113.8 113.8v796.4c0 62.6-51.2 113.8-113.8 113.8z" />
<glyph unicode="&#xe909;" glyph-name="check1" data-tags="check" d="M910.2 960h-796.4c-62.6 0-113.8-51.2-113.8-113.8v-796.4c0-62.6 51.2-113.8 113.8-113.8h796.4c62.6 0 113.8 51.2 113.8 113.8v796.4c0 62.6-51.2 113.8-113.8 113.8zM398.2 163.6l-284.4 284.4 79.6 79.6 204.8-204.8 432.4 432.4 79.6-79.6-512-512z" />
<glyph unicode="&#xe90a;" glyph-name="details-arrow" data-tags="details-arrow" d="M512 960.001l-90.24-90.24 357.12-357.76h-778.879v-127.999h778.879l-357.12-357.76 90.24-90.24 511.999 511.999z" />
<glyph unicode="&#xe90b;" glyph-name="Spinner" data-tags="Spinner" d="M1023.953 448.071c1.137 83.016-18.195 164.895-56.861 238.814-75.625 145.563-216.069 245.637-378.121 270.087v-135.328c85.291-16.489 162.621-63.115 217.207-130.779 89.839-108.035 112.015-257.578 56.861-387.219-38.097-91.545-110.309-163.758-201.855-201.855-93.82-40.37-200.149-40.37-293.969 0-91.545 38.097-163.758 110.309-201.855 201.855-55.155 129.642-32.979 279.184 56.861 387.219 54.586 67.663 131.917 114.289 217.207 130.779v135.328c-163.758-22.745-305.91-123.388-382.102-270.087-69.938-135.328-76.193-294.537-17.058-434.982 51.174-123.388 149.542-221.756 272.93-272.361 127.367-54.017 270.655-54.017 398.023 0 122.819 51.174 220.619 148.975 271.793 271.793 26.724 61.978 40.37 129.073 40.94 196.738v0z" />
</font></defs></svg>

After

Width:  |  Height:  |  Size: 6.6 KiB

BIN
fonts/h5p-hub-publish.ttf Normal file

Binary file not shown.

BIN
fonts/h5p-hub-publish.woff Normal file

Binary file not shown.

View File

@ -9,6 +9,10 @@ abstract class H5PMetadata {
'type' => 'text',
'maxLength' => 255
),
'a11yTitle' => array(
'type' => 'text',
'maxLength' => 255,
),
'authors' => array(
'type' => 'json'
),
@ -57,6 +61,7 @@ abstract class H5PMetadata {
// Note: deliberatly creating JSON string "manually" to improve performance
return
'{"title":' . (isset($content->title) ? json_encode($content->title) : 'null') .
',"a11yTitle":' . (isset($content->a11y_title) ? $content->a11y_title : 'null') .
',"authors":' . (isset($content->authors) ? $content->authors : 'null') .
',"source":' . (isset($content->source) ? '"' . $content->source . '"' : 'null') .
',"license":' . (isset($content->license) ? '"' . $content->license . '"' : 'null') .

View File

@ -623,6 +623,44 @@ interface H5PFrameworkInterface {
* @return boolean
*/
public function libraryHasUpgrade($library);
/**
* Replace content hub metadata cache
*
* @param JsonSerializable $metadata Metadata as received from content hub
* @param string $lang Language in ISO 639-1
*
* @return mixed
*/
public function replaceContentHubMetadataCache($metadata, $lang);
/**
* Get content hub metadata cache from db
*
* @param string $lang Language code in ISO 639-1
*
* @return JsonSerializable Json string
*/
public function getContentHubMetadataCache($lang = 'en');
/**
* Get time of last content hub metadata check
*
* @param string $lang Language code iin ISO 639-1 format
*
* @return string|null Time in RFC7231 format
*/
public function getContentHubMetadataChecked($lang = 'en');
/**
* Set time of last content hub metadata check
*
* @param int|null $time Time in RFC7231 format
* @param string $lang Language code iin ISO 639-1 format
*
* @return bool True if successful
*/
public function setContentHubMetadataChecked($time, $lang = 'en');
}
/**
@ -3297,6 +3335,72 @@ class H5PCore {
return $data;
}
/**
* Update content hub metadata cache
*/
public function updateContentHubMetadataCache($lang = 'en') {
$url = H5PHubEndpoints::createURL(H5PHubEndpoints::METADATA);
$lastModified = $this->h5pF->getContentHubMetadataChecked($lang);
$headers = array();
if (!empty($lastModified)) {
$headers['If-Modified-Since'] = $lastModified;
}
$data = $this->h5pF->fetchExternalData("{$url}?lang={$lang}", NULL, TRUE, NULL, TRUE, $headers, NULL, 'GET');
$lastChecked = new DateTime('now', new DateTimeZone('GMT'));
if ($data['status'] !== 200 && $data['status'] !== 304) {
// If this was not a success, set the error message and return
$this->h5pF->setErrorMessage(
$this->h5pF->t('No metadata was received from the H5P Hub. Please try again later.')
);
return null;
}
// Update timestamp
$this->h5pF->setContentHubMetadataChecked($lastChecked->getTimestamp(), $lang);
// Not modified
if ($data['status'] === 304) {
return null;
}
$this->h5pF->replaceContentHubMetadataCache($data['data'], $lang);
// TODO: If 200 should we have checked if it decodes? Or 'success'? Not sure if necessary though
return $data['data'];
}
/**
* Get updated content hub metadata cache
*
* @param string $lang Language as ISO 639-1 code
*
* @return JsonSerializable|string
*/
public function getUpdatedContentHubMetadataCache($lang = 'en') {
$lastUpdate = $this->h5pF->getContentHubMetadataChecked($lang);
if (!$lastUpdate) {
return $this->updateContentHubMetadataCache($lang);
}
$lastUpdate = new DateTime($lastUpdate);
$expirationTime = $lastUpdate->getTimestamp() + (60 * 60 * 24); // Check once per day
if (time() > $expirationTime) {
$update = $this->updateContentHubMetadataCache($lang);
if (!empty($update)) {
return $update;
}
}
$storedCache = $this->h5pF->getContentHubMetadataCache($lang);
if (!$storedCache) {
// We don't have the value stored for some reason, reset last update and re-fetch
$this->h5pF->setContentHubMetadataChecked(null, $lang);
return $this->updateContentHubMetadataCache($lang);
}
return $storedCache;
}
/**
* Check if the current server setup is valid and set error messages
*
@ -3505,8 +3609,241 @@ class H5PCore {
'offlineDialogRetryMessage' => $this->h5pF->t('Retrying in :num....'),
'offlineDialogRetryButtonLabel' => $this->h5pF->t('Retry now'),
'offlineSuccessfulSubmit' => $this->h5pF->t('Successfully submitted results.'),
'mainTitle' => $this->h5pF->t('Sharing <strong>:title</strong>'),
'cancel' => $this->h5pF->t('Cancel'),
'back' => $this->h5pF->t('Back'),
'next' => $this->h5pF->t('Next'),
'reviewInfo' => $this->h5pF->t('Review info'),
'share' => $this->h5pF->t('Share'),
'close' => $this->h5pF->t('Close'),
'registerOnHub' => $this->h5pF->t('Register on the Hub'),
'requiredInfo' => $this->h5pF->t('Required Info'),
'optionalInfo' => $this->h5pF->t('Optional Info'),
'reviewAndShare' => $this->h5pF->t('Review & Share'),
'shared' => $this->h5pF->t('Shared'),
'currentStep' => $this->h5pF->t('Step :step of :total'),
'sharingNote' => $this->h5pF->t('All content details can be edited after sharing'),
'licenseDescription' => $this->h5pF->t('Select a license for your content'),
'licenseVersion' => $this->h5pF->t('License Version'),
'licenseVersionDescription' => $this->h5pF->t('Select a license version'),
'disciplineLabel' => $this->h5pF->t('Disciplines'),
'disciplineDescription' => $this->h5pF->t('You can select multiple disciplines'),
'discipline' => array(
'searchPlaceholder' => $this->h5pF->t('Select one or more disciplines'),
'in' => $this->h5pF->t('in'),
'dropdownButton' => $this->h5pF->t('Dropdown button'),
),
'removeChip' => $this->h5pF->t('Remove :chip from the list'),
'keywordsPlaceholder' => $this->h5pF->t('Add keywords'),
'keywords' => $this->h5pF->t('Keywords'),
'keywordsDescription' => $this->h5pF->t('You can add multiple keywords. Press "Enter" to confirm each keyword'),
'altText' => $this->h5pF->t('Alt text'),
'reviewMessage' => $this->h5pF->t('Please review the info below before you share'),
'subContentWarning' => $this->h5pF->t('Sub-content (images, questions etc.) will be shared under :license unless otherwise specified in the authoring tool'),
'title' => $this->h5pF->t('Title'),
'license' => $this->h5pF->t('License'),
'disciplines' => $this->h5pF->t('Disciplines'),
'shortDescription' => $this->h5pF->t('Short description'),
'longDescription' => $this->h5pF->t('Long description'),
'icon' => $this->h5pF->t('Icon'),
'screenshots' => $this->h5pF->t('Screenshots'),
'helpChoosingLicense' => $this->h5pF->t('Help me choose a license'),
'shareFailed' => $this->h5pF->t('Share failed.'),
'shareTryAgain' => $this->h5pF->t('Something went wrong, please try to share agian.'),
'pleaseWait' => $this->h5pF->t('Please wait...'),
'language' => $this->h5pF->t('Language'),
'level' => $this->h5pF->t('Level'),
'shortDescriptionPlaceholder' => $this->h5pF->t('Short description of your content'),
'longDescriptionPlaceholder' => $this->h5pF->t('Long description of your content'),
'description' => $this->h5pF->t('Description'),
'iconDescription' => $this->h5pF->t('640x480px. If not selected content will use category icon'),
'screenshotsDescription' => $this->h5pF->t('Add up to five screenshots of your content'),
'submitted' => $this->h5pF->t('Submitted!'),
'isNowSubmitted' => $this->h5pF->t('Is now submitted to H5P Hub'),
'contentAvailable' => $this->h5pF->t('Your content will soon be available for download'),
'contentLicenseTitle' => $this->h5pF->t('Content License Info'),
'licenseDialogDescription' => $this->h5pF->t('Click on a specific license to get info about proper usage'),
'publisherFieldTitle' => $this->h5pF->t('Publisher'),
'publisherFieldDescription' => $this->h5pF->t('This will display as the "Publisher name" on shared content'),
'emailAddress' => $this->h5pF->t('Email Address'),
'publisherDescription' => $this->h5pF->t('Publisher description'),
'publisherDescriptionText' => $this->h5pF->t('This will be displayed under "Publisher info" on shared content'),
'contactPerson' => $this->h5pF->t('Contact Person'),
'phone' => $this->h5pF->t('Phone'),
'address' => $this->h5pF->t('Address'),
'city' => $this->h5pF->t('City'),
'zip' => $this->h5pF->t('Zip'),
'country' => $this->h5pF->t('Country'),
'logoUploadText' => $this->h5pF->t('Organization logo or avatar'),
'acceptTerms' => $this->h5pF->t('I accept the terms of the license agreement'),
'successfullyRegistred' => $this->h5pF->t('You have successfully registered an account on the H5P Hub'),
'successfullyRegistredDescription' => $this->h5pF->t('You account details can be changed'),
'accountDetailsLinkText' => $this->h5pF->t('here'),
'registrationTitle' => $this->h5pF->t('Hub Registration and End User License Agreement (EULA)'),
'registrationFailed' => $this->h5pF->t('An error occured'),
'registrationFailedDescription' => $this->h5pF->t('We were not able to create an account at this point. Something went wrong. Try again later.'),
'maxLength' => $this->h5pF->t(':length is the maximum number of characters'),
'keywordExists' => $this->h5pF->t('Keyword already exists!'),
'licenseDetails' => $this->h5pF->t('License details'),
);
}
/**
* Publish content on the H5P Hub.
*
* @param array $data Data from content publishing process
* @param array $files Files to upload with the content publish
* @return stdClass
*/
public function hubPublishContent($data, $files) {
$headers = array(
'Authorization' => $this->hubGetAuthorizationHeader(),
'Accept' => 'application/json',
);
$response = $this->h5pF->fetchExternalData(
H5PHubEndpoints::createURL(H5PHubEndpoints::CONTENT),
$data, TRUE, NULL, TRUE, $headers, $files
);
if (empty($response['data'])) {
throw new Exception($this->h5pF->t('Unable to authorize with the H5P Hub. Please check your Hub registration and connection.'));
}
$result = json_decode($response['data']);
if (isset($result->success) && $result->success === TRUE) {
return $result;
}
elseif (!empty($result->errors)) {
// Relay any error messages
$e = new Exception($this->h5pF->t('Validation failed.'));
$e->errors = $result->errors;
throw $e;
}
}
/**
* Creates the authorization header needed to access the private parts of
* the H5P Hub.
*
* @return string
*/
public function hubGetAuthorizationHeader() {
$site_uuid = $this->h5pF->getOption('site_uuid', '');
$hub_secret = $this->h5pF->getOption('hub_secret', '');
if (empty($site_uuid)) {
throw new Exception($this->h5pF->t('Missing Site UUID. Please check your Hub registration.'));
}
if (empty($hub_secret)) {
throw new Exception($this->h5pF->t('Missing Hub Secret. Please check your Hub registration.'));
}
return 'Basic ' . base64_encode("$site_uuid:$hub_secret");
}
/**
* Unpublish content from content hub
*
* @param integer $hubId Content hub id
* @param string $token CSRF token
*
* @return bool True if successful
*/
public function hubUnpublishContent($hubId, $token) {
if (!self::validToken('content_hub_token', $token)) {
$msg = $this->h5pF->t('Could not unpublish content because token was invalid. Please try again.');
$this->h5pF->setErrorMessage($msg);
return false;
}
$headers = array(
'Authorization' => $this->hubGetAuthorizationHeader(),
'Accept' => 'application/json',
);
$url = H5PHubEndpoints::createURL(H5PHubEndpoints::CONTENT);
$response = $this->h5pF->fetchExternalData("{$url}/{$hubId}", array(
'published' => '0',
), true, null, true, $headers, array(), 'PUT');
// Remove shared status if successful
if (!empty($response) && $response['status'] === 200) {
$msg = $this->h5pF->t('Content successfully unpublished');
$this->h5pF->setInfoMessage($msg);
return true;
}
$msg = $this->h5pF->t('Content unpublish failed');
$this->h5pF->setErrorMessage($msg);
return false;
}
/**
* Sync content with content hub
*
* @param integer $hubId Content hub id
* @param string $token CSRF token
* @param string $exportPath Export path where .h5p for content can be found
*
* @return bool
*/
public function hubSyncContent($hubId, $token, $exportPath) {
if (!self::validToken('content_hub_token', $token)) {
$msg = $this->h5pF->t('Could not sync content because token was invalid. Please try again.');
$this->h5pF->setErrorMessage($msg);
return false;
}
$headers = array(
'Authorization' => $this->hubGetAuthorizationHeader(),
'Accept' => 'application/json',
);
$url = H5PHubEndpoints::createURL(H5PHubEndpoints::CONTENT);
$response = $this->h5pF->fetchExternalData("{$url}/{$hubId}", array(
'download_url' => $exportPath,
), true, null, true, $headers, array(), 'PUT');
if (!empty($response) && $response['status'] === 200) {
$msg = $this->h5pF->t('Content sync queued');
$this->h5pF->setInfoMessage($msg);
return true;
}
$msg = $this->h5pF->t('Content sync failed');
$this->h5pF->setErrorMessage($msg);
return false;
}
/**
* Fetch account info for our site from the content hub
*
* @return array|bool|string False if account is not setup, otherwise data
*/
public function hubAccountInfo() {
$siteUuid = $this->h5pF->getOption('site_uuid', null);
$secret = $this->h5pF->getOption('hub_secret', null);
if (empty($siteUuid) || empty($secret)) {
return false;
}
$headers = array(
'Authorization' => $this->hubGetAuthorizationHeader(),
'Accept' => 'application/json',
);
$url = H5PHubEndpoints::createURL(H5PHubEndpoints::REGISTER);
$accountInfo = $this->h5pF->fetchExternalData("{$url}/{$siteUuid}",
null, true, null, true, $headers, array(), 'GET');
if ($accountInfo['status'] !== 200) {
return false;
}
return json_decode($accountInfo['data'])->data;
}
}
/**
@ -4519,6 +4856,12 @@ class H5PContentValidator {
'label' => $this->h5pF->t('Title'),
'placeholder' => 'La Gioconda'
),
(object) array(
'name' => 'a11yTitle',
'type' => 'text',
'label' => $this->h5pF->t('Assistive Technologies label'),
'optional' => TRUE,
),
(object) array(
'name' => 'license',
'type' => 'select',

File diff suppressed because one or more lines are too long

54
js/h5p-hub-sharing.js Normal file

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,369 @@
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
.h5p-hub-publish button,.h5p-hub-registration button{font-family:"Open Sans", sans-serif;font-size:0.75em;background:transparent;padding:0.75em 2em;color:#757575;border-radius:3em;border:1px solid #d6d6d6;cursor:pointer;font-weight:bold}.h5p-hub-publish button:before,.h5p-hub-registration button:before{font-weight:normal}.h5p-hub-publish button:hover,.h5p-hub-registration button:hover{color:#5f5f5f;border-color:#5f5f5f}.h5p-hub-publish button.contained.green,.h5p-hub-registration button.contained.green{color:#fff;border-color:#2b9684;background:#2b9684}.h5p-hub-publish button.contained.green:hover,.h5p-hub-registration button.contained.green:hover{border-color:#257a70;background:#257a70}.h5p-hub-publish button.outlined.green,.h5p-hub-registration button.outlined.green{border-width:0.125em;color:#2b9684;border-color:#2b9684}.h5p-hub-publish button.outlined.green:hover,.h5p-hub-registration button.outlined.green:hover{color:#257a70;border-color:#257a70}.h5p-hub-publish button.outlined.green[disabled],.h5p-hub-registration button.outlined.green[disabled]{color:#92cabf;border-color:#92cabf}
.h5p-hub-publish .form-element,.h5p-hub-registration .form-element{font-family:'Open Sans', sans-serif;padding:1em 0}.h5p-hub-publish .form-element label,.h5p-hub-registration .form-element label{display:block;color:#363636;margin-bottom:0.4em;font-weight:bold}.h5p-hub-publish .form-element.mandatory label:after,.h5p-hub-registration .form-element.mandatory label:after{content:'*';color:#d11e15;position:relative;top:-0.2em}.h5p-hub-publish .form-element input,.h5p-hub-registration .form-element input{font-size:0.917em;padding:0.833em;border:1px solid #bebdcd;border-radius:0.208em;width:100%;box-sizing:border-box;line-height:normal}.h5p-hub-publish .form-element input::placeholder,.h5p-hub-registration .form-element input::placeholder{font-style:italic}.h5p-hub-publish .form-element .description,.h5p-hub-registration .form-element .description{font-size:0.833em;color:#707475;margin:0 0 1em 0}.h5p-hub-publish .form-element textarea,.h5p-hub-registration .form-element textarea{border:1px solid #bebdcd;resize:none;font-size:0.833em;width:100%;border-radius:0.208em;padding:0.833em 0.833em;box-sizing:border-box}.h5p-hub-publish .form-element textarea::-webkit-scrollbar,.h5p-hub-registration .form-element textarea::-webkit-scrollbar{background-color:rgba(105,117,133,0.25);width:0.333em;border-radius:5.45256em}.h5p-hub-publish .form-element textarea::-webkit-scrollbar-thumb,.h5p-hub-registration .form-element textarea::-webkit-scrollbar-thumb{background-color:#697585;background-size:24px 100%;border-radius:5.45256em}.h5p-hub-publish .form-element textarea::placeholder,.h5p-hub-registration .form-element textarea::placeholder{font-style:italic}.h5p-hub-publish .form-element .link-button,.h5p-hub-registration .form-element .link-button{border:none;color:#2c67b0;text-decoration:underline;font-weight:500;padding:0;text-align:right}.h5p-hub-publish .form-element .details-row,.h5p-hub-registration .form-element .details-row{display:flex;align-content:center;align-items:center;justify-content:space-between}.h5p-hub-publish .step-content>.form-element:first-child,.h5p-hub-registration .step-content>.form-element:first-child{padding-top:0}.h5p-hub-publish .step-content>.form-element:last-child,.h5p-hub-registration .step-content>.form-element:last-child{padding-bottom:0}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
@keyframes spinner{0%{transform:translate3d(-50%, -50%, 0) rotate(0deg)}100%{transform:translate3d(-50%, -50%, 0) rotate(360deg)}}.h5p-hub-publish,.h5p-hub-registration-wrapper{position:relative;margin:2em auto;font-family:'Open Sans', sans-serif;max-width:1024px;border:1px solid #2c9586;border-radius:0.167em;box-sizing:border-box;font-size:18px;box-shadow:0px 0px 20px rgba(0,0,0,0.1)}.h5p-hub-publish .header,.h5p-hub-registration-wrapper .header{padding:1.5em;display:flex;align-items:center;width:100%;box-sizing:border-box;border-bottom:1px solid #d5d5d7}.h5p-hub-publish .header .title,.h5p-hub-registration-wrapper .header .title{font-size:1.458em;flex-grow:1}.h5p-hub-publish .step-panel,.h5p-hub-registration-wrapper .step-panel{margin:2em;border-radius:0.208em;border:1px solid #d5d5d7}.h5p-hub-publish .step-title,.h5p-hub-registration-wrapper .step-title{color:#1a1a1a;font-size:1.250em;font-weight:bold;border-bottom:1px solid #ccc;padding:1.2em 1.8em}.h5p-hub-publish .step-content,.h5p-hub-registration-wrapper .step-content{padding:2em}.h5p-hub-publish .footer,.h5p-hub-registration-wrapper .footer{padding:0 2em 2em;width:100%;box-sizing:border-box;position:relative}.h5p-hub-publish .footer .navigation,.h5p-hub-registration-wrapper .footer .navigation{display:flex}.h5p-hub-publish .footer .navigation button:before,.h5p-hub-registration-wrapper .footer .navigation button:before{font-family:'h5p';font-size:0.75em;content:"\e91a";transform:rotate(180deg);display:inline-block;margin-right:1em;line-height:1;position:relative;top:-0.1em}.h5p-hub-publish .footer .navigation .back:before,.h5p-hub-registration-wrapper .footer .navigation .back:before{transform:rotate(0)}.h5p-hub-publish .footer .navigation #share-in-process::before,.h5p-hub-registration-wrapper .footer .navigation #share-in-process::before{font-family:"h5p";font-size:0.75em;content:"\e928";animation:2s linear infinite spinner;top:0.5em}.h5p-hub-publish .footer .navigation .next,.h5p-hub-registration-wrapper .footer .navigation .next{margin-left:auto}.h5p-hub-publish .tip-text-field,.h5p-hub-registration-wrapper .tip-text-field{top:1.5em}.h5p-hub-publish .share-error,.h5p-hub-registration-wrapper .share-error{padding:0 2em 2em;text-align:end}.h5p-hub-publish .bold,.h5p-hub-registration-wrapper .bold{font-weight:bold}.h5p-hub-publish .row,.h5p-hub-registration-wrapper .row{display:flex;flex-wrap:wrap;margin-right:-1em}.h5p-hub-publish .row .form-element,.h5p-hub-registration-wrapper .row .form-element{flex-basis:100%;flex:1;min-width:17em;align-self:flex-end;border-right:1em solid #ffffff}@media (max-width: 576px){.h5p-hub-publish .row .form-element,.h5p-hub-registration-wrapper .row .form-element{min-width:calc(100% - 1em)}}.h5p-hub-publish .columns,.h5p-hub-registration-wrapper .columns{display:flex;margin-right:-1em}@media (max-width: 576px){.h5p-hub-publish .columns,.h5p-hub-registration-wrapper .columns{flex-wrap:wrap}}.h5p-hub-publish .columns .column,.h5p-hub-registration-wrapper .columns .column{width:50%;border-right:1em solid #ffffff}@media (max-width: 576px){.h5p-hub-publish .columns .column,.h5p-hub-registration-wrapper .columns .column{width:100%;margin-right:0}}.h5p-hub-publish .sharing-note,.h5p-hub-registration-wrapper .sharing-note{text-align:center;color:#707475;font-size:0.833em;width:calc(100% - 4.9em);position:absolute;z-index:-1;top:0.65em;box-sizing:border-box;padding:0 8em}.h5p-hub-publish .sharing-note .icon-info:before,.h5p-hub-registration-wrapper .sharing-note .icon-info:before{font-size:0.5em;display:inline-block;margin-right:1em;background:#d1d7e3;padding:0.4em;border-radius:50%;position:relative;top:-0.25em}.h5p-hub-publish .sr-only,.h5p-hub-registration-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.h5p-hub-publish [class^="icon-"],.h5p-hub-publish [class*=" icon-"],.h5p-hub-registration-wrapper [class^="icon-"],.h5p-hub-registration-wrapper [class*=" icon-"]{font-family:'h5p' !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.h5p-hub-publish .icon-dropdown:before,.h5p-hub-registration-wrapper .icon-dropdown:before{content:"\e925"}.h5p-hub-publish .icon-info:before,.h5p-hub-registration-wrapper .icon-info:before{content:"\e93c"}.h5p-hub-publish .icon-thick-arrow:before,.h5p-hub-registration-wrapper .icon-thick-arrow:before{content:"\e91a"}.h5p-hub-publish .icon-check:before,.h5p-hub-registration-wrapper .icon-check:before{content:"\e933"}.h5p-hub-publish .icon-close:before,.h5p-hub-registration-wrapper .icon-close:before{content:"\e93a"}.h5p-hub-publish .icon-plus:before,.h5p-hub-registration-wrapper .icon-plus:before{content:"\e939"}
.h5p-hub-registration .message-header{font-weight:bold;font-size:1.042em;font-family:'Open Sans', sans-serif}.h5p-hub-registration .message-description{margin-top:0.5em;font-size:0.833em;font-family:'Open Sans', sans-serif}.h5p-hub-registration .message-description a{margin-left:0.3em;color:#000}.h5p-hub-registration .email-address{display:flex;flex-direction:column;justify-content:flex-end}.h5p-hub-registration .publisher-description{height:10em}.h5p-hub-registration .logo-upload-text{font-size:0.917em;color:#707475;margin-bottom:1em;margin-top:0.5em}.h5p-hub-registration .text-field{max-height:10em;margin-top:1.5em}.h5p-hub-registration .checkbox{margin-top:1.5em;font-weight:normal;font-size:0.833em}.h5p-hub-registration .register-hub{margin-left:1em;color:#2b9684;border:2px solid #2b9684}.h5p-hub-registration .register-hub[disabled]{color:#92cabf;border-color:#92cabf}.h5p-hub-registration .footer{display:flex;justify-content:flex-end}
.h5p-hub-publish .image-preview,.h5p-hub-registration .image-preview{width:4em;height:3em;margin-right:0.5em;display:inline-block;background-size:cover;background-position:center}
.h5p-hub-publish .image-upload-container,.h5p-hub-registration .image-upload-container{width:4em;height:3em;margin-right:1em;position:relative}.h5p-hub-publish .image-upload-container .image-preview,.h5p-hub-registration .image-upload-container .image-preview{position:absolute;left:4px;top:4px;width:calc(100% - 4px);height:calc(100% - 4px)}.h5p-hub-publish .image-upload-container .icon-close,.h5p-hub-registration .image-upload-container .icon-close{cursor:pointer}.h5p-hub-publish .image-upload-container .icon-close:before,.h5p-hub-registration .image-upload-container .icon-close:before{font-size:0.6em;padding:0.5em;line-height:1.1;color:#fff;background:#000;position:absolute;z-index:1;display:inline-block;right:-1.2em;top:-1.2em;border:3px solid #fff;border-radius:50%;cursor:pointer;transition:all 0.3s}.h5p-hub-publish .image-upload-container .icon-close:hover:before,.h5p-hub-registration .image-upload-container .icon-close:hover:before{background:#eee;color:#000}.h5p-hub-publish .image-upload-container .image-upload,.h5p-hub-registration .image-upload-container .image-upload{position:absolute;top:0;left:0;width:100%;height:100%;border:0.125em dashed #bebdcd;color:#bebdcd;text-align:center;transition:all 0.3s}.h5p-hub-publish .image-upload-container .image-upload input,.h5p-hub-registration .image-upload-container .image-upload input{position:absolute;left:0;top:0;width:100%;height:100%;cursor:pointer;opacity:0}.h5p-hub-publish .image-upload-container .image-upload input::-webkit-file-upload-button,.h5p-hub-registration .image-upload-container .image-upload input::-webkit-file-upload-button{visibility:hidden}.h5p-hub-publish .image-upload-container .image-upload:hover,.h5p-hub-registration .image-upload-container .image-upload:hover{color:#777;border-color:#777}.h5p-hub-publish .image-upload-container .image-upload:before,.h5p-hub-registration .image-upload-container .image-upload:before{content:"+";font-size:2em;display:inline-block;position:relative;top:50%;transform:translateY(-50%)}.h5p-hub-publish .image-upload-container .image-upload.image-selected,.h5p-hub-registration .image-upload-container .image-upload.image-selected{border-style:solid;border-radius:0.1em}.h5p-hub-publish .image-upload-container .image-upload.image-selected:before,.h5p-hub-registration .image-upload-container .image-upload.image-selected:before{display:none}
.h5p-hub-registration .text-field{padding:1.5em;overflow:hidden;overflow-y:scroll;border:1px solid #bebdcd;border-radius:0.208em}.h5p-hub-registration .text-field::-webkit-scrollbar{background-color:rgba(105,117,133,0.25);width:0.333em;border-radius:5.45256em}.h5p-hub-registration .text-field::-webkit-scrollbar-thumb{background-color:#697585;background-size:24px 100%;border-radius:5.45256em}.h5p-hub-registration .text-field .title{color:#1a1a1a;font-size:1.250em;margin-bottom:0.5em}.h5p-hub-registration .text-field .description{color:#707475;font-size:0.833em;margin-bottom:1.5em}.h5p-hub-registration .text-field .main-text{color:#707475;font-size:0.833em}
.h5p-hub-publish .checkbox,.h5p-hub-registration .checkbox{font-size:1.05em;padding:0.5em 0;font-weight:bold;display:flex;cursor:pointer;align-self:start;color:#4d5057;width:100%}.h5p-hub-publish .checkbox:focus,.h5p-hub-registration .checkbox:focus{box-shadow:0 0 0.4em 0.01em RGBA(26, 147, 244, 0.7);outline:none}.h5p-hub-publish .checkbox:hover.parent:after,.h5p-hub-registration .checkbox:hover.parent:after{color:#121212;font-family:'h5p';content:'\e924';transform:rotate(-90deg);font-style:normal;font-size:0.7em;display:inline-block;position:absolute;right:2em;align-self:center}.h5p-hub-publish .checkbox.highlighted.parent:after,.h5p-hub-registration .checkbox.highlighted.parent:after{color:#121212;font-family:'h5p';content:'\e924';transform:rotate(-90deg);font-style:normal;font-size:0.7em;display:inline-block;position:absolute;right:2em;align-self:center}.h5p-hub-publish .checkbox .content,.h5p-hub-registration .checkbox .content{display:flex}.h5p-hub-publish .checkbox .content-text,.h5p-hub-registration .checkbox .content-text{margin-left:2em}.h5p-hub-publish .checkbox .bold,.h5p-hub-registration .checkbox .bold{font-weight:bold}.h5p-hub-publish .checkbox .non-bold,.h5p-hub-registration .checkbox .non-bold{font-weight:normal}.h5p-hub-publish .checkbox .content .icon::before,.h5p-hub-registration .checkbox .content .icon::before{font-family:'h5p';content:'\e923';font-style:normal;font-weight:normal;font-size:1em;margin:0.4em 0.4em 0 0.4em;margin-right:1em}.h5p-hub-publish .checkbox.checked .content .icon::before,.h5p-hub-registration .checkbox.checked .content .icon::before{content:'\e938';font-family:'h5p';font-style:normal;font-weight:normal;font-size:1em;margin:0.4em 0.4em 0 0.4em;margin-right:1em}
.h5p-hub-publish .message,.h5p-hub-registration .message{font-size:0.833em;border-left:0.3em solid;padding:1em;margin:0.5em 0}.h5p-hub-publish .message.warning,.h5p-hub-registration .message.warning{border-color:#fdcc31;background:#fff8e0}.h5p-hub-publish .message.error,.h5p-hub-registration .message.error{border-color:#c1494b;background-color:#ece0e0}.h5p-hub-publish .message.success,.h5p-hub-registration .message.success{border-color:#03a953;background-color:#d9eae2}

399
styles/h5p-hub-sharing.css Normal file
View File

@ -0,0 +1,399 @@
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
.h5p-hub-publish button,.h5p-hub-registration button{font-family:"Open Sans", sans-serif;font-size:0.75em;background:transparent;padding:0.75em 2em;color:#757575;border-radius:3em;border:1px solid #d6d6d6;cursor:pointer;font-weight:bold}.h5p-hub-publish button:before,.h5p-hub-registration button:before{font-weight:normal}.h5p-hub-publish button:hover,.h5p-hub-registration button:hover{color:#5f5f5f;border-color:#5f5f5f}.h5p-hub-publish button.contained.green,.h5p-hub-registration button.contained.green{color:#fff;border-color:#2b9684;background:#2b9684}.h5p-hub-publish button.contained.green:hover,.h5p-hub-registration button.contained.green:hover{border-color:#257a70;background:#257a70}.h5p-hub-publish button.outlined.green,.h5p-hub-registration button.outlined.green{border-width:0.125em;color:#2b9684;border-color:#2b9684}.h5p-hub-publish button.outlined.green:hover,.h5p-hub-registration button.outlined.green:hover{color:#257a70;border-color:#257a70}.h5p-hub-publish button.outlined.green[disabled],.h5p-hub-registration button.outlined.green[disabled]{color:#92cabf;border-color:#92cabf}
.h5p-hub-publish .stepper{display:flex;width:100%;max-width:40em;align-items:center;flex-direction:row;margin:2em auto;padding:0 2em;box-sizing:border-box}.h5p-hub-publish .step-connector{flex-grow:1;margin-left:-2em;margin-right:-2em;position:relative;top:-0.6em}.h5p-hub-publish .step-connector-line{display:block;border-top-style:solid;border-top-width:1px;border-color:#d5d5d7}
.h5p-hub-publish .step{text-align:center;font-size:0.75em;font-weight:bold}.h5p-hub-publish .step .step-icon{color:#303030;border-radius:50%;border:0.462em solid #e1e1e1;width:3.2em;height:3.2em;line-height:2.276;display:inline-block;z-index:1;position:relative;background:#fff;box-sizing:border-box}.h5p-hub-publish .step .step-icon .icon-check{line-height:2.276}.h5p-hub-publish .step .step-label{color:#757575;margin-top:0.5em;min-width:8em}.h5p-hub-publish .step.active{color:#20d2b2}.h5p-hub-publish .step.active .step-icon{border-color:#20d2b2;color:#0ea385}.h5p-hub-publish .step.completed .step-icon{background:#0ea385;border-color:#20d2b2;color:#fff}
.h5p-hub-publish .form-element,.h5p-hub-registration .form-element{font-family:'Open Sans', sans-serif;padding:1em 0}.h5p-hub-publish .form-element label,.h5p-hub-registration .form-element label{display:block;color:#363636;margin-bottom:0.4em;font-weight:bold}.h5p-hub-publish .form-element.mandatory label:after,.h5p-hub-registration .form-element.mandatory label:after{content:'*';color:#d11e15;position:relative;top:-0.2em}.h5p-hub-publish .form-element input,.h5p-hub-registration .form-element input{font-size:0.917em;padding:0.833em;border:1px solid #bebdcd;border-radius:0.208em;width:100%;box-sizing:border-box;line-height:normal}.h5p-hub-publish .form-element input::placeholder,.h5p-hub-registration .form-element input::placeholder{font-style:italic}.h5p-hub-publish .form-element .description,.h5p-hub-registration .form-element .description{font-size:0.833em;color:#707475;margin:0 0 1em 0}.h5p-hub-publish .form-element textarea,.h5p-hub-registration .form-element textarea{border:1px solid #bebdcd;resize:none;font-size:0.833em;width:100%;border-radius:0.208em;padding:0.833em 0.833em;box-sizing:border-box}.h5p-hub-publish .form-element textarea::-webkit-scrollbar,.h5p-hub-registration .form-element textarea::-webkit-scrollbar{background-color:rgba(105,117,133,0.25);width:0.333em;border-radius:5.45256em}.h5p-hub-publish .form-element textarea::-webkit-scrollbar-thumb,.h5p-hub-registration .form-element textarea::-webkit-scrollbar-thumb{background-color:#697585;background-size:24px 100%;border-radius:5.45256em}.h5p-hub-publish .form-element textarea::placeholder,.h5p-hub-registration .form-element textarea::placeholder{font-style:italic}.h5p-hub-publish .form-element .link-button,.h5p-hub-registration .form-element .link-button{border:none;color:#2c67b0;text-decoration:underline;font-weight:500;padding:0;text-align:right}.h5p-hub-publish .form-element .details-row,.h5p-hub-registration .form-element .details-row{display:flex;align-content:center;align-items:center;justify-content:space-between}.h5p-hub-publish .step-content>.form-element:first-child,.h5p-hub-registration .step-content>.form-element:first-child{padding-top:0}.h5p-hub-publish .step-content>.form-element:last-child,.h5p-hub-registration .step-content>.form-element:last-child{padding-bottom:0}
.h5p-hub-publish select{font-size:0.917em;border-radius:0.208em;padding:0.833em;color:#313131;background-color:#ffffff;font-family:"Open Sans", sans-serif;border:1px solid #bebdcd;width:100%;-webkit-appearance:none;-moz-appearance:none;line-height:normal}.h5p-hub-publish select:disabled{background-color:#ededed}.h5p-hub-publish select:disabled::before{content:"-"}.h5p-hub-publish select::-ms-expand{display:none}.h5p-hub-publish div.icon-arrow-down{position:relative;line-height:1.1em;pointer-events:none}.h5p-hub-publish div.icon-arrow-down:before{content:"\e925";transform:rotate(90deg);position:absolute;right:1em;top:1.8em;font-size:0.6em}
.h5p-hub-publish .modal-content{z-index:2;background-color:#ffffff;opacity:1;position:relative;margin:2em 3em;border-radius:0.167em}.h5p-hub-publish .modal-overlay{position:absolute;top:0;left:0px;right:0px;bottom:0px;background-color:rgba(0,0,0,0.7);z-index:2}
.h5p-hub-publish .chips-list{display:flex;list-style:none;padding:0;flex-wrap:wrap;margin:0 0 0.5em}.h5p-hub-publish .chips-list li button{font-size:0.708em;border-radius:0.083em;margin-right:0.5em;margin-top:0.5em;font-style:italic;color:#000000;display:flex;align-items:center;padding:0.75em 0.75em;border-color:#dddee2;outline:none}.h5p-hub-publish .chips-list li button .icon-close{font-size:0.8em;margin-left:2em}.h5p-hub-publish .chips-list li button:focus{background-color:#e8e8e8;border-color:#dddee2}.h5p-hub-publish .chips-list li button:hover{background-color:#f5f5f5;border-color:#dddee2}
.h5p-hub-publish .checkbox,.h5p-hub-registration .checkbox{font-size:1.05em;padding:0.5em 0;font-weight:bold;display:flex;cursor:pointer;align-self:start;color:#4d5057;width:100%}.h5p-hub-publish .checkbox:focus,.h5p-hub-registration .checkbox:focus{box-shadow:0 0 0.4em 0.01em RGBA(26, 147, 244, 0.7);outline:none}.h5p-hub-publish .checkbox:hover.parent:after,.h5p-hub-registration .checkbox:hover.parent:after{color:#121212;font-family:'h5p';content:'\e924';transform:rotate(-90deg);font-style:normal;font-size:0.7em;display:inline-block;position:absolute;right:2em;align-self:center}.h5p-hub-publish .checkbox.highlighted.parent:after,.h5p-hub-registration .checkbox.highlighted.parent:after{color:#121212;font-family:'h5p';content:'\e924';transform:rotate(-90deg);font-style:normal;font-size:0.7em;display:inline-block;position:absolute;right:2em;align-self:center}.h5p-hub-publish .checkbox .content,.h5p-hub-registration .checkbox .content{display:flex}.h5p-hub-publish .checkbox .content-text,.h5p-hub-registration .checkbox .content-text{margin-left:2em}.h5p-hub-publish .checkbox .bold,.h5p-hub-registration .checkbox .bold{font-weight:bold}.h5p-hub-publish .checkbox .non-bold,.h5p-hub-registration .checkbox .non-bold{font-weight:normal}.h5p-hub-publish .checkbox .content .icon::before,.h5p-hub-registration .checkbox .content .icon::before{font-family:'h5p';content:'\e923';font-style:normal;font-weight:normal;font-size:1em;margin:0.4em 0.4em 0 0.4em;margin-right:1em}.h5p-hub-publish .checkbox.checked .content .icon::before,.h5p-hub-registration .checkbox.checked .content .icon::before{content:'\e938';font-family:'h5p';font-style:normal;font-weight:normal;font-size:1em;margin:0.4em 0.4em 0 0.4em;margin-right:1em}
.h5p-hub-publish .checkbox-list{list-style:none;padding:0}
.h5p-hub-publish .bottom-line{border-bottom:2px solid #697585}.h5p-hub-publish .category-header{background-color:#f2f2f2;color:#313131;font-style:italic;padding:0 0 0 0.9em;font-size:0.81788em}
.h5p-hub-publish .search-button{width:100%}.h5p-hub-publish .search-button .search-field{position:relative}.h5p-hub-publish .search-button .search-field .icon-arrow{position:absolute;font-size:1.30353em;top:1.2em;right:0.7em;cursor:pointer;color:#000000;transform:rotate(90deg)}.h5p-hub-publish .search-button .search-field .icon-arrow::before{content:"\e925";font-family:"h5p";font-style:normal;font-size:0.6em}.h5p-hub-publish #filter-search-bar{border:none;padding:0.833em;font-style:italic;font-size:1.25em;width:100%;box-sizing:border-box}.h5p-hub-publish #filter-search-bar::placeholder{color:#b7b8ba}.h5p-hub-publish #filter-search-bar:focus{border-color:#3ba0f2;background-color:#fff;outline:none}
.h5p-hub-publish .search-filter{position:relative;border:1px solid #bebdcd;border-radius:0.208em;font-size:0.833em}.h5p-hub-publish .search-filter .clear-button{background:none;position:absolute;top:0;padding:1.6em;right:3em;color:#757575;border:none}.h5p-hub-publish .search-filter .clear-button::before{content:"\e93a";font-family:"h5p";font-style:normal;font-size:1em}.h5p-hub-publish .search-filter .navigate-parent{font-size:1.25em;padding:0.3534em;display:flex;font-weight:bold;font-family:"Open Sans", sans-serif;border-top:1px solid #e6e6e8;align-items:center}.h5p-hub-publish .search-filter .navigate-parent button{background-color:#ffffff;position:relative;font-style:normal;font-size:0.8em;border-radius:50%;margin-right:0.4em;align-self:center;padding:0.5em;border:none}.h5p-hub-publish .search-filter .navigate-parent button::before{content:"\e937";font-family:"h5p";transform:rotate(180deg);font-weight:normal;display:inline-block}.h5p-hub-publish .search-filter .navigate-parent button:hover{background-color:#dadada;cursor:pointer}.h5p-hub-publish .search-filter .checkbox-list{overflow:hidden;overflow-y:scroll;max-height:25em;margin:0}.h5p-hub-publish .search-filter .checkbox-list li{border-bottom:1px solid #e6e6e8}.h5p-hub-publish .search-filter .checkbox-list li:last-child{border-bottom:none}.h5p-hub-publish .search-filter .checkbox-list li:first-child{border-top:1px solid #e6e6e8}.h5p-hub-publish .search-filter .checkbox-list li .content{padding:0.3em}.h5p-hub-publish .search-filter .checkbox-list li .content .label-text{margin-right:1em}.h5p-hub-publish .search-filter .checkbox-list li:focus{border-color:#3ba0f2;background-color:#fff;outline:none;box-shadow:none}.h5p-hub-publish .search-filter .checkbox-list li:hover{background-color:#f2f2f2}.h5p-hub-publish .search-filter .checkbox-list li.highlighted{outline:1px solid #3ba0f2;outline-offset:-1px;background-color:#fff;box-shadow:none}.h5p-hub-publish .search-filter .checkbox-list li:hover{background-color:rgba(230,230,232,0.25)}.h5p-hub-publish .search-filter .checkbox-list::-webkit-scrollbar{background-color:rgba(105,117,133,0.25);width:0.54525em;border-radius:5.45256em}.h5p-hub-publish .search-filter .checkbox-list::-webkit-scrollbar-thumb{background-color:#697585;background-size:24px 100%;border-radius:5.45256em}
.h5p-hidden-read{width:1px;height:1px;top:-1px;position:absolute;text-indent:1px;overflow:hidden}
.h5p-hub-publish .tip{position:relative;display:block}.h5p-hub-publish .tip.positioned{position:unset}.h5p-hub-publish .tip.bottom .tip-wrapper{top:115%}.h5p-hub-publish .tip.bottom .tip-wrapper .arrow:after{top:-0.75em;border-bottom-color:black;border-top-color:transparent}.h5p-hub-publish .tip.left-aligned .tip-wrapper{transform:none;top:-0.85em;right:0}.h5p-hub-publish .tip.left-aligned .tip-wrapper .tip{white-space:normal}.h5p-hub-publish .tip.left-aligned .tip-wrapper .arrow:after{left:auto;transform:none;right:1.3em}.h5p-hub-publish .tip .tip-wrapper{display:none;position:absolute;top:-3.5em;font-size:14px;font-weight:400;color:white;border-radius:0.4em;z-index:2}.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-enter-done,.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-enter,.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-enter-active,.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-exit,.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-exit-active{display:block}.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-enter{transform:translate(0, 30%);opacity:0}.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-enter-active{transform:translate(0, 0);opacity:1;transition:opacity 0.2s, transform 0.2s}.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-exit{transform:translate(0, 0);opacity:1}.h5p-hub-publish .tip .tip-wrapper.tip-wrapper-exit-active{transform:translate(0, 30%);opacity:0;transition:opacity 0.2s, transform 0.2s}.h5p-hub-publish .tip .tip-wrapper .tip{white-space:nowrap;background:black;padding:0.3em 1em;border-radius:0.4em}.h5p-hub-publish .tip .tip-wrapper .arrow:after{content:" ";position:absolute;left:50%;transform:translateX(-50%);pointer-events:none;border:0.4em solid transparent;border-top-color:black}
.h5p-hub-publish .message,.h5p-hub-registration .message{font-size:0.833em;border-left:0.3em solid;padding:1em;margin:0.5em 0}.h5p-hub-publish .message.warning,.h5p-hub-registration .message.warning{border-color:#fdcc31;background:#fff8e0}.h5p-hub-publish .message.error,.h5p-hub-registration .message.error{border-color:#c1494b;background-color:#ece0e0}.h5p-hub-publish .message.success,.h5p-hub-registration .message.success{border-color:#03a953;background-color:#d9eae2}
.h5p-hub-publish .h5p-hub-accordion-heading{display:flex;align-items:center}.h5p-hub-publish .h5p-hub-accordion-heading .icon-dropdown{font-size:0.4em;color:#616161;display:inline-block;left:0;display:flex;padding:0.2em 0.2em;transform:rotate(-90deg)}.h5p-hub-publish .h5p-hub-accordion-heading .icon-dropdown.open{transform:rotate(0)}.h5p-hub-publish .accordion-button{border:none;position:relative;padding:0.2em 0.2em;width:100%;justify-self:start;display:flex}.h5p-hub-publish .accordion-button .accordion-header{border:none;text-align:left;color:#616161}.h5p-hub-publish .panel-body{font-size:0.833em;margin-left:0.7em;color:#707475}
.h5p-hub-publish .dialog-header{padding:1.708em 2.292em;border-bottom:1px solid #d5d5d7}.h5p-hub-publish .dialog-header .dialog-description{font-size:0.833em;color:#707475}.h5p-hub-publish .dialog-content{padding:1.708em 2.292em}.h5p-hub-publish .dialog-title{display:flex;justify-content:space-between}.h5p-hub-publish .dialog-title span{font-size:1.458em;color:#1a1a1a;margin-bottom:0.2em}.h5p-hub-publish .dialog-title button{max-height:2.77em}
.h5p-hub-publish .tip-keywords{top:2.5em}
.h5p-hub-publish .image-preview,.h5p-hub-registration .image-preview{width:4em;height:3em;margin-right:0.5em;display:inline-block;background-size:cover;background-position:center}
.h5p-hub-publish .image-upload-container,.h5p-hub-registration .image-upload-container{width:4em;height:3em;margin-right:1em;position:relative}.h5p-hub-publish .image-upload-container .image-preview,.h5p-hub-registration .image-upload-container .image-preview{position:absolute;left:4px;top:4px;width:calc(100% - 4px);height:calc(100% - 4px)}.h5p-hub-publish .image-upload-container .icon-close,.h5p-hub-registration .image-upload-container .icon-close{cursor:pointer}.h5p-hub-publish .image-upload-container .icon-close:before,.h5p-hub-registration .image-upload-container .icon-close:before{font-size:0.6em;padding:0.5em;line-height:1.1;color:#fff;background:#000;position:absolute;z-index:1;display:inline-block;right:-1.2em;top:-1.2em;border:3px solid #fff;border-radius:50%;cursor:pointer;transition:all 0.3s}.h5p-hub-publish .image-upload-container .icon-close:hover:before,.h5p-hub-registration .image-upload-container .icon-close:hover:before{background:#eee;color:#000}.h5p-hub-publish .image-upload-container .image-upload,.h5p-hub-registration .image-upload-container .image-upload{position:absolute;top:0;left:0;width:100%;height:100%;border:0.125em dashed #bebdcd;color:#bebdcd;text-align:center;transition:all 0.3s}.h5p-hub-publish .image-upload-container .image-upload input,.h5p-hub-registration .image-upload-container .image-upload input{position:absolute;left:0;top:0;width:100%;height:100%;cursor:pointer;opacity:0}.h5p-hub-publish .image-upload-container .image-upload input::-webkit-file-upload-button,.h5p-hub-registration .image-upload-container .image-upload input::-webkit-file-upload-button{visibility:hidden}.h5p-hub-publish .image-upload-container .image-upload:hover,.h5p-hub-registration .image-upload-container .image-upload:hover{color:#777;border-color:#777}.h5p-hub-publish .image-upload-container .image-upload:before,.h5p-hub-registration .image-upload-container .image-upload:before{content:"+";font-size:2em;display:inline-block;position:relative;top:50%;transform:translateY(-50%)}.h5p-hub-publish .image-upload-container .image-upload.image-selected,.h5p-hub-registration .image-upload-container .image-upload.image-selected{border-style:solid;border-radius:0.1em}.h5p-hub-publish .image-upload-container .image-upload.image-selected:before,.h5p-hub-registration .image-upload-container .image-upload.image-selected:before{display:none}
.h5p-hub-publish .optional .keywords .form-element label{margin-bottom:0.708em}.h5p-hub-publish .optional #screenshots{display:flex;flex-wrap:wrap;flex-direction:column}.h5p-hub-publish .optional #screenshots .image-upload-container{margin-top:0.4em}.h5p-hub-publish .optional #screenshots .row{margin-top:0.5em}.h5p-hub-publish .optional #screenshots .row .form-element{padding:0}.h5p-hub-publish .optional #screenshots .alt-text{padding:0.3em}.h5p-hub-publish .optional .optional-second-part{display:flex}@media (max-width: 576px){.h5p-hub-publish .optional .optional-second-part{flex-wrap:wrap}}.h5p-hub-publish .optional #long-description{height:10.458em}.h5p-hub-publish .optional #short-description{height:6.333em}
.h5p-hub-publish .step-content.review .review-header{margin-bottom:1em;color:#363636}.h5p-hub-publish .step-content.review dl{border-top:1px solid #d5d5d5;margin:1.25em 0 0 0}.h5p-hub-publish .step-content.review .definition{border-bottom:1px solid #d5d5d5;display:flex}.h5p-hub-publish .step-content.review .definition dt{width:25%;min-width:25%;background:#f4f5f9;display:inline-block;padding:0.5em 0 0.5em 1em}.h5p-hub-publish .step-content.review .definition dd{color:#707475;display:inline-block;margin:0;padding:0.5em 0 0.5em 1em}.h5p-hub-publish .step-content.review .definition .img-alt{display:flex;align-items:center}.h5p-hub-publish .step-content.review .definition .screenshots{margin-bottom:0.2em}.h5p-hub-publish .step-content.review .definition .screenshots:last-child{margin-bottom:0}.h5p-hub-publish .step-content.review .definition .screenshots .image-preview{font-size:0.75em}
.h5p-hub-publish .success-page{text-align:center}.h5p-hub-publish .success-page .step-icon-success{font-size:0.75em;border-radius:50%;border:0.462em solid #e1e1e1;width:3.2em;height:3.2em;line-height:2.276;display:inline-block;box-sizing:border-box;background:#0ea385;border-color:#20d2b2;color:#fff;margin-bottom:0.667em}.h5p-hub-publish .success-page .submitted-text{color:#0ea385;margin-bottom:2.167em;font-size:0.75em}.h5p-hub-publish .success-page .content-type{letter-spacing:0.146em;color:#303438;margin-bottom:0.7em}.h5p-hub-publish .success-page .title{font-size:1.75em;margin-bottom:0.5em;color:#1a1a1a}.h5p-hub-publish .success-page .now-submitted-text{font-size:1.458em;margin-bottom:1.75em;color:#1a1a1a}.h5p-hub-publish .success-page .content-available{font-size:0.833em;color:#707475}
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}
@keyframes spinner{0%{transform:translate3d(-50%, -50%, 0) rotate(0deg)}100%{transform:translate3d(-50%, -50%, 0) rotate(360deg)}}.h5p-hub-publish,.h5p-hub-registration-wrapper{position:relative;margin:2em auto;font-family:'Open Sans', sans-serif;max-width:1024px;border:1px solid #2c9586;border-radius:0.167em;box-sizing:border-box;font-size:18px;box-shadow:0px 0px 20px rgba(0,0,0,0.1)}.h5p-hub-publish .header,.h5p-hub-registration-wrapper .header{padding:1.5em;display:flex;align-items:center;width:100%;box-sizing:border-box;border-bottom:1px solid #d5d5d7}.h5p-hub-publish .header .title,.h5p-hub-registration-wrapper .header .title{font-size:1.458em;flex-grow:1}.h5p-hub-publish .step-panel,.h5p-hub-registration-wrapper .step-panel{margin:2em;border-radius:0.208em;border:1px solid #d5d5d7}.h5p-hub-publish .step-title,.h5p-hub-registration-wrapper .step-title{color:#1a1a1a;font-size:1.250em;font-weight:bold;border-bottom:1px solid #ccc;padding:1.2em 1.8em}.h5p-hub-publish .step-content,.h5p-hub-registration-wrapper .step-content{padding:2em}.h5p-hub-publish .footer,.h5p-hub-registration-wrapper .footer{padding:0 2em 2em;width:100%;box-sizing:border-box;position:relative}.h5p-hub-publish .footer .navigation,.h5p-hub-registration-wrapper .footer .navigation{display:flex}.h5p-hub-publish .footer .navigation button:before,.h5p-hub-registration-wrapper .footer .navigation button:before{font-family:'h5p';font-size:0.75em;content:"\e91a";transform:rotate(180deg);display:inline-block;margin-right:1em;line-height:1;position:relative;top:-0.1em}.h5p-hub-publish .footer .navigation .back:before,.h5p-hub-registration-wrapper .footer .navigation .back:before{transform:rotate(0)}.h5p-hub-publish .footer .navigation #share-in-process::before,.h5p-hub-registration-wrapper .footer .navigation #share-in-process::before{font-family:"h5p";font-size:0.75em;content:"\e928";animation:2s linear infinite spinner;top:0.5em}.h5p-hub-publish .footer .navigation .next,.h5p-hub-registration-wrapper .footer .navigation .next{margin-left:auto}.h5p-hub-publish .tip-text-field,.h5p-hub-registration-wrapper .tip-text-field{top:1.5em}.h5p-hub-publish .share-error,.h5p-hub-registration-wrapper .share-error{padding:0 2em 2em;text-align:end}.h5p-hub-publish .bold,.h5p-hub-registration-wrapper .bold{font-weight:bold}.h5p-hub-publish .row,.h5p-hub-registration-wrapper .row{display:flex;flex-wrap:wrap;margin-right:-1em}.h5p-hub-publish .row .form-element,.h5p-hub-registration-wrapper .row .form-element{flex-basis:100%;flex:1;min-width:17em;align-self:flex-end;border-right:1em solid #ffffff}@media (max-width: 576px){.h5p-hub-publish .row .form-element,.h5p-hub-registration-wrapper .row .form-element{min-width:calc(100% - 1em)}}.h5p-hub-publish .columns,.h5p-hub-registration-wrapper .columns{display:flex;margin-right:-1em}@media (max-width: 576px){.h5p-hub-publish .columns,.h5p-hub-registration-wrapper .columns{flex-wrap:wrap}}.h5p-hub-publish .columns .column,.h5p-hub-registration-wrapper .columns .column{width:50%;border-right:1em solid #ffffff}@media (max-width: 576px){.h5p-hub-publish .columns .column,.h5p-hub-registration-wrapper .columns .column{width:100%;margin-right:0}}.h5p-hub-publish .sharing-note,.h5p-hub-registration-wrapper .sharing-note{text-align:center;color:#707475;font-size:0.833em;width:calc(100% - 4.9em);position:absolute;z-index:-1;top:0.65em;box-sizing:border-box;padding:0 8em}.h5p-hub-publish .sharing-note .icon-info:before,.h5p-hub-registration-wrapper .sharing-note .icon-info:before{font-size:0.5em;display:inline-block;margin-right:1em;background:#d1d7e3;padding:0.4em;border-radius:50%;position:relative;top:-0.25em}.h5p-hub-publish .sr-only,.h5p-hub-registration-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.h5p-hub-publish [class^="icon-"],.h5p-hub-publish [class*=" icon-"],.h5p-hub-registration-wrapper [class^="icon-"],.h5p-hub-registration-wrapper [class*=" icon-"]{font-family:'h5p' !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.h5p-hub-publish .icon-dropdown:before,.h5p-hub-registration-wrapper .icon-dropdown:before{content:"\e925"}.h5p-hub-publish .icon-info:before,.h5p-hub-registration-wrapper .icon-info:before{content:"\e93c"}.h5p-hub-publish .icon-thick-arrow:before,.h5p-hub-registration-wrapper .icon-thick-arrow:before{content:"\e91a"}.h5p-hub-publish .icon-check:before,.h5p-hub-registration-wrapper .icon-check:before{content:"\e933"}.h5p-hub-publish .icon-close:before,.h5p-hub-registration-wrapper .icon-close:before{content:"\e93a"}.h5p-hub-publish .icon-plus:before,.h5p-hub-registration-wrapper .icon-plus:before{content:"\e939"}

View File

@ -3,15 +3,27 @@
/* Custom H5P font to use for icons. */
@font-face {
font-family: 'h5p';
src: url('../fonts/h5p-core-24.eot?mz1lkp');
src: url('../fonts/h5p-core-24.eot?mz1lkp#iefix') format('embedded-opentype'),
url('../fonts/h5p-core-24.ttf?mz1lkp') format('truetype'),
url('../fonts/h5p-core-24.woff?mz1lkp') format('woff'),
url('../fonts/h5p-core-24.svg?mz1lkp#h5p') format('svg');
src: url('../fonts/h5p-core-26.eot?9pg14');
src: url('../fonts/h5p-core-26.eot?9pg14#iefix') format('embedded-opentype'),
url('../fonts/h5p-core-26.ttf?9pg14') format('truetype'),
url('../fonts/h5p-core-26.woff?9pg14') format('woff'),
url('../fonts/h5p-core-26.svg?9pg14#h5p-core-26') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'h5p-hub-publish';
src: url('../fonts/h5p-hub-publish.eot?wy8ylc');
src: url('../fonts/h5p-hub-publish.eot?wy8ylc#iefix') format('embedded-opentype'),
url('../fonts/h5p-hub-publish.ttf?wy8ylc') format('truetype'),
url('../fonts/h5p-hub-publish.woff?wy8ylc') format('woff'),
url('../fonts/h5p-hub-publish.svg?wy8ylc#h5p-hub') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
html.h5p-iframe, html.h5p-iframe > body {
font-family: Sans-Serif; /* Use the browser's default sans-serif font. (Since Heletica doesn't look nice on Windows, and Arial on OS X.) */
width: 100%;
@ -582,3 +594,30 @@ iframe.h5peditor-semi-fullscreen {
.h5p-content.using-mouse *:not(textarea):focus {
outline: none !important;
}
.h5p-content-hub-button:before {
font-family: "h5p";
margin-right: 0.5em;
font-size: 0.7em;
line-height: 1;
}
.h5p-content-hub-button.unpublish:before {
content: "\e916";
}
.h5p-content-hub-button.waiting:before,
.h5p-content-hub-button.sync:before {
content: "\e917";
}
.h5p-content-hub-button.waiting:before {
display: inline-block;
animation: rotate 2s linear infinite;
}
@keyframes rotate {
to {
transform: rotate(360deg);
}
}