mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-01-06 03:32:40 +00:00
Merge branch 'master' of https://github.com/naturalcrit/homebrewery into SnippetsReorg
This commit is contained in:
Víctor Losada Hernández
@@ -486,6 +486,15 @@ module.exports = [
|
||||
icon : 'fas fa-print',
|
||||
view : 'style',
|
||||
snippets : [
|
||||
{
|
||||
name : 'US Letter Page Size',
|
||||
icon : 'far fa-file',
|
||||
gen : dedent`/* US Letter Page Size */
|
||||
.page {
|
||||
width : 215.9mm; /* 8.5in */
|
||||
height : 279.4mm; /* 11in */
|
||||
}\n\n`,
|
||||
},
|
||||
{
|
||||
name : 'A3 Page Size',
|
||||
icon : 'far fa-file',
|
||||
|
||||
@@ -22,9 +22,9 @@ body { counter-reset : page-numbers 0; }
|
||||
// *****************************/
|
||||
.page {
|
||||
.block {
|
||||
break-inside : avoid;
|
||||
display : inline-block;
|
||||
width : 100%;
|
||||
break-inside : avoid;
|
||||
img { z-index : 0; }
|
||||
}
|
||||
.inline-block {
|
||||
@@ -59,8 +59,8 @@ body { counter-reset : page-numbers 0; }
|
||||
content-visibility : auto;
|
||||
contain-intrinsic-size : auto none;
|
||||
}
|
||||
//*****************************
|
||||
// * BASE
|
||||
//*****************************
|
||||
// * BASE
|
||||
// *****************************/
|
||||
.page {
|
||||
p {
|
||||
@@ -121,7 +121,7 @@ body { counter-reset : page-numbers 0; }
|
||||
// * CODE BLOCKS
|
||||
// ************************************/
|
||||
code {
|
||||
font-family : 'Courier New', "Courier", monospace;
|
||||
font-family : 'Courier New', 'Courier', monospace;
|
||||
overflow-wrap : break-word;
|
||||
white-space : pre-wrap;
|
||||
}
|
||||
@@ -134,10 +134,10 @@ body { counter-reset : page-numbers 0; }
|
||||
// * EXTRAS
|
||||
// *****************************/
|
||||
.columnSplit {
|
||||
margin-top : 0;
|
||||
visibility : hidden;
|
||||
-webkit-column-break-after : always;
|
||||
margin-top : 0;
|
||||
break-after : always;
|
||||
-webkit-column-break-after : always;
|
||||
-moz-column-break-after : always;
|
||||
& + * { margin-top : 0; }
|
||||
}
|
||||
@@ -200,11 +200,11 @@ body { counter-reset : page-numbers 0; }
|
||||
background-color : var(--HB_Color_WatercolorStain); /* default color */
|
||||
background-size : cover;
|
||||
-webkit-mask-image : var(--wc);
|
||||
-webkit-mask-size : contain;
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
mask-image : var(--wc);
|
||||
mask-size : contain;
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
mask-repeat : no-repeat;
|
||||
-webkit-mask-size : contain;
|
||||
mask-size : contain;
|
||||
--wc : @watercolor1; /* default image */
|
||||
}
|
||||
|
||||
@@ -232,15 +232,15 @@ body { counter-reset : page-numbers 0; }
|
||||
height : 200%;
|
||||
background-image : var(--checkerboard);
|
||||
background-size : 20px;
|
||||
transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
-webkit-mask-image : var(--wc), var(--revealer);
|
||||
-webkit-mask-repeat : repeat-x;
|
||||
-webkit-mask-size : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge
|
||||
-webkit-mask-position : 50% calc(50% - var(--offset));
|
||||
mask-image : var(--wc);
|
||||
-webkit-mask-repeat : repeat-x;
|
||||
mask-repeat : repeat-x;
|
||||
mask-size : 50%;
|
||||
-webkit-mask-position : 50% calc(50% - var(--offset));
|
||||
mask-position : 50% calc(50% - var(--offset));
|
||||
-webkit-mask-size : 50%; //Scale only X to fit page width, leave height at aspect ratio, designed to hang off the edge
|
||||
mask-size : 50%;
|
||||
transform : translateY(50%) translateX(-50%) rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
--rotation : 0;
|
||||
--revealer : none;
|
||||
--checkerboard : none;
|
||||
@@ -277,19 +277,19 @@ body { counter-reset : page-numbers 0; }
|
||||
}
|
||||
&.revealImage {
|
||||
--revealer : linear-gradient(0deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.2));
|
||||
--checkerboard : url("/assets/waterColorMasks/missingImage.png"); //shows any masked regions not filled by image
|
||||
--checkerboard : url('/assets/waterColorMasks/missingImage.png'); //shows any masked regions not filled by image
|
||||
}
|
||||
}
|
||||
|
||||
.imageMaskEdge {
|
||||
&1 { --wc : url("/assets/waterColorMasks/edge/0001.webp"); }
|
||||
&2 { --wc : url("/assets/waterColorMasks/edge/0002.webp"); }
|
||||
&3 { --wc : url("/assets/waterColorMasks/edge/0003.webp"); }
|
||||
&4 { --wc : url("/assets/waterColorMasks/edge/0004.webp"); }
|
||||
&5 { --wc : url("/assets/waterColorMasks/edge/0005.webp"); }
|
||||
&6 { --wc : url("/assets/waterColorMasks/edge/0006.webp"); }
|
||||
&7 { --wc : url("/assets/waterColorMasks/edge/0007.webp"); }
|
||||
&8 { --wc : url("/assets/waterColorMasks/edge/0008.webp"); }
|
||||
&1 { --wc : url('/assets/waterColorMasks/edge/0001.webp'); }
|
||||
&2 { --wc : url('/assets/waterColorMasks/edge/0002.webp'); }
|
||||
&3 { --wc : url('/assets/waterColorMasks/edge/0003.webp'); }
|
||||
&4 { --wc : url('/assets/waterColorMasks/edge/0004.webp'); }
|
||||
&5 { --wc : url('/assets/waterColorMasks/edge/0005.webp'); }
|
||||
&6 { --wc : url('/assets/waterColorMasks/edge/0006.webp'); }
|
||||
&7 { --wc : url('/assets/waterColorMasks/edge/0007.webp'); }
|
||||
&8 { --wc : url('/assets/waterColorMasks/edge/0008.webp'); }
|
||||
}
|
||||
|
||||
[class*='imageMaskCenter'] {
|
||||
@@ -297,15 +297,15 @@ body { counter-reset : page-numbers 0; }
|
||||
left : calc(var(--offsetX));
|
||||
width : 100%;
|
||||
height : 100%;
|
||||
transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
-webkit-mask-image : var(--wc), var(--revealer);
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
-webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
-webkit-mask-position : 0% 0%;
|
||||
mask-image : var(--wc), var(--revealer);
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
mask-repeat : no-repeat;
|
||||
mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
-webkit-mask-position : 0% 0%;
|
||||
mask-position : 50% 50%;
|
||||
-webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
|
||||
& > p:has(img) {
|
||||
position : absolute;
|
||||
@@ -322,23 +322,23 @@ body { counter-reset : page-numbers 0; }
|
||||
}
|
||||
|
||||
.imageMaskCenter {
|
||||
&1 { --wc : url("/assets/waterColorMasks/center/0001.webp"); }
|
||||
&2 { --wc : url("/assets/waterColorMasks/center/0002.webp"); }
|
||||
&3 { --wc : url("/assets/waterColorMasks/center/0003.webp"); }
|
||||
&4 { --wc : url("/assets/waterColorMasks/center/0004.webp"); }
|
||||
&5 { --wc : url("/assets/waterColorMasks/center/0005.webp"); }
|
||||
&6 { --wc : url("/assets/waterColorMasks/center/0006.webp"); }
|
||||
&7 { --wc : url("/assets/waterColorMasks/center/0007.webp"); }
|
||||
&8 { --wc : url("/assets/waterColorMasks/center/0008.webp"); }
|
||||
&9 { --wc : url("/assets/waterColorMasks/center/0009.webp"); }
|
||||
&10 { --wc : url("/assets/waterColorMasks/center/0010.webp"); }
|
||||
&11 { --wc : url("/assets/waterColorMasks/center/0011.webp"); }
|
||||
&12 { --wc : url("/assets/waterColorMasks/center/0012.webp"); }
|
||||
&13 { --wc : url("/assets/waterColorMasks/center/0013.webp"); }
|
||||
&14 { --wc : url("/assets/waterColorMasks/center/0014.webp"); }
|
||||
&15 { --wc : url("/assets/waterColorMasks/center/0015.webp"); }
|
||||
&16 { --wc : url("/assets/waterColorMasks/center/0016.webp"); }
|
||||
&special { --wc : url("/assets/waterColorMasks/center/special.webp"); }
|
||||
&1 { --wc : url('/assets/waterColorMasks/center/0001.webp'); }
|
||||
&2 { --wc : url('/assets/waterColorMasks/center/0002.webp'); }
|
||||
&3 { --wc : url('/assets/waterColorMasks/center/0003.webp'); }
|
||||
&4 { --wc : url('/assets/waterColorMasks/center/0004.webp'); }
|
||||
&5 { --wc : url('/assets/waterColorMasks/center/0005.webp'); }
|
||||
&6 { --wc : url('/assets/waterColorMasks/center/0006.webp'); }
|
||||
&7 { --wc : url('/assets/waterColorMasks/center/0007.webp'); }
|
||||
&8 { --wc : url('/assets/waterColorMasks/center/0008.webp'); }
|
||||
&9 { --wc : url('/assets/waterColorMasks/center/0009.webp'); }
|
||||
&10 { --wc : url('/assets/waterColorMasks/center/0010.webp'); }
|
||||
&11 { --wc : url('/assets/waterColorMasks/center/0011.webp'); }
|
||||
&12 { --wc : url('/assets/waterColorMasks/center/0012.webp'); }
|
||||
&13 { --wc : url('/assets/waterColorMasks/center/0013.webp'); }
|
||||
&14 { --wc : url('/assets/waterColorMasks/center/0014.webp'); }
|
||||
&15 { --wc : url('/assets/waterColorMasks/center/0015.webp'); }
|
||||
&16 { --wc : url('/assets/waterColorMasks/center/0016.webp'); }
|
||||
&special { --wc : url('/assets/waterColorMasks/center/special.webp'); }
|
||||
}
|
||||
|
||||
|
||||
@@ -347,15 +347,15 @@ body { counter-reset : page-numbers 0; }
|
||||
left : calc(-50% + var(--offsetX));
|
||||
width : 200%;
|
||||
height : 200%;
|
||||
transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
-webkit-mask-image : var(--wc), var(--revealer);
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
-webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
-webkit-mask-position : 50% 50%;
|
||||
mask-image : var(--wc), var(--revealer);
|
||||
-webkit-mask-repeat : no-repeat;
|
||||
mask-repeat : no-repeat;
|
||||
mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
-webkit-mask-position : 50% 50%;
|
||||
mask-position : 50% 50%;
|
||||
-webkit-mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
mask-size : 100% 100%; //Scale both dimensions to fit page size
|
||||
transform : rotate(calc(1deg * var(--rotation))) scaleX(var(--scaleX)) scaleY(var(--scaleY));
|
||||
& > p:has(img) {
|
||||
bottom : 25%;
|
||||
left : 25%;
|
||||
@@ -368,43 +368,43 @@ body { counter-reset : page-numbers 0; }
|
||||
}
|
||||
}
|
||||
.imageMaskCorner {
|
||||
&1 { --wc : url("/assets/waterColorMasks/corner/0001.webp"); }
|
||||
&2 { --wc : url("/assets/waterColorMasks/corner/0002.webp"); }
|
||||
&3 { --wc : url("/assets/waterColorMasks/corner/0003.webp"); }
|
||||
&4 { --wc : url("/assets/waterColorMasks/corner/0004.webp"); }
|
||||
&5 { --wc : url("/assets/waterColorMasks/corner/0005.webp"); }
|
||||
&6 { --wc : url("/assets/waterColorMasks/corner/0006.webp"); }
|
||||
&7 { --wc : url("/assets/waterColorMasks/corner/0007.webp"); }
|
||||
&8 { --wc : url("/assets/waterColorMasks/corner/0008.webp"); }
|
||||
&9 { --wc : url("/assets/waterColorMasks/corner/0009.webp"); }
|
||||
&10 { --wc : url("/assets/waterColorMasks/corner/0010.webp"); }
|
||||
&11 { --wc : url("/assets/waterColorMasks/corner/0011.webp"); }
|
||||
&12 { --wc : url("/assets/waterColorMasks/corner/0012.webp"); }
|
||||
&13 { --wc : url("/assets/waterColorMasks/corner/0013.webp"); }
|
||||
&14 { --wc : url("/assets/waterColorMasks/corner/0014.webp"); }
|
||||
&15 { --wc : url("/assets/waterColorMasks/corner/0015.webp"); }
|
||||
&16 { --wc : url("/assets/waterColorMasks/corner/0016.webp"); }
|
||||
&17 { --wc : url("/assets/waterColorMasks/corner/0017.webp"); }
|
||||
&18 { --wc : url("/assets/waterColorMasks/corner/0018.webp"); }
|
||||
&19 { --wc : url("/assets/waterColorMasks/corner/0019.webp"); }
|
||||
&20 { --wc : url("/assets/waterColorMasks/corner/0020.webp"); }
|
||||
&21 { --wc : url("/assets/waterColorMasks/corner/0021.webp"); }
|
||||
&22 { --wc : url("/assets/waterColorMasks/corner/0022.webp"); }
|
||||
&23 { --wc : url("/assets/waterColorMasks/corner/0023.webp"); }
|
||||
&24 { --wc : url("/assets/waterColorMasks/corner/0024.webp"); }
|
||||
&25 { --wc : url("/assets/waterColorMasks/corner/0025.webp"); }
|
||||
&26 { --wc : url("/assets/waterColorMasks/corner/0026.webp"); }
|
||||
&27 { --wc : url("/assets/waterColorMasks/corner/0027.webp"); }
|
||||
&28 { --wc : url("/assets/waterColorMasks/corner/0028.webp"); }
|
||||
&29 { --wc : url("/assets/waterColorMasks/corner/0029.webp"); }
|
||||
&30 { --wc : url("/assets/waterColorMasks/corner/0030.webp"); }
|
||||
&31 { --wc : url("/assets/waterColorMasks/corner/0031.webp"); }
|
||||
&32 { --wc : url("/assets/waterColorMasks/corner/0032.webp"); }
|
||||
&33 { --wc : url("/assets/waterColorMasks/corner/0033.webp"); }
|
||||
&34 { --wc : url("/assets/waterColorMasks/corner/0034.webp"); }
|
||||
&35 { --wc : url("/assets/waterColorMasks/corner/0035.webp"); }
|
||||
&36 { --wc : url("/assets/waterColorMasks/corner/0036.webp"); }
|
||||
&37 { --wc : url("/assets/waterColorMasks/corner/0037.webp"); }
|
||||
&1 { --wc : url('/assets/waterColorMasks/corner/0001.webp'); }
|
||||
&2 { --wc : url('/assets/waterColorMasks/corner/0002.webp'); }
|
||||
&3 { --wc : url('/assets/waterColorMasks/corner/0003.webp'); }
|
||||
&4 { --wc : url('/assets/waterColorMasks/corner/0004.webp'); }
|
||||
&5 { --wc : url('/assets/waterColorMasks/corner/0005.webp'); }
|
||||
&6 { --wc : url('/assets/waterColorMasks/corner/0006.webp'); }
|
||||
&7 { --wc : url('/assets/waterColorMasks/corner/0007.webp'); }
|
||||
&8 { --wc : url('/assets/waterColorMasks/corner/0008.webp'); }
|
||||
&9 { --wc : url('/assets/waterColorMasks/corner/0009.webp'); }
|
||||
&10 { --wc : url('/assets/waterColorMasks/corner/0010.webp'); }
|
||||
&11 { --wc : url('/assets/waterColorMasks/corner/0011.webp'); }
|
||||
&12 { --wc : url('/assets/waterColorMasks/corner/0012.webp'); }
|
||||
&13 { --wc : url('/assets/waterColorMasks/corner/0013.webp'); }
|
||||
&14 { --wc : url('/assets/waterColorMasks/corner/0014.webp'); }
|
||||
&15 { --wc : url('/assets/waterColorMasks/corner/0015.webp'); }
|
||||
&16 { --wc : url('/assets/waterColorMasks/corner/0016.webp'); }
|
||||
&17 { --wc : url('/assets/waterColorMasks/corner/0017.webp'); }
|
||||
&18 { --wc : url('/assets/waterColorMasks/corner/0018.webp'); }
|
||||
&19 { --wc : url('/assets/waterColorMasks/corner/0019.webp'); }
|
||||
&20 { --wc : url('/assets/waterColorMasks/corner/0020.webp'); }
|
||||
&21 { --wc : url('/assets/waterColorMasks/corner/0021.webp'); }
|
||||
&22 { --wc : url('/assets/waterColorMasks/corner/0022.webp'); }
|
||||
&23 { --wc : url('/assets/waterColorMasks/corner/0023.webp'); }
|
||||
&24 { --wc : url('/assets/waterColorMasks/corner/0024.webp'); }
|
||||
&25 { --wc : url('/assets/waterColorMasks/corner/0025.webp'); }
|
||||
&26 { --wc : url('/assets/waterColorMasks/corner/0026.webp'); }
|
||||
&27 { --wc : url('/assets/waterColorMasks/corner/0027.webp'); }
|
||||
&28 { --wc : url('/assets/waterColorMasks/corner/0028.webp'); }
|
||||
&29 { --wc : url('/assets/waterColorMasks/corner/0029.webp'); }
|
||||
&30 { --wc : url('/assets/waterColorMasks/corner/0030.webp'); }
|
||||
&31 { --wc : url('/assets/waterColorMasks/corner/0031.webp'); }
|
||||
&32 { --wc : url('/assets/waterColorMasks/corner/0032.webp'); }
|
||||
&33 { --wc : url('/assets/waterColorMasks/corner/0033.webp'); }
|
||||
&34 { --wc : url('/assets/waterColorMasks/corner/0034.webp'); }
|
||||
&35 { --wc : url('/assets/waterColorMasks/corner/0035.webp'); }
|
||||
&36 { --wc : url('/assets/waterColorMasks/corner/0036.webp'); }
|
||||
&37 { --wc : url('/assets/waterColorMasks/corner/0037.webp'); }
|
||||
}
|
||||
}
|
||||
|
||||
@@ -428,17 +428,6 @@ body { counter-reset : page-numbers 0; }
|
||||
}
|
||||
}
|
||||
|
||||
//*****************************
|
||||
// * BLANK LINE
|
||||
// *****************************/
|
||||
.page {
|
||||
.blank {
|
||||
height : 1em;
|
||||
margin-top : 0;
|
||||
& + * { margin-top : 0; }
|
||||
}
|
||||
}
|
||||
|
||||
//*****************************
|
||||
// * WIDE
|
||||
// *****************************/
|
||||
@@ -449,6 +438,11 @@ body { counter-reset : page-numbers 0; }
|
||||
margin-bottom : 1em;
|
||||
& + * { margin-top : 0; }
|
||||
}
|
||||
.blank {
|
||||
height : 1em;
|
||||
margin-top : 0;
|
||||
& + * { margin-top : 0; }
|
||||
}
|
||||
}
|
||||
|
||||
//*****************************
|
||||
@@ -473,8 +467,8 @@ body { counter-reset : page-numbers 0; }
|
||||
height : 1.5cm;
|
||||
margin : 0 auto;
|
||||
background-color : black;
|
||||
-webkit-mask : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat;
|
||||
mask : url("/assets/naturalCritLogoWhite.svg") center / contain no-repeat;
|
||||
-webkit-mask : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat;
|
||||
mask : url('/assets/naturalCritLogoWhite.svg') center / contain no-repeat;
|
||||
}
|
||||
.homebreweryIcon.red { background-color : red; }
|
||||
.homebreweryIcon.gold { background-image : linear-gradient(to top left, brown 22.5%, gold 40%, white 60%, gold 67.5%, brown 82.5%); }
|
||||
@@ -498,13 +492,9 @@ body { counter-reset : page-numbers 0; }
|
||||
.pageNumber { left : 30px; }
|
||||
}
|
||||
|
||||
.resetCounting {
|
||||
counter-set : page-numbers 1;
|
||||
}
|
||||
.resetCounting { counter-set : page-numbers 1; }
|
||||
|
||||
&:not(:has(.skipCounting)) {
|
||||
counter-increment : page-numbers;
|
||||
}
|
||||
&:not(:has(.skipCounting)) { counter-increment : page-numbers; }
|
||||
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user