mirror of
https://github.com/nuttylmao/nutty.gg.git
synced 2026-09-18 19:50:58 -04:00
Added "Vertical Alignment" setting
This commit is contained in:
@@ -30,6 +30,7 @@ const theme = urlParams.get('theme') || 'standard';
|
|||||||
const font = urlParams.get("font") || "";
|
const font = urlParams.get("font") || "";
|
||||||
const fontSize = GetIntParam("fontSize", 20);
|
const fontSize = GetIntParam("fontSize", 20);
|
||||||
const maxWidth = GetIntParam("maxWidth", 500);
|
const maxWidth = GetIntParam("maxWidth", 500);
|
||||||
|
const verticalAlignment = urlParams.get('verticalAlignment') || 'align-to-center';
|
||||||
const textAlignment = urlParams.get('textAlignment') || 'left';
|
const textAlignment = urlParams.get('textAlignment') || 'left';
|
||||||
|
|
||||||
const includedApplications = urlParams.get('includedApplications') || '';
|
const includedApplications = urlParams.get('includedApplications') || '';
|
||||||
@@ -75,6 +76,19 @@ else
|
|||||||
// Set text alignment
|
// Set text alignment
|
||||||
document.documentElement.style.setProperty('--text-alignment', `${textAlignment}`);
|
document.documentElement.style.setProperty('--text-alignment', `${textAlignment}`);
|
||||||
|
|
||||||
|
// Set vertical alignment
|
||||||
|
switch (verticalAlignment) {
|
||||||
|
case 'align-to-top':
|
||||||
|
mainContainer.style.alignItems = 'flex-start';
|
||||||
|
break;
|
||||||
|
case 'align-to-center':
|
||||||
|
mainContainer.style.alignItems = 'center';
|
||||||
|
break;
|
||||||
|
case 'align-to-bottom':
|
||||||
|
mainContainer.style.alignItems = 'flex-end';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
////////////////
|
////////////////
|
||||||
|
|||||||
@@ -72,6 +72,28 @@
|
|||||||
"defaultValue": 500,
|
"defaultValue": 500,
|
||||||
"group": "Appearance"
|
"group": "Appearance"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"id": "verticalAlignment",
|
||||||
|
"label": "Vertical Alignment",
|
||||||
|
"description": "",
|
||||||
|
"type": "select",
|
||||||
|
"options": [
|
||||||
|
{
|
||||||
|
"value": "align-to-top",
|
||||||
|
"label": "Align To Top"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": "align-to-center",
|
||||||
|
"label": "Align To Center"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"value": "align-to-bottom",
|
||||||
|
"label": "Align To Bottom"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"defaultValue": "align-to-center",
|
||||||
|
"group": "Appearance"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"id": "textAlignment",
|
"id": "textAlignment",
|
||||||
"label": "Text Alignment",
|
"label": "Text Alignment",
|
||||||
|
|||||||
@@ -10,7 +10,7 @@ body {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
padding: 0.5em;
|
padding: 1em;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user