diff --git a/src/index.html b/src/index.html
index b5d4bc2..6f50e29 100644
--- a/src/index.html
+++ b/src/index.html
@@ -91,10 +91,11 @@
display: flex;
flex-direction: column;
will-change: -webkit-filter;
- transition: 0.15s ease 0.4s;
+ transition: 0.15s ease 0.2s;
}
.overlay-visible .main-container {
- transition-duration: 0.3s;
+ transition-duration: 0.5s;
+ transition-delay: 0.4s;
-webkit-filter: blur(3px);
}
.code-side,
@@ -170,8 +171,12 @@
writing-mode: vertical-lr;
padding: 10px 5px;
}
+ .code-wrap__header .caret {
+ transition: 0.2s ease;
+ }
.is-minimized .code-wrap__header .caret {
- display: none;
+ opacity: 0;
+ transform: translateY(10px);
}
.code-wrap__header-btn {
width: 18px;
@@ -758,7 +763,7 @@
CSS
-
+
Choose from popular libraries:
diff --git a/src/script.js b/src/script.js
index 0d59004..37f23da 100644
--- a/src/script.js
+++ b/src/script.js
@@ -324,8 +324,8 @@
function refreshEditor() {
titleInput.value = currentItem.title || 'Untitled';
- externalJsTextarea.value = currentItem.externalLibs && (currentItem.externalLibs.js || '');
- externalCssTextarea.value = currentItem.externalLibs && (currentItem.externalLibs.css || '');
+ externalJsTextarea.value = (currentItem.externalLibs && currentItem.externalLibs.js) || '';
+ externalCssTextarea.value = (currentItem.externalLibs && currentItem.externalLibs.css) || '';
externalJsTextarea.dispatchEvent(new Event('change'));
editur.cm.html.setValue(currentItem.html);
@@ -646,15 +646,18 @@
utils.onButtonClick(helpBtn, function () {
helpModal.classList.toggle('is-modal-visible');
+ document.body.classList[helpModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
trackEvent('ui', 'helpButtonClick');
});
utils.onButtonClick(addLibraryBtn, function () {
addLibraryModal.classList.toggle('is-modal-visible');
+ document.body.classList[addLibraryModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
trackEvent('ui', 'addLibraryButtonClick');
});
notificationsBtn.addEventListener('click', function () {
notificationsModal.classList.toggle('is-modal-visible');
+ document.body.classList[notificationsModal.classList.contains('is-modal-visible') ? 'add' : 'remove']('overlay-visible');
if (notificationsModal.classList.contains('is-modal-visible') && !hasSeenNotifications) {
hasSeenNotifications = true;
notificationsBtn.classList.remove('has-new');
@@ -781,7 +784,7 @@
});
utils.onButtonClick(settingsBtn, function() {
- if (!chrome.runtime.openOptionsPage) {
+ if (chrome.runtime.openOptionsPage) {
// New way to open options pages, if supported (Chrome 42+).
// Bug: https://bugs.chromium.org/p/chromium/issues/detail?id=601997
// Until this bug fixes, use the