aziascreations/Web-NibblePoker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added basic Formula Wizard, Added script to compile SASS and TS, many other random changes.

Browse Source 
Update .gitignore, .htaccess, and 68 more files...
This commit is contained in:
Herwin Bozet (NibblePoker)
2023-08-02 17:06:58 +02:00
parent 6fb621e550
commit 4cf950b5dd
70 changed files with 4128 additions and 182 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
resources/NibblePoker/images/drawings/computer_v1_danger.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

BIN
resources/NibblePoker/images/drawings/computer_v1_danger_strong.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.4 KiB

7
resources/NibblePoker/js/nibblepoker-glider.js
View File

@@ -1,7 +1,11 @@
// Creating the galleries from Glider.js
window.addEventListener('load', function(){
document.querySelectorAll(".glider").forEach(element => {
new Glider(element, {
console.debug("Creating glider...");
console.debug(element);
let glider = new Glider(element, {
slidesToShow: 1,
draggable: true,
scrollLock: true,
@@ -27,6 +31,7 @@ window.addEventListener('load', function(){
}
]
});
console.debug(glider);
// Processing the images
const eImages = [];

15
resources/NibblePoker/js/nibblepoker.js
View File

@@ -69,13 +69,14 @@ document.addEventListener("DOMContentLoaded", () => {
//showContentModal(eContentModal);
[eContentModal, document.getElementById("modal-content-cross"), eContentModalInner].forEach(value => {
value.onclick = function() {
fadeOut(eContentModal, 175).then(r => {
eContentModalInner.innerHTML = "";
});
}
})
// FIXME: Fix this shit !
//[eContentModal, document.getElementById("modal-content-cross"), eContentModalInner].forEach(value => {
// value.onclick = function() {
// fadeOut(eContentModal, 175).then(r => {
// eContentModalInner.innerHTML = "";
// });
// }
//})
// TODO: Autodetect mobile screens, close it, and add classes to make it over the rest with dark modal bkgd.
});

25
resources/NibblePoker/scss/core/border.scss
View File

@@ -12,18 +12,25 @@
}
.border {
border: 1px solid #{$color-border-all};
border: 1px solid;
&.b-light {
border: 1px solid #{$color-border-light};
}
//&.b-light {
// border: 1px solid #{$color-border-light};
//}
}
* {
.dark-mode & {
border-color: #{$color-border-all};
}
}
//main {
// .border {
// border: 1px solid #{$color-border-main};
// }
//}
//* {
// .dark-mode & {
// border-color: #{$color-border-all};
// }
//}
@include border-maker("t", "top");
@include border-maker("b", "bottom");

3
resources/NibblePoker/scss/core/flex.scss
View File

@@ -49,6 +49,9 @@
.flex-align-center {
align-items: center;
}
.flex-align-start {
align-items: flex-start;
}
// Missing: start | end

3
resources/NibblePoker/scss/core/sizing.scss
View File

@@ -6,6 +6,9 @@
.w-full {
width: 100%;
}
.wm-full {
max-width: 100%;
}
.h-full {
height: 100%;

1
resources/NibblePoker/scss/core/spacing/axis.scss
View File

@@ -14,6 +14,7 @@
/* Utilities > Spacing > Sided > Variable Sizes */
//@include axis-spacing-maker("m", "margin", "xxs", calc(#{$margin-base-size} * 0.25));
@include axis-spacing-maker("m", "margin", "xs", calc(#{$margin-base-size} * 0.5));
@include axis-spacing-maker("m", "margin", "s", calc(#{$margin-base-size} * 0.75));
@include axis-spacing-maker("m", "margin", "m", #{$margin-base-size});

1
resources/NibblePoker/scss/core/spacing/sided.scss
View File

@@ -18,6 +18,7 @@
/* Utilities > Spacing > Sided > Variable Sizes */
@include sided-spacing-maker("m", "margin", "xxs", calc(#{$margin-base-size} * 0.25));
@include sided-spacing-maker("m", "margin", "xs", calc(#{$margin-base-size} * 0.5));
@include sided-spacing-maker("m", "margin", "s", calc(#{$margin-base-size} * 0.75));
@include sided-spacing-maker("m", "margin", "m", #{$margin-base-size});

3
resources/NibblePoker/scss/css/borders.css Normal file
View File

@@ -0,0 +1,3 @@
/*# sourceMappingURL=borders.css.map */

1
resources/NibblePoker/scss/css/borders.min.css vendored Normal file
View File

@@ -0,0 +1 @@
/*# sourceMappingURL=borders.min.css.map */

5
resources/NibblePoker/scss/nibblepoker.scss
View File

@@ -12,7 +12,7 @@
@import 'config';
/* Externals */
@import 'external/reset';
@import 'external/reset'; // Not resetting it for checkboxes !
@import 'external/quantum';
/* Variables */
@@ -46,8 +46,10 @@
@import 'site/scrollbar';
@import 'site/input'; // Has ugly fix for download buttons
@import 'site/table'; // Uses copied paddings for cells & ugly rounding fix
@import 'site/code'; // Uses forced borders, roundings and paddings
/* Site > Misc */
@import 'site/borders'; // Applies the colors mostly, the size are in the elements !
@import 'site/backgrounds';
/* Site > Fixes */
@@ -56,7 +58,6 @@
/* Site > Unsorted */
@import 'site/image';
@import 'site/wedge';
@import 'site/code'; // Uses copied borders, roundings and paddings
@import 'site/content'; // Uses fixed sizes and floats
@import 'site/video';
@import 'site/modal';

36
resources/NibblePoker/scss/site/borders.scss Normal file
View File

@@ -0,0 +1,36 @@
.border, code, .code, kbd {
border-color: #{$color-border-surround};
//&.b-light {
// border: 1px solid #{$color-border-light};
//}
}
code, .code, kbd {
border-color: #{$color-border-code};
}
main {
.border {
border-color: #{$color-border-main};
//&.b-light {
// border: 1px solid #{$color-border-light};
//}
}
}
table.stylish {
// Fixing border issues when using rounded corners by using a "fake" one using the background's color.
// It will look like utter shit when rounded on firefox because its rendering engine cannot clip rounded corners apparently.
// I guess that's what being at less than 3% of the market share does to you and your ability to care about basic shit.
&.border {
background-color: #{$color-border-main};
}
}
// Special fix for select inputs' dropdown menu
//select.border option::before {
// border: 1px solid deeppink !important;
//}

2
resources/NibblePoker/scss/site/code.scss
View File

@@ -13,7 +13,7 @@ code {
.code, kbd {
background-color: #{$color-background-code};
border: 1px solid #{$color-border-code};
border: 1px solid;
// Using '.r-s'
border-radius: calc(#{$border-base-radius} * 0.75);

64
resources/NibblePoker/scss/site/input.scss
View File

@@ -4,7 +4,7 @@
/* Site > Elements > Inputs > Commons */
button, input {
button, input, textarea, select {
border: 0;
// Removing ugly-ass white glow when editing text-related inputs.
@@ -19,6 +19,37 @@ button, input {
box-shadow: 0px 0px 3px 0px #{$color-input-glow};
}
}
&:disabled {
cursor: not-allowed;
}
}
label {
cursor: pointer;
user-select: none;
}
/* Site > Elements > Inputs > Checkbox */
input[type=checkbox] {
width: 1.65em;
height: 1.65em;
background-color: #{$color-background-checkbox-unchecked};
cursor: pointer;
&:checked {
background-color: #{$color-background-checkbox-checked};
}
position: relative;
vertical-align: middle;
}
input[type="checkbox"] + label {
position: relative;
display: inline-block;
vertical-align: middle;
}
/* Site > Elements > Inputs > Buttons */
@@ -38,6 +69,30 @@ button {
background-color: #{$color-background-button-primary-hover};
}
}
&.success {
background-color: #{$color-background-button-success};
&:hover {
background-color: #{$color-background-button-success-hover};
}
}
&.error {
background-color: #{$color-background-button-error};
&:hover {
background-color: #{$color-background-button-error-hover};
}
}
&.warning {
background-color: #{$color-background-button-warning};
&:hover {
background-color: #{$color-background-button-warning-hover};
}
}
}
// Ugly fix for download buttons
@@ -75,4 +130,11 @@ button + button, .button-link + .button-link > button {
//&[open] > div {
// height: auto;
//}
}
textarea {
&.no-resize {
resize: none;
}
}

8
resources/NibblePoker/scss/site/table.scss
View File

@@ -25,12 +25,7 @@ table.stylish {
border-right: 1.5px solid #{$color-table-border};
}
// Fixing border issues when using rounded corners by using a "fake" one using the background's color.
// It will look like utter shit when rounded on firefox because its rendering engine cannot clip rounded corners apparently.
// I guess that's what being at less than 3% of the market share does to you and your ability to care about basic shit.
&.border {
background-color: #{$color-border-all};
}
// See 'site/border.scss' for border fix.
}
// Applying .p-xs and .p-s to all cells if needed
@@ -53,6 +48,7 @@ table.stylish {
}
}
// Centers the cells' content vertically
.table-v-center {
tr, td {
vertical-align: middle;

2
resources/NibblePoker/scss/site/text.scss
View File

@@ -4,7 +4,7 @@
/* Site > Text > Commons */
p, a, h1, h2, h3, h4, h5, h6, td, th, .code, summary {
p, a, h1, h2, h3, h4, h5, h6, td, th, .code, summary, label {
color: #{$color-text-regular-normal};
}

209
resources/NibblePoker/scss/variables.scss
View File

@@ -63,13 +63,155 @@ $color-apollo-custom-20: mix($color-apollo-39, $color-apollo-38, 60%);
$color-apollo-custom-30: mix($color-apollo-01, $color-apollo-03, 80%); // Primary button
$color-apollo-custom-31: mix($color-apollo-01, $color-apollo-03, 65%); // Primary button hover
//$color-test-01: mix(#7b6aa5, #000000, 33%);
$color-test-02: #007c7d;
/* Variables > Palettes > Material UI */
// https://materialui.co/colors
/* Variables > Colors */
$color-material-blueGrey-50: #eceff1;
$color-material-blueGrey-100: #cfd8dc;
$color-material-blueGrey-200: #b0bec5;
$color-material-blueGrey-300: #90a4ae;
$color-material-blueGrey-400: #78909c;
$color-material-blueGrey-500: #607d8b;
$color-material-blueGrey-600: #546e7a;
$color-material-blueGrey-700: #455a64;
$color-material-blueGrey-800: #37474f;
$color-material-blueGrey-900: #263238;
$color-material-blueGrey-1000: #151D21;
$color-material-blueGrey-850: mix($color-material-blueGrey-800, $color-material-blueGrey-900, 50%);
//$color-material-blueGrey-925: mix($color-material-blueGrey-1000, $color-material-blueGrey-900, 25%);
$color-material-blueGrey-950: mix($color-material-blueGrey-1000, $color-material-blueGrey-900, 50%);
/* Variables > Palettes > WinUI 3 */
$color-winui-00: #191919;
$color-winui-01: #1D1D1D;
$color-winui-02: #202020;
$color-winui-03: #232323;
$color-winui-04: #272727;
$color-winui-05: #323232;
$color-winui-06: #3E3E3E;
// https://flatuicolors.com/palette/defo
/* Variables > Palettes > Misc */
//$color-test-01: mix(#7b6aa5, #000000, 33%);
//$color-test-02: #007c7d;
/* Variables > Colors Mappings */
$color-unset: $color-apollo-34;
//$color-unset: deeppink;
/* Variables > Theme selection */
// Available themes:
// * Teal Supreme (teal)
// * WinUI 3 (winui)
// * La Moiti Leune (moon)
$theme: teal;
/* Variables > Colors Mappings > Backgrounds & Borders */
$color-background-body: map-get((
teal: $color-apollo-custom-00,
winui: $color-winui-02,
moon: $color-unset,
), $theme);
$color-background-main: map-get((
teal: $color-apollo-custom-02,
winui: $color-winui-04,
moon: $color-unset,
), $theme);
$color-background-surround: map-get((
teal: $color-apollo-custom-00,
winui: $color-winui-02,
moon: $color-unset,
), $theme);
// FIXME: Remove its usage !
// Left: Code, Kbd, Scrollbar ???
$color-border-all: $color-unset; // Default border
$color-border-light: $color-unset; // For .b-light class (No longer exists !)
$color-border-surround: map-get((
teal: $color-apollo-38,
winui: $color-winui-01,
moon: $color-unset,
), $theme);
$color-border-main: map-get((
teal: $color-apollo-38, // $color-apollo-custom-20;
winui: $color-winui-03,
moon: $color-unset,
), $theme);
$color-background-main-headings: map-get((
teal: $color-apollo-custom-03,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-background-code: map-get((
teal: $color-apollo-custom-20,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-border-code: map-get((
teal: #{$color-border-surround}CF,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-background-table-main: map-get((
teal: $color-apollo-custom-01,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-background-table-dual: map-get((
teal: $color-apollo-custom-00,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-table-border: map-get((
teal: $color-apollo-39,
winui: $color-unset,
moon: $color-unset,
), $theme);
$color-background-inputs: $color-apollo-40;
$color-background-checkbox-checked: $color-apollo-08;
$color-background-checkbox-unchecked: $color-apollo-27;
$color-background-button: $color-apollo-40;
$color-background-button-hover: $color-apollo-custom-10;
$color-background-button-primary: #{$color-apollo-custom-30};
$color-background-button-primary-hover: #{$color-apollo-custom-31};
$color-background-button-success: #{$color-apollo-07};
$color-background-button-success-hover: #{$color-apollo-08};
$color-background-button-error: #{$color-apollo-26};
$color-background-button-error-hover: #{$color-apollo-27};
$color-background-button-warning: #{$color-apollo-20};
$color-background-button-warning-hover: #{$color-apollo-21};
/* Variables > Colors Mappings > Text */
$color-text-regular-normal: $color-apollo-45;
$color-text-inputs: $color-apollo-45;
@@ -82,8 +224,8 @@ $color-link-hover: rgb(253, 255, 251);
$color-link-blue: #{$color-apollo-04};
$color-link-blue-hover: #{$color-apollo-05};
$color-border-all: $color-apollo-38;
$color-border-light: $color-apollo-custom-20;
//$color-border-all: $color-apollo-38;
//$color-border-light: $color-apollo-custom-20;
$color-input-glow: $color-apollo-02;
@@ -91,56 +233,13 @@ $color-wedge-blue-background: $color-apollo-03;
$color-wedge-blue-border: $color-apollo-02;
//$color-background-body: $color-apollo-custom-00;
//$color-background-main: $color-apollo-39;
////$color-background-surround: $color-apollo-40;
//$color-background-main: $color-apollo-custom-02;
//$color-background-surround: $color-apollo-custom-00;
$color-background-body: $color-apollo-custom-00;
$color-background-main: $color-apollo-custom-02;
$color-background-surround: $color-apollo-custom-00;
// TMP
//$color-background-main: mix(#333c57, #566c86, 60%);
//$color-background-surround: mix(#333c57, #566c86, 80%);
//$color-background-main-headings: $color-apollo-40;
$color-background-main-headings: $color-apollo-custom-03;
$color-background-code: #{$color-apollo-custom-20};
$color-border-code: #{$color-border-all}CF;
$color-background-table-main: $color-apollo-custom-01;
$color-background-table-dual: $color-apollo-custom-00;
//$color-table-border: $color-apollo-41;
$color-table-border: $color-apollo-39;
$color-background-inputs: $color-apollo-40;
$color-background-button: $color-apollo-40;
$color-background-button-hover: $color-apollo-custom-10;
$color-background-button-primary: #{$color-apollo-custom-30};
$color-background-button-primary-hover: #{$color-apollo-custom-31};
$_color-white-lighter: rgb(253, 255, 251);
$_color-white-light: rgb(235, 237, 233);
$_color-white-medium: rgb(217, 222, 218);
$_color-white-dark: rgb(199, 207, 204);
$_color-black-lighter: rgb(43, 46, 51);
$_color-black-light: rgb(37, 40, 45);
$_color-black-medium: rgb(31, 34, 39);
$_color-black-dark: rgb(25, 28, 32);
$_color-black-full: rgb(13, 14, 26);
$_color-text-white-065: rgba(255, 255, 255, 0.65);
$_color-text-white-075: rgba(255, 255, 255, 0.75);
$_color-text-white-085: rgba(255, 255, 255, 0.85);
$_color-blue-light: #4f6dce;
$_color-blue-medium: #3b5dc8;
$_color-blue-dark: #3353b6;
$_color-white-muted: #FFFFFF96;
//rgba(255, 255, 255, 0.6)
//
//// TMP V2
//$color-background-body: $color-material-blueGrey-900;
//$color-background-main: $color-material-blueGrey-950;
//$color-background-surround: $color-material-blueGrey-900;
/* Variables > Scrollbar */