This repository has been archived by the owner on Apr 6, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
115 lines (106 loc) · 3.84 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script>let $ = require('jquery');</script>
<script>require('popper.js');</script>
<script>require('bootstrap');</script>
<script>
window.$ = JQuery = require('jquery');
require('bootstrap')
</script>
<style>
.matrixContainer {
border-radius: 10px/40px;
border: 2px solid #555555;
border-top-color: rgb(85, 85, 85);
border-bottom-color: rgb(85, 85, 85);
padding: 10px 5px;
border-top-color: transparent;
border-bottom-color: transparent;
margin: 0em 0.1em;
}
.table {
width: 100%;
border: none;
margin-bottom: 20px;
}
tbody, td, tfoot, th, thead, tr {
border-color: inherit;
border-style: solid;
border-width: 1px;
text-align: center;
}
.table thead th {
font-weight: bold;
text-align: left;
border: none;
padding: 10px 15px;
background: #d8d8d8;
font-size: 14px;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
}
.table tbody td {
text-align: left;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
padding: 10px 15px;
font-size: 14px;
vertical-align: top;
}
.table thead tr th:first-child, .table tbody tr td:first-child {
border-left: none;
}
.table thead tr th:last-child, .table tbody tr td:last-child {
border-right: none;
}
.table tbody tr:nth-child(even){
background: #f3f3f3;
}
</style>
<title>Matrix calc</title>
</head>
<body class="user-select-none">
<h4 class="text-center mt-1">Калькулятор умножения матриц чисел</h1>
<hr>
<div class="container" id="matrixSize">
<div class="alert alert-warning alert-dismissible fade show" role="alert">
<strong>Внимание!</strong> Для ввода значений матрицы c большим кол-вом столбцов, может потребоватся развернуть программу на полный экран
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
<div class="row">
<label class="form-label">Размер матрицы A:</label>
<div class="input-group mb-3">
<input type="number" id="aW" value="1" step="1" class="form-control">
<span class="input-group-text">x</span>
<input type="number" id="aH" value="1" step="1" class="form-control">
</div>
</div>
<div class="row">
<label class="form-label">Размер матрицы B:</label>
<div class="input-group mb-3">
<input type="number" id="bW" min="0" value="1" step="1" class="form-control">
<span class="input-group-text">x</span>
<input type="number" id="bH" min="0" value="1" step="1" class="form-control">
</div>
</div>
<button id="setMatrixSize" class="btn btn-dark">Применить</button>
</div>
<div class="container" style="display:none" id="matrixA"></div>
<div class="container" style="display:none" id="matrixB"></div>
<div class="container" style="display:none" id="result"></div>
<!-- Option 2: Separate Popper and Bootstrap JS -->
<!--
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG" crossorigin="anonymous"></script>
-->
<script src="./renderer.js"></script>
</body>
</html>