astro-accelerator 0.0.86 → 0.0.87
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/public/css/main.css +21 -11
- package/public/js/modules/figures.js +1 -10
package/package.json
CHANGED
package/public/css/main.css
CHANGED
|
@@ -931,18 +931,34 @@ pre.astro-code code {
|
|
|
931
931
|
max-height: 0px;
|
|
932
932
|
margin: 0;
|
|
933
933
|
width: 100%;
|
|
934
|
-
text-align:
|
|
934
|
+
text-align: end;
|
|
935
935
|
z-index: 1;
|
|
936
936
|
position: relative;
|
|
937
937
|
top: -1rem;
|
|
938
938
|
}
|
|
939
939
|
|
|
940
940
|
.magnify-icon {
|
|
941
|
-
border-radius: 0.2rem;
|
|
942
|
-
stroke: var(--fore-link-alt);
|
|
943
|
-
fill: var(--aft);
|
|
944
|
-
background-color: transparent;
|
|
945
941
|
opacity: 0;
|
|
942
|
+
border-radius: 0.2rem;
|
|
943
|
+
border: 1px solid var(--fore-link);
|
|
944
|
+
color: var(--fore-link);
|
|
945
|
+
line-height: 1;
|
|
946
|
+
font-size: 2rem;
|
|
947
|
+
width: 2rem;
|
|
948
|
+
height: 2rem;
|
|
949
|
+
overflow: hidden;
|
|
950
|
+
display: inline-block;
|
|
951
|
+
cursor: pointer;
|
|
952
|
+
}
|
|
953
|
+
|
|
954
|
+
.input-touch .magnify-icon {
|
|
955
|
+
opacity: 1;
|
|
956
|
+
}
|
|
957
|
+
|
|
958
|
+
.magnify-icon:before {
|
|
959
|
+
content: '↗️';
|
|
960
|
+
position: relative;
|
|
961
|
+
top: -0.15em;
|
|
946
962
|
}
|
|
947
963
|
|
|
948
964
|
figure:hover .magnify-icon,
|
|
@@ -958,12 +974,6 @@ figure:focus .magnify-icon {
|
|
|
958
974
|
opacity: 1;
|
|
959
975
|
}
|
|
960
976
|
|
|
961
|
-
@media (max-width: 860px) {
|
|
962
|
-
.magnify-icon {
|
|
963
|
-
opacity: 1;
|
|
964
|
-
}
|
|
965
|
-
}
|
|
966
|
-
|
|
967
977
|
/* Custom Divisions */
|
|
968
978
|
|
|
969
979
|
.note {
|
|
@@ -2,16 +2,8 @@ import { qs, qsa } from './query.js';
|
|
|
2
2
|
|
|
3
3
|
const activeClass = 'magnify-icon';
|
|
4
4
|
|
|
5
|
-
const clipboard = `<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
|
6
|
-
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
|
|
7
|
-
<line x1="15" y1="8" x2="15.01" y2="8" />
|
|
8
|
-
<rect x="4" y="4" width="16" height="16" rx="3" />
|
|
9
|
-
<path d="M4 15l4 -4a3 5 0 0 1 3 0l5 5" />
|
|
10
|
-
<path d="M14 14l1 -1a3 5 0 0 1 3 0l2 2" />
|
|
11
|
-
</svg>`;
|
|
12
|
-
|
|
13
5
|
/**
|
|
14
|
-
* Enables
|
|
6
|
+
* Enables opening image in new tab
|
|
15
7
|
*/
|
|
16
8
|
function enhanceFigures() {
|
|
17
9
|
qsa(`figure > p > img`).forEach(node => {
|
|
@@ -19,7 +11,6 @@ function enhanceFigures() {
|
|
|
19
11
|
|
|
20
12
|
const magnify = document.createElement('button');
|
|
21
13
|
magnify.classList.add(activeClass);
|
|
22
|
-
magnify.innerHTML = clipboard;
|
|
23
14
|
magnify.title = 'Enlarge';
|
|
24
15
|
|
|
25
16
|
const magnifyContainer = document.createElement('div');
|