Merge pull request #3 from thecashewtrader/main

Reduce website size

.gitignore

@@ -0,0 +1 @@
+/node_modules/

README.md

@@ -15,4 +15,4 @@ The language is selected according to the Web-Browser language set; if the langu
 
 Thanks for the support.
 
-The Website uses Bootstrap and the Font [Montserrat](https://fonts.google.com/specimen/Montserrat).
+The Website uses Bootstrap.

css/custom.css

@@ -1,92 +1,106 @@
 p.fiat-info {
-	color: #4d4d4d;
+  color: #4d4d4d;
 }
 
 p.fiat-info span,
 a.fiat-tooltip {
-	color: white;
+  color: white;
 }
 
 .btn {
-	padding: 2px;
-	font-size: 0.8rem;
-	font-weight: bold;
+  padding: 2px;
+  font-size: 0.8rem;
+  font-weight: bold;
 }
 
 .clipboard-copy {
-	border-top: 1px;
-	border-bottom: 1px;
-	width: auto!important;
+  border-top: 1px;
+  border-bottom: 1px;
+  width: auto !important;
 }
 
 table.table {
-	max-width: 472px;
-	margin: auto;
+  max-width: 472px;
+  margin: auto;
 }
 
 .input-group-text {
-	width: 24%;
-	font-weight: 800;
+  width: 24%;
+  font-weight: 800;
 }
 
 input.form-control {
-	font-weight: 800;
+  font-weight: 800;
 }
 
 .equals-box {
-	text-align: center;
-	color: #e9ecef;
-	font-weight: 800;
-	font-size: 42px;
+  text-align: center;
+  color: #e9ecef;
+  font-weight: 800;
+  font-size: 42px;
 }
 
 .equals-text {
-	vertical-align: super;
+  vertical-align: super;
 }
 
 p {
-	color: #e9ecef;
+  color: #e9ecef;
 }
 
 .gold {
-	color: #e8be74;
+  color: #e8be74;
 }
 
 .cursor-default {
-	cursor: default;
+  cursor: default;
 }
 
 .cursor-pointer {
-	cursor: pointer;
+  cursor: pointer;
 }
 
 .text-center {
-	text-align: center;
+  text-align: center;
 }
 
 @media (max-width: 475px) {
-	.btn {
-		padding: 1px;
-		font-size: 12px;
-	}
+  .btn {
+    padding: 1px;
+    font-size: 12px;
+  }
 
-	h1 {
-		font-size: 1.2rem;
-	}
+  h1 {
+    font-size: 1.2rem;
+  }
 
-	p {
-		font-size: 0.88rem;
-	}
+  p {
+    font-size: 0.88rem;
+  }
 }
 
 @media (min-width: 768px) {
-	.btn {
-		min-width: 38px;
-	}
+  .btn {
+    min-width: 38px;
+  }
 }
 
 @media (min-width: 1400px) {
-	small.text-info {
-		padding-right: 7%;
-	}
+  small.text-info {
+    padding-right: 7%;
+  }
+}
+
+.bs-tooltip-auto {
+  padding: 0.4rem 0;
+}
+
+.bs-tooltip-auto .tooltip-arrow {
+  bottom: 0;
+}
+
+.bs-tooltip-auto .tooltip-arrow::before {
+  top: -1px;
+  border-width: 0.4rem 0.4rem 0;
+  border-top-color: #000;
 }

css/fonts/Montserrat.css

@@ -1,327 +0,0 @@
-/** =================== MONTSERRAT =================== **/
-
-/** Montserrat Thin **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 100;
-    font-style: normal;
-    src: url("Montserrat-Thin.woff2") format("woff2"),
-         url("Montserrat-Thin.woff") format("woff");
-}
-
-/** Montserrat Thin-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 100;
-    font-style: italic;
-    src: url("Montserrat-ThinItalic.woff2") format("woff2"),
-         url("Montserrat-ThinItalic.woff") format("woff");
-}
-
-/** Montserrat ExtraLight **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 200;
-    font-style: normal;
-    src: url("Montserrat-ExtraLight.woff2") format("woff2"),
-         url("Montserrat-ExtraLight.woff") format("woff");
-}
-
-/** Montserrat ExtraLight-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 200;
-    font-style: italic;
-    src: url("Montserrat-ExtraLightItalic.woff2") format("woff2"),
-         url("Montserrat-ExtraLightItalic.woff") format("woff");
-}
-
-/** Montserrat Light **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 300;
-    font-style: normal;
-    src: url("Montserrat-Light.woff2") format("woff2"),
-         url("Montserrat-Light.woff") format("woff");
-}
-
-/** Montserrat Light-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 300;
-    font-style: italic;
-    src: url("Montserrat-LightItalic.woff2") format("woff2"),
-         url("Montserrat-LightItalic.woff") format("woff");
-}
-
-/** Montserrat Regular **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 400;
-    font-style: normal;
-    src: url("Montserrat-Regular.woff2") format("woff2"),
-         url("Montserrat-Regular.woff") format("woff");
-}
-
-/** Montserrat Regular-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 400;
-    font-style: italic;
-    src: url("Montserrat-Italic.woff2") format("woff2"),
-         url("Montserrat-Italic.woff") format("woff");
-}
-
-/** Montserrat Medium **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 500;
-    font-style: normal;
-    src: url("Montserrat-Medium.woff2") format("woff2"),
-         url("Montserrat-Medium.woff") format("woff");
-}
-
-/** Montserrat Medium-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 500;
-    font-style: italic;
-    src: url("Montserrat-MediumItalic.woff2") format("woff2"),
-         url("Montserrat-MediumItalic.woff") format("woff");
-}
-
-/** Montserrat SemiBold **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 600;
-    font-style: normal;
-    src: url("Montserrat-SemiBold.woff2") format("woff2"),
-         url("Montserrat-SemiBold.woff") format("woff");
-}
-
-/** Montserrat SemiBold-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 600;
-    font-style: italic;
-    src: url("Montserrat-SemiBoldItalic.woff2") format("woff2"),
-         url("Montserrat-SemiBoldItalic.woff") format("woff");
-}
-
-/** Montserrat Bold **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 700;
-    font-style: normal;
-    src: url("Montserrat-Bold.woff2") format("woff2"),
-         url("Montserrat-Bold.woff") format("woff");
-}
-
-/** Montserrat Bold-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 700;
-    font-style: italic;
-    src: url("Montserrat-BoldItalic.woff2") format("woff2"),
-         url("Montserrat-BoldItalic.woff") format("woff");
-}
-
-/** Montserrat ExtraBold **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 800;
-    font-style: normal;
-    src: url("Montserrat-ExtraBold.woff2") format("woff2"),
-         url("Montserrat-ExtraBold.woff") format("woff");
-}
-
-/** Montserrat ExtraBold-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 800;
-    font-style: italic;
-    src: url("Montserrat-ExtraBoldItalic.woff2") format("woff2"),
-         url("Montserrat-ExtraBoldItalic.woff") format("woff");
-}
-
-/** Montserrat Black **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 900;
-    font-style: normal;
-    src: url("Montserrat-Black.woff2") format("woff2"),
-         url("Montserrat-Black.woff") format("woff");
-}
-
-/** Montserrat Black-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 900;
-    font-style: italic;
-    src: url("Montserrat-BlackItalic.woff2") format("woff2"),
-         url("Montserrat-BlackItalic.woff") format("woff");
-}
-
-/** =================== MONTSERRAT ALTERNATES =================== **/
-
-/** Montserrat Alternates Thin **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 100;
-    font-style: normal;
-    src: url("MontserratAlternates-Thin.woff2") format("woff2"),
-         url("MontserratAlternates-Thin.woff") format("woff");
-}
-
-/** Montserrat Alternates Thin-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 100;
-    font-style: italic;
-    src: url("MontserratAlternates-ThinItalic.woff2") format("woff2"),
-         url("MontserratAlternates-ThinItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates ExtraLight **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 200;
-    font-style: normal;
-    src: url("MontserratAlternates-ExtraLight.woff2") format("woff2"),
-         url("MontserratAlternates-ExtraLight.woff") format("woff");
-}
-
-/** Montserrat Alternates ExtraLight-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 200;
-    font-style: italic;
-    src: url("MontserratAlternates-ExtraLightItalic.woff2") format("woff2"),
-         url("MontserratAlternates-ExtraLightItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates Light **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 300;
-    font-style: normal;
-    src: url("MontserratAlternates-Light.woff2") format("woff2"),
-         url("MontserratAlternates-Light.woff") format("woff");
-}
-
-/** Montserrat Alternates Light-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 300;
-    font-style: italic;
-    src: url("MontserratAlternates-LightItalic.woff2") format("woff2"),
-         url("MontserratAlternates-LightItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates Regular **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 400;
-    font-style: normal;
-    src: url("MontserratAlternates-Regular.woff2") format("woff2"),
-         url("MontserratAlternates-Regular.woff") format("woff");
-}
-
-/** Montserrat Alternates Regular-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 400;
-    font-style: italic;
-    src: url("MontserratAlternates-Italic.woff2") format("woff2"),
-         url("MontserratAlternates-Italic.woff") format("woff");
-}
-
-/** Montserrat Alternates Medium **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 500;
-    font-style: normal;
-    src: url("MontserratAlternates-Medium.woff2") format("woff2"),
-         url("MontserratAlternates-Medium.woff") format("woff");
-}
-
-/** Montserrat Alternates Medium-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 500;
-    font-style: italic;
-    src: url("MontserratAlternates-MediumItalic.woff2") format("woff2"),
-         url("MontserratAlternates-MediumItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates SemiBold **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 600;
-    font-style: normal;
-    src: url("MontserratAlternates-SemiBold.woff2") format("woff2"),
-         url("MontserratAlternates-SemiBold.woff") format("woff");
-}
-
-/** Montserrat Alternates SemiBold-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 600;
-    font-style: italic;
-    src: url("MontserratAlternates-SemiBoldItalic.woff2") format("woff2"),
-         url("MontserratAlternates-SemiBoldItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates Bold **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 700;
-    font-style: normal;
-    src: url("MontserratAlternates-Bold.woff2") format("woff2"),
-         url("MontserratAlternates-Bold.woff") format("woff");
-}
-
-/** Montserrat Alternates Bold-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 700;
-    font-style: italic;
-    src: url("MontserratAlternates-BoldItalic.woff2") format("woff2"),
-         url("MontserratAlternates-BoldItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates ExtraBold **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 800;
-    font-style: normal;
-    src: url("MontserratAlternates-ExtraBold.woff2") format("woff2"),
-         url("MontserratAlternates-ExtraBold.woff") format("woff");
-}
-
-/** Montserrat Alternates ExtraBold-Italic **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 800;
-    font-style: italic;
-    src: url("MontserratAlternates-ExtraBoldItalic.woff2") format("woff2"),
-         url("MontserratAlternates-ExtraBoldItalic.woff") format("woff");
-}
-
-/** Montserrat Alternates Black **/
-@font-face {
-    font-family: "Montserrat Alternates";
-    font-weight: 900;
-    font-style: normal;
-    src: url("MontserratAlternates-Black.woff2") format("woff2"),
-         url("MontserratAlternates-Black.woff") format("woff");
-}
-
-/** Montserrat Alternates Black-Italic **/
-@font-face {
-    font-family: "Montserrat";
-    font-weight: 900;
-    font-style: italic;
-    src: url("MontserratAlternates-BlackItalic.woff2") format("woff2"),
-         url("MontserratAlternates-BlackItalic.woff") format("woff");
-}

css/fonts/README.MD

@@ -1,35 +0,0 @@
-# The Montserrat Font Project
-To use this font as a webfont, ```Montserrat.css``` is included.
-
-## How to use
-### 1. @import
-You can import the file into your stylesheet as follows:
-```css
-@import url("static/fonts/Montserrat/fonts/webfonts/Montserrat.css");
-```
-
-**NOTE:** The directory where the stylesheet is placed.
-
-Then we can use it to style elements:
-```css
-body {
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-}
-```
-
-### 2. \<link>ing a stylesheet
-Similarly, you could link to the same asset as you would any other CSS filter, in the \<head> of the HTML document rather than in the CSS:
-```html
-<link rel="stylesheet" type="text/css" href="static/fonts/Montserrat/fonts/webfonts/Montserrat.css">
-```
-
-**NOTE:** The directory where the stylesheet is placed.
-
-Then we can use it to style elements:
-```css
-body {
-  font-family: 'Montserrat', sans-serif;
-  font-weight: 400;
-}
-```

index.php

@@ -281,9 +281,7 @@ $xmr_in_fiat = strtr($xmr_in_fiat, ",", " ");
     <meta name="apple-mobile-web-app-title" content="Moner.ooo" />
     <meta name="apple-mobile-web-app-status-bar-style" content="#193e4c" />
     
-    <link href="css/bootstrap.min.css" rel="stylesheet" />
-    
-    <link href="css/fonts/Montserrat.css" rel="stylesheet" />
+    <link href="css/main.css" rel="stylesheet" />
     
     <style>
         html {
@@ -291,7 +289,6 @@ $xmr_in_fiat = strtr($xmr_in_fiat, ",", " ");
             height: 100%;
             background-image: linear-gradient(to bottom right, #013c4a 0, #193e4c 44%, #004b5b 100%)!important;
             color: #fff;
-            font-family: 'Montserrat'!important;
             font-style: normal;
         }
         body {
@@ -784,13 +781,7 @@ $xmr_in_fiat = strtr($xmr_in_fiat, ",", " ");
         }
     }
 </script>
-    <script src="js/bootstrap.bundle.min.js"></script>
-    <script type="text/javascript">
-    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-toggle="tooltip"]'));
-    var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
-        return new bootstrap.Tooltip(tooltipTriggerEl)
-    })
-    </script>
+    <script src="js/main.js">
     <script type="text/javascript">
     function copyToClipBoardXMR() {
         var content = document.getElementById('xmrInput');

js/main.js.LICENSE.txt

@@ -0,0 +1,59 @@
+/*!
+  * Bootstrap base-component.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap config.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap data.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap event-handler.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap index.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap manipulator.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap sanitizer.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap selector-engine.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap template-factory.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */
+
+/*!
+  * Bootstrap tooltip.js v5.3.3 (https://getbootstrap.com/)
+  * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+  */

package.json

@@ -0,0 +1,14 @@
+{
+	"scripts": {
+		"build": "webpack build --mode=production"
+	},
+	"devDependencies": {
+		"purgecss": "^6.0.0"
+	},
+	"dependencies": {
+		"@popperjs/core": "^2.11.8",
+		"bootstrap": "^5.3.3",
+		"webpack": "^5.91.0",
+		"webpack-cli": "^5.1.4"
+	}
+}

purgecss.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+	content: ['index.php'],
+	css: ['css/bootstrap.min.css'],
+	output: 'css/main.css',
+	safelist: ['tooltip', 'fade', 'show', 'bs-tooltip-top', 'tooltip-inner', 'tooltip-arrow']
+}

src/js/main.js

@@ -0,0 +1,8 @@
+import Tooltip from "bootstrap/js/dist/tooltip";
+var tooltipTriggerList = [].slice.call(
+  document.querySelectorAll('[data-toggle="tooltip"]')
+);
+var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+  return new Tooltip(tooltipTriggerEl, { placement: "top" });
+});
+console.log(tooltipList);

webpack.config.js

@@ -0,0 +1,12 @@
+'use strict'
+
+const path = require('path')
+
+module.exports = {
+  mode: 'development',
+  entry: './src/js/main.js',
+  output: {
+    filename: 'main.js',
+    path: path.resolve(__dirname, 'js'),
+  },
+}