From 6aaf7f3138498176a553770ef79b381f787187f1 Mon Sep 17 00:00:00 2001 From: vict0rsch Date: Fri, 6 May 2022 15:52:55 +0200 Subject: [PATCH] update user guide & keyboard shortcuts --- src/popup/css/popup.css | 20 +++++++----- src/popup/js/memory.js | 4 +-- src/popup/min/popup.min.css | 2 +- src/popup/min/popup.min.html | 2 +- src/popup/min/popup.min.js | 2 +- src/popup/popup.html | 63 +++++++++++++++++++++++++++++++++--- 6 files changed, 76 insertions(+), 17 deletions(-) diff --git a/src/popup/css/popup.css b/src/popup/css/popup.css index 6e52dbc4..c34fccfe 100644 --- a/src/popup/css/popup.css +++ b/src/popup/css/popup.css @@ -117,9 +117,11 @@ button:hover, code { font-family: "Fira Code", monospace; padding: 1px 4px; - vertical-align: text-top; + /* vertical-align: middle; */ border-radius: var(--round); background-color: rgb(238, 238, 238); + margin: 1px auto; + display: inline-block; } .code-font { font-family: "Fira Code", monospace; @@ -677,8 +679,9 @@ button.changed { margin-top: 16px; display: inline-block; } -#modal-whatsnew-content code { - font-size: 0.8rem; +#modal-whatsnew-content code, +#modal-keyboard-content code { + font-size: 0.75rem; } /* @@ -744,12 +747,13 @@ button.changed { #no-paper-why-code { cursor: pointer; - border-radius: 100px; - min-height: 1.2rem !important; - min-width: 1.2rem !important; - display: inline-block; - text-align: center; + border-radius: 1000px; + min-height: 1.5rem !important; + min-width: 1.5rem !important; vertical-align: middle; + padding: 6px !important; + line-height: 0; + font-weight: inherit; } #manual-trigger-wrapper { diff --git a/src/popup/js/memory.js b/src/popup/js/memory.js index 9fa6dace..33cff55c 100644 --- a/src/popup/js/memory.js +++ b/src/popup/js/memory.js @@ -53,11 +53,11 @@ const updatePopupPaperNoMemory = async (url) => {

This paper is not in your Memory  - ? +

-
Here's a ${animal} for your trouble
+
Here's a ${animal} for your trouble

${ascii}
diff --git a/src/popup/min/popup.min.css b/src/popup/min/popup.min.css index 7234f150..4b14a585 100644 --- a/src/popup/min/popup.min.css +++ b/src/popup/min/popup.min.css @@ -1 +1 @@ -:root{--blue:#0276ff;--red:#b31b1b;--lightRed:#cc5050;--round:4px;--rounder:6px;--outline:grey;--color:black}@supports (-webkit-appearance:none) or (-moz-appearance:none){input[type=checkbox]{--active:rgb(201, 19, 19, 0.65);--active-inner:#fff;--focus:2px rgba(254, 39, 39, 0.596);--border:#c5aaaa;--border-hover:#b94141;--background:#fff;--disabled:#f9e1e1;--disabled-inner:#f9e1e1;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:0;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc,var(--border));background:var(--b,var(--background));-webkit-transition:background .3s,border-color .3s,box-shadow .2s;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:"";display:block;left:0;top:0;position:absolute;-webkit-transition:opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease);transition:opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease);transition:transform var(--d-t,.3s) var(--d-t-e,ease),opacity var(--d-o,.2s);transition:transform var(--d-t,.3s) var(--d-t-e,ease),opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease)}input[type=checkbox]:checked{--b:var(--active);--bc:var(--active);--d-o:0.3s;--d-t:0.6s;--d-t-e:cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=checkbox]:disabled{--b:var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b:var(--disabled-inner);--bc:var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc:var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o,0)}input[type=checkbox]:not(.switch):checked{--o:1}input[type=checkbox]+label{display:inline-block;cursor:pointer;vertical-align:sub;margin-left:4px}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab,var(--border));-webkit-transform:translateX(var(--x,0));transform:translateX(var(--x,0))}input[type=checkbox].switch:checked{--ab:var(--active-inner);--x:17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}}html{min-width:450px;max-width:450px;min-height:450px;font-size:16px}body{margin:0;min-height:100vh;max-width:450px;min-width:450px;display:flex;flex-direction:column;font-family:Yantramanav;position:relative}#popup-container{padding:16px 32px 24px 32px;flex:1;display:flex;align-items:center;justify-content:center;font-size:.9rem;position:relative;box-sizing:border-box;max-width:450px;min-width:450px;margin:auto}textarea{border-radius:var(--round);border:1px solid #aaa;font-family:Yantramanav}.memory-search-wrapper:focus-within,:not(.select2-search__field,.switch):focus{outline:2px solid var(--outline)!important;box-shadow:none}#popup-header{background-color:var(--red);padding:12px;color:#fff;display:flex;justify-content:start;align-items:center;border-radius:0 0 75% 0/50%;box-shadow:14px 30px 122px -30px rgba(0,0,0,.75)}#filter-favorites{height:32px;width:32px;display:flex;align-items:center;justify-content:center;cursor:pointer}h1{margin:0;font-weight:300;font-size:1.5rem}p{font-size:1rem}h3{font-size:1.2rem}h5{font-size:.9rem}svg{stroke-width:1.15;stroke:#7c7f8b;fill:none;stroke-linecap:round;stroke-linejoin:round}strong{font-weight:500}.file-upload-label,button{border:1px solid var(--red);border-radius:var(--rounder);padding:4px 6px;background-color:#fff;transition:all ease .2s;cursor:pointer}.file-upload-label:disabled,button:disabled{cursor:not-allowed;pointer-events:none;border-color:#e7a9a9}.file-upload-label:hover,button:hover{border-color:var(--red);background-color:#fdebeb}code{font-family:"Fira Code",monospace;padding:1px 4px;vertical-align:text-top;border-radius:var(--round);background-color:#eee}.code-font{font-family:"Fira Code",monospace}#header-icon{stroke:#fff}#notArxiv{font-weight:300}.tabler-icon{height:32px;width:32px;color:var(--red);stroke-width:1px}#options label{max-width:330px}#menu-switch-svg{color:#2b2b3d}.memory-icon-svg{height:20px;width:20px;pointer-events:none}#menu-switch{position:absolute;bottom:12px;right:12px;cursor:pointer;z-index:6;height:45px;width:45px;display:flex;justify-content:center;align-items:center}#menu-switch svg{transition:all .2s ease-in-out}#menu-switch svg:hover{transform:scale(1.1)}#tabler-copy-link{transition:all .2s ease-in-out;cursor:pointer;border-radius:100000px;color:var(--blue)}#tabler-copy-link:hover{transform:scale(1.2)}.options-emoji{font-size:1.2rem}#menu-container{position:absolute;top:0;left:0;height:100%;background:#fff;z-index:5;padding:16px 32px;width:calc(100% - 64px);max-height:calc(100% - 32px);overflow:scroll}#menu-container p{margin-top:8px;margin-bottom:8px}#menu-container h4{font-size:1rem}#menu-container label{font-size:.9rem}#helpButton{font-size:.8rem;position:absolute;bottom:16px;right:16px;border:1px solid var(--red);background:#fff;padding:2px 6px;border-radius:100px;transition:all .1s ease-in-out}#helpButton:hover{transform:scale(1.5)}#isArxiv{display:flex;justify-content:center;align-items:center;flex-direction:column;min-width:100%;margin-bottom:16px}#markdown-header div{transition:all .2s ease-in-out}#markdown-header div:hover{transform:scale(1.2)}#check-feedback{position:fixed;bottom:48px;right:-100px;opacity:0;-webkit-box-shadow:14px 30px 122px -30px rgba(0,0,0,.75);-moz-box-shadow:14px 30px 122px -30px rgba(0,0,0,.75);box-shadow:14px 30px 122px -30px rgba(0,0,0,.75)}#check-feedback svg{color:#00c854!important}#memory-spinner{position:absolute;bottom:16px;left:16px}#memory-switch{position:absolute;bottom:16px;left:16px;cursor:pointer;color:#4934a5;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s ease-in-out;z-index:3}#memory-switch-open{stroke:var(--red);height:38px;width:38px}#memory-switch-close{height:30px;width:30px;fill:#7c7f8b;stroke:#fff}#memory-switch:hover{transform:scale(1.1)}#memory-switch svg{height:40px;width:40px}#close-menu-btn{stroke:#fff;fill:#7c7f8b;height:40px;width:40px}#memory-container{position:absolute;bottom:0;left:0;height:100%;background:#fff;z-index:2;width:100%;height:100%;overflow:scroll}#memory-table{padding:16px;padding-top:0;margin-bottom:40px}.memory-container{padding:12px 16px;margin-bottom:14px;border:1px solid rgba(230,230,230,.75);position:relative;border-radius:8px;transition:all .1s ease!important;font-size:.95rem}.memory-container.favorite{border:2px solid var(--red)!important}.memory-container h4{font-weight:500;color:#3a3e52;font-size:1rem}.memory-delete{color:var(--red);position:absolute;right:-8px;top:-8px;font-size:2rem;line-height:20px;cursor:pointer;height:20px;width:20px;border-radius:50%;border:1px solid var(--red);padding-left:0;text-align:center;background-color:#fff}.memory-title{margin:0}#memory-filters{margin:16px;display:flex;align-items:center;justify-content:space-between}.memory-item-svg-div{cursor:pointer;display:flex;border-radius:var(--rounder)}.memory-item-feedback{font-size:.75rem;color:green}#popup-feedback-copied{color:green;position:absolute;left:50%;transform:translate(-50%,0);bottom:-25px;width:280px;text-align:center;font-size:.75rem}#memory-search{background:0 0;outline:0;border:0;color:inherit;padding-right:18px}#memory-search:focus{outline:0!important}#memory-search-clear-icon{position:absolute;top:8px;right:8px;width:10px;cursor:pointer;font-size:1rem;visibility:hidden}.memory-search-wrapper{position:relative;display:flex;border-radius:var(--rounder);border:1px solid var(--outline);padding:8px}#memory-select{border-radius:var(--rounder);border:1px solid var(--outline);padding:8px}.memory-sort-arrow-svg{height:30px;width:30px;cursor:pointer;stroke:#313131}#memory-sort-arrow{border:1px solid var(--outline);border-radius:var(--rounder);height:33px;width:33px;display:flex;justify-content:center;align-items:center;color:inherit;stroke:inherit}.memory-item-faded{color:rgba(54,54,54,.7)}.memory-authors{color:#292929}#popup-authors{text-align:center;max-width:95%;font-weight:300;color:grey}#popup-displayId{color:gray}.label{font-family:"Fira Code",monospace;margin-right:16px;font-size:.8rem}.memory-note-div{font-size:.8rem;margin-top:4px}.edit-note-item{color:var(--blue);cursor:pointer}.edit-note-item:hover{color:#6da4e4;font-style:italic}.note-content-header{font-weight:600;font-style:italic;margin-right:3px}.extended-item div p{font-size:.8rem}.form-code-input{width:85%;border-radius:var(--round);border:1px solid #aaa;margin-top:8px;line-height:1.1rem;padding:6px;margin-bottom:4px}#popup-code-link,.memory-code-link{text-decoration:underline;color:#1656b8;cursor:pointer;margin-bottom:16px;word-break:break-all}#popup-code-link{font-size:1.05rem}.popup-form-note-textarea{width:85%;font-size:.9rem}.form-note textarea{width:85%;margin-top:8px;margin-bottom:8px;padding:8px;font-size:.9rem}.form-note-buttons{text-align:end}.memory-tag{color:#5c5c5c;padding:3px 6px;background:#ececec;margin-right:8px;border-radius:var(--round);cursor:pointer}.memory-display-id,.memory-visits{font-size:.7rem}#popup-copy-icons .memory-item-svg-div{transition:all ease 250ms}#popup-copy-icons .memory-item-svg-div:hover{transform:scale(1.1)}#delete-paper-modal{width:100%;height:100%;background-color:#e0e0e0;position:absolute;top:0;left:0;z-index:100;display:flex;justify-content:center;align-items:center;flex-direction:column}.memory-item-favorite{cursor:pointer;margin-right:4px;display:inline-flex;justify-content:center;align-items:center;position:relative;width:18px;height:18px}.memory-item-favorite-svg{position:absolute;bottom:-5px;left:-2px}svg.favorite{stroke-width:2px!important;color:var(--red)!important;stroke:var(--red)!important}.popup-click-svg{height:30px;width:30px;pointer-events:none}button.changed{border:3px solid green}.btn-secondary{background-color:#4f6272;color:#f0f0f0;border:0}.btn-secondary:hover{background-color:#404e5c;color:#fff;border:0}.select2-search__field{font-size:.85rem!important}.errorTitle{margin:0}.flex-center-center{display:flex;align-items:center;justify-content:center}.flex-center-evenly{display:flex;align-items:center;justify-content:space-evenly}.flex-center-between{display:flex;align-items:center;justify-content:space-between}.flex-center-start{display:flex;align-items:center;justify-content:start}#custom-title-textarea{font-family:Fira-code,monospace}#popup-delete-paper{cursor:pointer}#popup-delete-paper svg:hover{stroke:var(--red)}#whats-new-container{position:absolute;top:-65px;right:0;cursor:pointer}#whats-new-marker{min-width:12px;min-height:12px;border-radius:100%;background:radial-gradient(#dd2d44,#9f051c);position:absolute;top:0;right:3px}#modal-whatsnew-content li{margin-top:4px}#modal-whatsnew-content a{margin-top:16px;display:inline-block}#modal-whatsnew-content code{font-size:.8rem}.popup-modal-wrapper{display:none;position:fixed;z-index:10;left:0;top:0;width:100%;max-width:450px;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.2);backdrop-filter:blur(6px);justify-content:center;align-items:center;transition:all ease .5s}.popup-modal-contents{background-color:#fefefe;padding:20px 35px;border-radius:var(--rounder);width:70%;max-height:350px;overflow:scroll}#close-popup-modal{color:#aaa;float:right;font-size:28px}#close-popup-modal:focus,#close-popup-modal:hover{color:#000;text-decoration:none;cursor:pointer}.popup-modal-contents ul{font-size:.9rem;padding-left:12px}#no-paper-div h3{font-size:1rem}#no-paper-why-code{cursor:pointer;border-radius:100px;min-height:1.2rem!important;min-width:1.2rem!important;display:inline-block;text-align:center;vertical-align:middle}#manual-trigger-wrapper{min-height:120px;max-width:300px}#manual-trigger-btn{display:flex;justify-content:center;align-items:center;padding:8px 12px;border-radius:4px;background-color:var(--red);cursor:pointer;color:#fff;margin-bottom:24px;max-width:130px;min-width:130px;margin:auto;margin-bottom:20px}#manual-trigger-btn:hover{background-color:#971010}#ascii-art-div{font-family:"Fira Code",monospace;font-size:.6rem;white-space:pre;display:flex;justify-content:center}.sk-folding-cube{margin:20px auto;width:40px;height:40px;position:relative;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.sk-folding-cube .sk-cube{float:left;width:50%;height:50%;position:relative;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}.sk-folding-cube .sk-cube:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#b31b1b;-webkit-animation:sk-foldCubeAngle 2.4s infinite linear both;animation:sk-foldCubeAngle 2.4s infinite linear both;-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%}.sk-folding-cube .sk-cube2{-webkit-transform:scale(1.1) rotateZ(90deg);transform:scale(1.1) rotateZ(90deg)}.sk-folding-cube .sk-cube3{-webkit-transform:scale(1.1) rotateZ(180deg);transform:scale(1.1) rotateZ(180deg)}.sk-folding-cube .sk-cube4{-webkit-transform:scale(1.1) rotateZ(270deg);transform:scale(1.1) rotateZ(270deg)}.sk-folding-cube .sk-cube2:before{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-folding-cube .sk-cube3:before{-webkit-animation-delay:.6s;animation-delay:.6s}.sk-folding-cube .sk-cube4:before{-webkit-animation-delay:.9s;animation-delay:.9s}@-webkit-keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}}@keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}} \ No newline at end of file +:root{--blue:#0276ff;--red:#b31b1b;--lightRed:#cc5050;--round:4px;--rounder:6px;--outline:grey;--color:black}@supports (-webkit-appearance:none) or (-moz-appearance:none){input[type=checkbox]{--active:rgb(201, 19, 19, 0.65);--active-inner:#fff;--focus:2px rgba(254, 39, 39, 0.596);--border:#c5aaaa;--border-hover:#b94141;--background:#fff;--disabled:#f9e1e1;--disabled-inner:#f9e1e1;-webkit-appearance:none;-moz-appearance:none;height:21px;outline:0;display:inline-block;vertical-align:top;position:relative;margin:0;cursor:pointer;border:1px solid var(--bc,var(--border));background:var(--b,var(--background));-webkit-transition:background .3s,border-color .3s,box-shadow .2s;transition:background .3s,border-color .3s,box-shadow .2s}input[type=checkbox]:after{content:"";display:block;left:0;top:0;position:absolute;-webkit-transition:opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease);transition:opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease);transition:transform var(--d-t,.3s) var(--d-t-e,ease),opacity var(--d-o,.2s);transition:transform var(--d-t,.3s) var(--d-t-e,ease),opacity var(--d-o,.2s),-webkit-transform var(--d-t,.3s) var(--d-t-e,ease)}input[type=checkbox]:checked{--b:var(--active);--bc:var(--active);--d-o:0.3s;--d-t:0.6s;--d-t-e:cubic-bezier(0.2, 0.85, 0.32, 1.2)}input[type=checkbox]:disabled{--b:var(--disabled);cursor:not-allowed;opacity:.9}input[type=checkbox]:disabled:checked{--b:var(--disabled-inner);--bc:var(--border)}input[type=checkbox]:disabled+label{cursor:not-allowed}input[type=checkbox]:hover:not(:checked):not(:disabled){--bc:var(--border-hover)}input[type=checkbox]:focus{box-shadow:0 0 0 var(--focus)}input[type=checkbox]:not(.switch){width:21px}input[type=checkbox]:not(.switch):after{opacity:var(--o,0)}input[type=checkbox]:not(.switch):checked{--o:1}input[type=checkbox]+label{display:inline-block;cursor:pointer;vertical-align:sub;margin-left:4px}input[type=checkbox].switch{width:38px;border-radius:11px}input[type=checkbox].switch:after{left:2px;top:2px;border-radius:50%;width:15px;height:15px;background:var(--ab,var(--border));-webkit-transform:translateX(var(--x,0));transform:translateX(var(--x,0))}input[type=checkbox].switch:checked{--ab:var(--active-inner);--x:17px}input[type=checkbox].switch:disabled:not(:checked):after{opacity:.6}}html{min-width:450px;max-width:450px;min-height:450px;font-size:16px}body{margin:0;min-height:100vh;max-width:450px;min-width:450px;display:flex;flex-direction:column;font-family:Yantramanav;position:relative}#popup-container{padding:16px 32px 24px 32px;flex:1;display:flex;align-items:center;justify-content:center;font-size:.9rem;position:relative;box-sizing:border-box;max-width:450px;min-width:450px;margin:auto}textarea{border-radius:var(--round);border:1px solid #aaa;font-family:Yantramanav}.memory-search-wrapper:focus-within,:not(.select2-search__field,.switch):focus{outline:2px solid var(--outline)!important;box-shadow:none}#popup-header{background-color:var(--red);padding:12px;color:#fff;display:flex;justify-content:start;align-items:center;border-radius:0 0 75% 0/50%;box-shadow:14px 30px 122px -30px rgba(0,0,0,.75)}#filter-favorites{height:32px;width:32px;display:flex;align-items:center;justify-content:center;cursor:pointer}h1{margin:0;font-weight:300;font-size:1.5rem}p{font-size:1rem}h3{font-size:1.2rem}h5{font-size:.9rem}svg{stroke-width:1.15;stroke:#7c7f8b;fill:none;stroke-linecap:round;stroke-linejoin:round}strong{font-weight:500}.file-upload-label,button{border:1px solid var(--red);border-radius:var(--rounder);padding:4px 6px;background-color:#fff;transition:all ease .2s;cursor:pointer}.file-upload-label:disabled,button:disabled{cursor:not-allowed;pointer-events:none;border-color:#e7a9a9}.file-upload-label:hover,button:hover{border-color:var(--red);background-color:#fdebeb}code{font-family:"Fira Code",monospace;padding:1px 4px;border-radius:var(--round);background-color:#eee;margin:1px auto;display:inline-block}.code-font{font-family:"Fira Code",monospace}#header-icon{stroke:#fff}#notArxiv{font-weight:300}.tabler-icon{height:32px;width:32px;color:var(--red);stroke-width:1px}#options label{max-width:330px}#menu-switch-svg{color:#2b2b3d}.memory-icon-svg{height:20px;width:20px;pointer-events:none}#menu-switch{position:absolute;bottom:12px;right:12px;cursor:pointer;z-index:6;height:45px;width:45px;display:flex;justify-content:center;align-items:center}#menu-switch svg{transition:all .2s ease-in-out}#menu-switch svg:hover{transform:scale(1.1)}#tabler-copy-link{transition:all .2s ease-in-out;cursor:pointer;border-radius:100000px;color:var(--blue)}#tabler-copy-link:hover{transform:scale(1.2)}.options-emoji{font-size:1.2rem}#menu-container{position:absolute;top:0;left:0;height:100%;background:#fff;z-index:5;padding:16px 32px;width:calc(100% - 64px);max-height:calc(100% - 32px);overflow:scroll}#menu-container p{margin-top:8px;margin-bottom:8px}#menu-container h4{font-size:1rem}#menu-container label{font-size:.9rem}#helpButton{font-size:.8rem;position:absolute;bottom:16px;right:16px;border:1px solid var(--red);background:#fff;padding:2px 6px;border-radius:100px;transition:all .1s ease-in-out}#helpButton:hover{transform:scale(1.5)}#isArxiv{display:flex;justify-content:center;align-items:center;flex-direction:column;min-width:100%;margin-bottom:16px}#markdown-header div{transition:all .2s ease-in-out}#markdown-header div:hover{transform:scale(1.2)}#check-feedback{position:fixed;bottom:48px;right:-100px;opacity:0;-webkit-box-shadow:14px 30px 122px -30px rgba(0,0,0,.75);-moz-box-shadow:14px 30px 122px -30px rgba(0,0,0,.75);box-shadow:14px 30px 122px -30px rgba(0,0,0,.75)}#check-feedback svg{color:#00c854!important}#memory-spinner{position:absolute;bottom:16px;left:16px}#memory-switch{position:absolute;bottom:16px;left:16px;cursor:pointer;color:#4934a5;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s ease-in-out;z-index:3}#memory-switch-open{stroke:var(--red);height:38px;width:38px}#memory-switch-close{height:30px;width:30px;fill:#7c7f8b;stroke:#fff}#memory-switch:hover{transform:scale(1.1)}#memory-switch svg{height:40px;width:40px}#close-menu-btn{stroke:#fff;fill:#7c7f8b;height:40px;width:40px}#memory-container{position:absolute;bottom:0;left:0;height:100%;background:#fff;z-index:2;width:100%;height:100%;overflow:scroll}#memory-table{padding:16px;padding-top:0;margin-bottom:40px}.memory-container{padding:12px 16px;margin-bottom:14px;border:1px solid rgba(230,230,230,.75);position:relative;border-radius:8px;transition:all .1s ease!important;font-size:.95rem}.memory-container.favorite{border:2px solid var(--red)!important}.memory-container h4{font-weight:500;color:#3a3e52;font-size:1rem}.memory-delete{color:var(--red);position:absolute;right:-8px;top:-8px;font-size:2rem;line-height:20px;cursor:pointer;height:20px;width:20px;border-radius:50%;border:1px solid var(--red);padding-left:0;text-align:center;background-color:#fff}.memory-title{margin:0}#memory-filters{margin:16px;display:flex;align-items:center;justify-content:space-between}.memory-item-svg-div{cursor:pointer;display:flex;border-radius:var(--rounder)}.memory-item-feedback{font-size:.75rem;color:green}#popup-feedback-copied{color:green;position:absolute;left:50%;transform:translate(-50%,0);bottom:-25px;width:280px;text-align:center;font-size:.75rem}#memory-search{background:0 0;outline:0;border:0;color:inherit;padding-right:18px}#memory-search:focus{outline:0!important}#memory-search-clear-icon{position:absolute;top:8px;right:8px;width:10px;cursor:pointer;font-size:1rem;visibility:hidden}.memory-search-wrapper{position:relative;display:flex;border-radius:var(--rounder);border:1px solid var(--outline);padding:8px}#memory-select{border-radius:var(--rounder);border:1px solid var(--outline);padding:8px}.memory-sort-arrow-svg{height:30px;width:30px;cursor:pointer;stroke:#313131}#memory-sort-arrow{border:1px solid var(--outline);border-radius:var(--rounder);height:33px;width:33px;display:flex;justify-content:center;align-items:center;color:inherit;stroke:inherit}.memory-item-faded{color:rgba(54,54,54,.7)}.memory-authors{color:#292929}#popup-authors{text-align:center;max-width:95%;font-weight:300;color:grey}#popup-displayId{color:gray}.label{font-family:"Fira Code",monospace;margin-right:16px;font-size:.8rem}.memory-note-div{font-size:.8rem;margin-top:4px}.edit-note-item{color:var(--blue);cursor:pointer}.edit-note-item:hover{color:#6da4e4;font-style:italic}.note-content-header{font-weight:600;font-style:italic;margin-right:3px}.extended-item div p{font-size:.8rem}.form-code-input{width:85%;border-radius:var(--round);border:1px solid #aaa;margin-top:8px;line-height:1.1rem;padding:6px;margin-bottom:4px}#popup-code-link,.memory-code-link{text-decoration:underline;color:#1656b8;cursor:pointer;margin-bottom:16px;word-break:break-all}#popup-code-link{font-size:1.05rem}.popup-form-note-textarea{width:85%;font-size:.9rem}.form-note textarea{width:85%;margin-top:8px;margin-bottom:8px;padding:8px;font-size:.9rem}.form-note-buttons{text-align:end}.memory-tag{color:#5c5c5c;padding:3px 6px;background:#ececec;margin-right:8px;border-radius:var(--round);cursor:pointer}.memory-display-id,.memory-visits{font-size:.7rem}#popup-copy-icons .memory-item-svg-div{transition:all ease 250ms}#popup-copy-icons .memory-item-svg-div:hover{transform:scale(1.1)}#delete-paper-modal{width:100%;height:100%;background-color:#e0e0e0;position:absolute;top:0;left:0;z-index:100;display:flex;justify-content:center;align-items:center;flex-direction:column}.memory-item-favorite{cursor:pointer;margin-right:4px;display:inline-flex;justify-content:center;align-items:center;position:relative;width:18px;height:18px}.memory-item-favorite-svg{position:absolute;bottom:-5px;left:-2px}svg.favorite{stroke-width:2px!important;color:var(--red)!important;stroke:var(--red)!important}.popup-click-svg{height:30px;width:30px;pointer-events:none}button.changed{border:3px solid green}.btn-secondary{background-color:#4f6272;color:#f0f0f0;border:0}.btn-secondary:hover{background-color:#404e5c;color:#fff;border:0}.select2-search__field{font-size:.85rem!important}.errorTitle{margin:0}.flex-center-center{display:flex;align-items:center;justify-content:center}.flex-center-evenly{display:flex;align-items:center;justify-content:space-evenly}.flex-center-between{display:flex;align-items:center;justify-content:space-between}.flex-center-start{display:flex;align-items:center;justify-content:start}#custom-title-textarea{font-family:Fira-code,monospace}#popup-delete-paper{cursor:pointer}#popup-delete-paper svg:hover{stroke:var(--red)}#whats-new-container{position:absolute;top:-65px;right:0;cursor:pointer}#whats-new-marker{min-width:12px;min-height:12px;border-radius:100%;background:radial-gradient(#dd2d44,#9f051c);position:absolute;top:0;right:3px}#modal-whatsnew-content li{margin-top:4px}#modal-whatsnew-content a{margin-top:16px;display:inline-block}#modal-keyboard-content code,#modal-whatsnew-content code{font-size:.75rem}.popup-modal-wrapper{display:none;position:fixed;z-index:10;left:0;top:0;width:100%;max-width:450px;height:100%;overflow:auto;background-color:#000;background-color:rgba(0,0,0,.2);backdrop-filter:blur(6px);justify-content:center;align-items:center;transition:all ease .5s}.popup-modal-contents{background-color:#fefefe;padding:20px 35px;border-radius:var(--rounder);width:70%;max-height:350px;overflow:scroll}#close-popup-modal{color:#aaa;float:right;font-size:28px}#close-popup-modal:focus,#close-popup-modal:hover{color:#000;text-decoration:none;cursor:pointer}.popup-modal-contents ul{font-size:.9rem;padding-left:12px}#no-paper-div h3{font-size:1rem}#no-paper-why-code{cursor:pointer;border-radius:1000px;min-height:1.5rem!important;min-width:1.5rem!important;vertical-align:middle;padding:6px!important;line-height:0;font-weight:inherit}#manual-trigger-wrapper{min-height:120px;max-width:300px}#manual-trigger-btn{display:flex;justify-content:center;align-items:center;padding:8px 12px;border-radius:4px;background-color:var(--red);cursor:pointer;color:#fff;margin-bottom:24px;max-width:130px;min-width:130px;margin:auto;margin-bottom:20px}#manual-trigger-btn:hover{background-color:#971010}#ascii-art-div{font-family:"Fira Code",monospace;font-size:.6rem;white-space:pre;display:flex;justify-content:center}.sk-folding-cube{margin:20px auto;width:40px;height:40px;position:relative;-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.sk-folding-cube .sk-cube{float:left;width:50%;height:50%;position:relative;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}.sk-folding-cube .sk-cube:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#b31b1b;-webkit-animation:sk-foldCubeAngle 2.4s infinite linear both;animation:sk-foldCubeAngle 2.4s infinite linear both;-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%}.sk-folding-cube .sk-cube2{-webkit-transform:scale(1.1) rotateZ(90deg);transform:scale(1.1) rotateZ(90deg)}.sk-folding-cube .sk-cube3{-webkit-transform:scale(1.1) rotateZ(180deg);transform:scale(1.1) rotateZ(180deg)}.sk-folding-cube .sk-cube4{-webkit-transform:scale(1.1) rotateZ(270deg);transform:scale(1.1) rotateZ(270deg)}.sk-folding-cube .sk-cube2:before{-webkit-animation-delay:.3s;animation-delay:.3s}.sk-folding-cube .sk-cube3:before{-webkit-animation-delay:.6s;animation-delay:.6s}.sk-folding-cube .sk-cube4:before{-webkit-animation-delay:.9s;animation-delay:.9s}@-webkit-keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}}@keyframes sk-foldCubeAngle{0%,10%{-webkit-transform:perspective(140px) rotateX(-180deg);transform:perspective(140px) rotateX(-180deg);opacity:0}25%,75%{-webkit-transform:perspective(140px) rotateX(0);transform:perspective(140px) rotateX(0);opacity:1}100%,90%{-webkit-transform:perspective(140px) rotateY(180deg);transform:perspective(140px) rotateY(180deg);opacity:0}} \ No newline at end of file diff --git a/src/popup/min/popup.min.html b/src/popup/min/popup.min.html index c11ea111..ad506269 100755 --- a/src/popup/min/popup.min.html +++ b/src/popup/min/popup.min.html @@ -1,2 +1,2 @@
\ No newline at end of file + @import url("https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap");
\ No newline at end of file diff --git a/src/popup/min/popup.min.js b/src/popup/min/popup.min.js index d384ac53..5609bcd4 100644 --- a/src/popup/min/popup.min.js +++ b/src/popup/min/popup.min.js @@ -1,4 +1,4 @@ const addEventToClass=(e,t,a)=>{document.querySelectorAll(e).forEach(e=>{e.addEventListener(t,a)})},handleBackToFocus=e=>{const t=eventId(e);setTimeout(()=>{dispatch("memory-container--"+t,"focus")},250)},handleDeleteItem=e=>{e=eventId(e);showConfirmDeleteModal(e)},handleOpenItemLink=e=>{e=eventId(e);focusExistingOrCreateNewPaperTab(global.state.papers[e],!0)},handleOpenItemCodeLink=e=>{e=eventId(e),e=global.state.papers[e].codeLink;focusExistingOrCreateNewCodeTab(e)},handleCopyMarkdownLink=async e=>{var e=eventId(e),t=global.state.prefs,a=t.checkPreferPdf?"PDF":"Abstract",o=global.state.papers[e],o=makeMdLink(o,t);copyAndConfirmMemoryItem(e,o,`Markdown ${a} link copied!`)},handleCopyBibtex=e=>{var e=eventId(e),t=global.state.papers[e].bibtex;copyAndConfirmMemoryItem(e,bibtexToString(t),"Bibtex copied!")},handleCopyPDFLink=async e=>{var e=eventId(e),t=global.state.prefs,a=global.state.papers[e],a=(t.checkPreferPdf?paperToPDF:paperToAbs)(a),t=t.checkPreferPdf?"PDF":"Abstract";copyAndConfirmMemoryItem(e,a,t+" link copied!")},handleAddItemToFavorites=e=>{var e=eventId(e),t=hasClass("memory-container--"+e,"favorite");saveFavoriteItem(e,!t)},handleMemoryOpenLocal=e=>{e=eventId(e),e=global.state.files[e];e&&(e.id||0===e.id)&&chrome.downloads.open(e.id)},handleTextareaFocus=()=>{textareaFocusEnd(this)},handleMemorySaveEdits=e=>{var{note:t,codeLink:a}=getPaperEdits(e);saveNote(e,t),saveCodeLink(e,a),updatePaperTags(e,"memory-item-tags")},handleCancelPaperEdit=e=>{e.preventDefault();var e=eventId(e),t=global.state.papers[e];val(findEl(e,"form-note-textarea"),t.note),setHTML(findEl(e,"memory-item-tags"),getTagsOptions(t)),dispatch(findEl(e,"memory-item-edit"),"click")},handleTogglePaperEdit=e=>{e.preventDefault();e=eventId(e);const t=findEl("memory-container--"+e);var a=findEl(e,"code-and-note"),o=findEl(e,"extended-item"),s=findEl(e,"tag-list"),r=findEl(e,"memory-authors"),i=findEl(e,"edit-tags"),l=findEl(e,"memory-item-actions");const n=$(findEl(e,"memory-item-tags"));hasClass(t,"expand-open")?(removeClass(t,"expand-open"),slideDown(a,150),slideDown(s,150),slideDown(l,150),slideDown(r,150),slideUp(o,150),slideUp(i,150),setTimeout(()=>{n.select2("destroy")},500)):(addClass(t,"expand-open"),n.select2({...global.select2Options,width:"86%"}),hasClass(t,"has-monitoring")||n.on("change",monitorPaperEdits(e,!1)),t.classList.add("has-monitoring"),slideUp(a,150),slideUp(s,150),slideUp(l,150),slideUp(r,150),slideDown(o,150),slideDown(i,150))},handleMemorySelectChange=e=>{e=e.target.value;global.state.sortKey=e,sortMemory(),displayMemoryTable(),setMemorySortArrow("down")},handleMemorySortArrow=e=>{"memory-sort-arrow-down"===document.querySelector("#memory-sort-arrow svg").id?setMemorySortArrow("up"):setMemorySortArrow("down"),reverseMemory(),displayMemoryTable()},handleFilterFavorites=()=>{var e=!global.state.showFavorites;(global.state.showFavorites=e)?(addClass(findEl("filter-favorites").querySelector("svg"),"favorite"),sortMemory(),global.state.papersList=global.state.papersList.filter(e=>e.favorite),displayMemoryTable(),setMemorySortArrow("down"),findEl("memory-select").innerHTML+='',e=global.state.papersList.length,setPlaceholder("memory-search",`Search ${e} entries...`)):(removeClass(findEl("filter-favorites").querySelector("svg"),"favorite"),"favoriteDate"===val("memory-select")&&(val("memory-select","lastOpenDate"),global.state.sortKey="lastOpenDate"),document.querySelector('#memory-select option[value="favoriteDate"]').remove(),sortMemory(),setMemorySortArrow("down"),val("memory-search").trim()?dispatch("memory-search","keypress"):(global.state.papersList=global.state.sortedPapers,displayMemoryTable()),e=global.state.sortedPapers.length,setPlaceholder("memory-search",`Search ${e} entries...`))},handleMemorySearchKeyPress=a=>e=>{const t=val("memory-search").trim();if(log(t),t||setTimeout(()=>{style("memory-search-clear-icon","visibility","hidden")},0),!t){if(global.state.papersList.length!==global.state.sortedPapers.length)return global.state.papersList=global.state.sortedPapers,void displayMemoryTable();if(!a&&"Backspace"!==e.key)return}style("memory-search-clear-icon","visibility","visible"),(t.startsWith("t:")?searchMemoryByTags:t.startsWith("c:")?searchMemoryByCode:t.startsWith("y:")?searchMemoryByYear:searchMemory)(t),displayMemoryTable()},handleMemorySearchKeyUp=e=>{var t;"Backspace"==e.key&&((t=new Event("keypress")).key="Backspace",dispatch("memory-search",t)),"memory-search"===e.target.id&&dispatch("memory-search","keypress")},handleCancelModalClick=()=>{hideId("delete-paper-modal")},handleConfirmDeleteModalClick=e=>{const t=findEl("delete-paper-modal-hidden-id").innerHTML,a=global.state.papers[t].title,o=global.state.papers[t].pdfLink;deletePaperInStorage(t,global.state.papers),chrome.storage.local.set({papers:global.state.papers},async()=>{global.state.papersList=Object.values(cleanPapers(global.state.papers)),sortMemory(),displayMemoryTable(),hideId("delete-paper-modal"),info(`Successfully deleted "${a}" (${t}) from PaperMemory`),global.state.currentId===t&&await updatePopupPaperNoMemory(o),setPlaceholder("memory-search",`Search ${global.state.papersList.length} entries ...`),addListener("memory-switch","click",handleMemorySwitchClick)})},handleTagClick=e=>{e=e.target.textContent;val("memory-search","t: "+e),dispatch("memory-search","keypress")},handleClearSearch=e=>{val("memory-search",""),dispatch("memory-search","clear-search"),style("memory-search-clear-icon","visibility","hidden")},handleMemorySwitchClick=()=>{(global.state.memoryIsOpen?closeMemory:openMemory)()},handlePopupKeydown=t=>{var a=t.key;if(!(["Backspace","Enter","Escape","a","e"].indexOf(a)<0))if(global.state.prefsIsOpen)"Escape"===a?(t.preventDefault(),closeMenu()):"Enter"===a&&document.querySelector("#menu-switch:focus")&&closeMenu();else if(global.state.memoryIsOpen){if("Enter"===a){if(document.querySelector("#filter-favorites:focus"))return void dispatch("filter-favorites","click");if(document.querySelector("#memory-sort-arrow:focus")&&"Enter"===a)return void dispatch("memory-sort-arrow","click")}let e;const o=document.querySelector(".memory-container:focus");if("Escape"!==a){if(!o)return;e=o.id.split("--")[1]}"Backspace"===a?dispatch(findEl(e,"memory-delete"),"click"):"Enter"===a?dispatch(findEl(e,"memory-item-link"),"click"):"Escape"===a?(t.preventDefault(),o&&hasClass(o,"expand-open")?handleTogglePaperEdit(t):closeMemory()):"e"===a&&dispatch(findEl(e,"memory-item-edit"),"click")}else if("a"===a){var t=document.querySelectorAll(":focus");if(t&&t.length&&Array.from(t).some(e=>hasClass(e,"noMemoryOnA")))return;global.state.papers&&dispatch("memory-switch","click")}else"Enter"===a&&("memory-switch-open"===(t=document.querySelector(":focus")).id?dispatch("memory-switch","click"):"menu-switch"===t.id?(dispatch("menu-switch","click"),dispatch("menu-switch","blur")):hasClass(t,"memory-item-svg-div")&&dispatch(t,"click"))},handlePrefsCheckChange=async e=>{const t=e.target.id,a=findEl(t).checked;if(global.state&&global.state.prefs)global.state.prefs[t]=a,setStorage("prefs",global.state.prefs,function(){log(`Settings saved for ${t} (${a})`)});else{const o=await getStorage("prefs")??{};o[t]=a,setStorage("prefs",o,function(){log(`Settings saved for ${t} (${a})`)})}a&&"checkNoAuto"===t&&chrome.commands.getAll(e=>{e=e.find(e=>"manualParsing"===e.name).shortcut;console.log("shortcut: ",e),e||showPopupModal("manualParsing")})},handlePopupSaveEdits=e=>{var{note:t,codeLink:a,favorite:o}=getPaperEdits(e,!0);updatePaperTags(e,"#popup-item-tags--"+e),saveNote(e,t),saveCodeLink(e,a),saveFavoriteItem(e,o)},handlePopupDeletePaper=e=>()=>{showConfirmDeleteModal(e)},getMemoryItemHTML=(e,t)=>{var a=new Date(e.addDate).toLocaleString().replace(",",""),o=new Date(e.lastOpenDate).toLocaleString().replace(",",""),s=getDisplayId(e.id),r=e.note||"",i=e.id,l=new Set(e.tags),n=getTagsOptions(e),d=e.favorite?"favorite":"",c=(t.pdfLink="Open link to "+e.title,t.copyLink="Open link to the paper's "+(global.state.prefs.checkPreferPdf?"PDF":"abstract"),`${e.codeLink||""}`);let p='
';e.note&&(p=`
Note: ${r}
`);var m=global.state.files.hasOwnProperty(e.id)?`
${tablerSvg("vocabulary","",["memory-icon-svg"])}
`:"";return`

${tablerSvg("star","",["memory-item-favorite-svg",d])} ${e.title}

${Array.from(l).map(e=>`${e}`).join("")}
${cutAuthors(e.author)}
${c} ${p}
${tablerSvg("writing","",["memory-icon-svg"])}
${s}
${tablerSvg("external-link","",["memory-icon-svg"])}
${m}
${tablerSvg("link","",["memory-icon-svg"])}
${tablerSvg("markdown","",["memory-icon-svg"])}
${tablerSvg("math-function","",["memory-icon-svg"])}
Visits: ${e.count}
-
`},getPopupEditFormHTML=e=>{var t=e.id,a=getTagsOptions(e),o=e.note||"",s=getDisplayId(e.id);return`
Tags:
Code:
Note:
${s}
`},getPopupPaperIconsHTML=(e,t,a)=>{var o=e.id,t=isPdfUrl(t)?"HTML":"PDF";let s="";global.state.prefs.checkScirate&&"arxiv"===e.source&&(s=`
${tablerSvg("messages","",["popup-click-svg"])}
`);e=global.state.prefs.checkStore&&(a.localFile||a.stored)?`
${tablerSvg("vocabulary","",["popup-click-svg"])}
`:`
${tablerSvg("file-download","",["popup-click-svg"])}
`;return`${s}
${tablerSvg("external-link","",["popup-click-svg"])}
${tablerSvg("link","",["popup-click-svg"])}
${tablerSvg("markdown","",["popup-click-svg"])}
${tablerSvg("math-function","",["popup-click-svg"])}
`+e},getTagsOptions=e=>{const o=new Set(e.tags);return Array.from(global.state.paperTags).sort().map((e,t)=>{let a='