47 changed files with 59799 additions and 0 deletions
@ -0,0 +1,70 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<title>Kalkulačka</title> |
|||
<link rel="stylesheet" href="css/bootstrap.css"> |
|||
<style> |
|||
.calculator { |
|||
border: 1px solid #aaa; |
|||
border-radius: 10px; |
|||
padding: 15px; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<div class="container"> |
|||
<h1 class="mt-3 text-center">Kalkulačka EZ, která není dokonalá</h1> |
|||
|
|||
<div class="justify-content-center"> |
|||
<div class="calculator"> |
|||
<input type="text" id="display" class="form-control form-control-lg" readonly> |
|||
<!-- div.row*4>div.col-md-3*4>button.btn.btn-outline-dark --> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('7')">7</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('8')">8</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('9')">9</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator" onclick="addText('/')">/</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('4')">4</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('5')">5</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('6')">6</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator" onclick="addText('*')">*</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('1')">1</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('2')">2</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('3')">3</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator" onclick="addText('-')">-</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number" onclick="addText('0')">0</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 decimal" onclick="addText('.')">.</button></div> |
|||
<div class="col-md-3"><button class="btn btn-success w-100" id="equals" onclick="calculate()">=</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator" onclick="addText('+')">+</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-12"><button class="btn btn-outline-danger w-100" id="clear">C</button></div> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
<script src="js/bootstrap.bundle.js"></script> |
|||
<script> |
|||
function addText(txt) { |
|||
document.getElementById("display").value += txt; |
|||
} |
|||
|
|||
function calculate() { |
|||
document.getElementById("display").value = eval(document.getElementById("display").value); |
|||
} |
|||
|
|||
</script> |
|||
</body> |
|||
</html> |
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,597 @@ |
|||
/*! |
|||
* Bootstrap Reboot v5.3.3 (https://getbootstrap.com/) |
|||
* Copyright 2011-2024 The Bootstrap Authors |
|||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) |
|||
*/ |
|||
:root, |
|||
[data-bs-theme=light] { |
|||
--bs-blue: #0d6efd; |
|||
--bs-indigo: #6610f2; |
|||
--bs-purple: #6f42c1; |
|||
--bs-pink: #d63384; |
|||
--bs-red: #dc3545; |
|||
--bs-orange: #fd7e14; |
|||
--bs-yellow: #ffc107; |
|||
--bs-green: #198754; |
|||
--bs-teal: #20c997; |
|||
--bs-cyan: #0dcaf0; |
|||
--bs-black: #000; |
|||
--bs-white: #fff; |
|||
--bs-gray: #6c757d; |
|||
--bs-gray-dark: #343a40; |
|||
--bs-gray-100: #f8f9fa; |
|||
--bs-gray-200: #e9ecef; |
|||
--bs-gray-300: #dee2e6; |
|||
--bs-gray-400: #ced4da; |
|||
--bs-gray-500: #adb5bd; |
|||
--bs-gray-600: #6c757d; |
|||
--bs-gray-700: #495057; |
|||
--bs-gray-800: #343a40; |
|||
--bs-gray-900: #212529; |
|||
--bs-primary: #0d6efd; |
|||
--bs-secondary: #6c757d; |
|||
--bs-success: #198754; |
|||
--bs-info: #0dcaf0; |
|||
--bs-warning: #ffc107; |
|||
--bs-danger: #dc3545; |
|||
--bs-light: #f8f9fa; |
|||
--bs-dark: #212529; |
|||
--bs-primary-rgb: 13, 110, 253; |
|||
--bs-secondary-rgb: 108, 117, 125; |
|||
--bs-success-rgb: 25, 135, 84; |
|||
--bs-info-rgb: 13, 202, 240; |
|||
--bs-warning-rgb: 255, 193, 7; |
|||
--bs-danger-rgb: 220, 53, 69; |
|||
--bs-light-rgb: 248, 249, 250; |
|||
--bs-dark-rgb: 33, 37, 41; |
|||
--bs-primary-text-emphasis: #052c65; |
|||
--bs-secondary-text-emphasis: #2b2f32; |
|||
--bs-success-text-emphasis: #0a3622; |
|||
--bs-info-text-emphasis: #055160; |
|||
--bs-warning-text-emphasis: #664d03; |
|||
--bs-danger-text-emphasis: #58151c; |
|||
--bs-light-text-emphasis: #495057; |
|||
--bs-dark-text-emphasis: #495057; |
|||
--bs-primary-bg-subtle: #cfe2ff; |
|||
--bs-secondary-bg-subtle: #e2e3e5; |
|||
--bs-success-bg-subtle: #d1e7dd; |
|||
--bs-info-bg-subtle: #cff4fc; |
|||
--bs-warning-bg-subtle: #fff3cd; |
|||
--bs-danger-bg-subtle: #f8d7da; |
|||
--bs-light-bg-subtle: #fcfcfd; |
|||
--bs-dark-bg-subtle: #ced4da; |
|||
--bs-primary-border-subtle: #9ec5fe; |
|||
--bs-secondary-border-subtle: #c4c8cb; |
|||
--bs-success-border-subtle: #a3cfbb; |
|||
--bs-info-border-subtle: #9eeaf9; |
|||
--bs-warning-border-subtle: #ffe69c; |
|||
--bs-danger-border-subtle: #f1aeb5; |
|||
--bs-light-border-subtle: #e9ecef; |
|||
--bs-dark-border-subtle: #adb5bd; |
|||
--bs-white-rgb: 255, 255, 255; |
|||
--bs-black-rgb: 0, 0, 0; |
|||
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
|||
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; |
|||
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); |
|||
--bs-body-font-family: var(--bs-font-sans-serif); |
|||
--bs-body-font-size: 1rem; |
|||
--bs-body-font-weight: 400; |
|||
--bs-body-line-height: 1.5; |
|||
--bs-body-color: #212529; |
|||
--bs-body-color-rgb: 33, 37, 41; |
|||
--bs-body-bg: #fff; |
|||
--bs-body-bg-rgb: 255, 255, 255; |
|||
--bs-emphasis-color: #000; |
|||
--bs-emphasis-color-rgb: 0, 0, 0; |
|||
--bs-secondary-color: rgba(33, 37, 41, 0.75); |
|||
--bs-secondary-color-rgb: 33, 37, 41; |
|||
--bs-secondary-bg: #e9ecef; |
|||
--bs-secondary-bg-rgb: 233, 236, 239; |
|||
--bs-tertiary-color: rgba(33, 37, 41, 0.5); |
|||
--bs-tertiary-color-rgb: 33, 37, 41; |
|||
--bs-tertiary-bg: #f8f9fa; |
|||
--bs-tertiary-bg-rgb: 248, 249, 250; |
|||
--bs-heading-color: inherit; |
|||
--bs-link-color: #0d6efd; |
|||
--bs-link-color-rgb: 13, 110, 253; |
|||
--bs-link-decoration: underline; |
|||
--bs-link-hover-color: #0a58ca; |
|||
--bs-link-hover-color-rgb: 10, 88, 202; |
|||
--bs-code-color: #d63384; |
|||
--bs-highlight-color: #212529; |
|||
--bs-highlight-bg: #fff3cd; |
|||
--bs-border-width: 1px; |
|||
--bs-border-style: solid; |
|||
--bs-border-color: #dee2e6; |
|||
--bs-border-color-translucent: rgba(0, 0, 0, 0.175); |
|||
--bs-border-radius: 0.375rem; |
|||
--bs-border-radius-sm: 0.25rem; |
|||
--bs-border-radius-lg: 0.5rem; |
|||
--bs-border-radius-xl: 1rem; |
|||
--bs-border-radius-xxl: 2rem; |
|||
--bs-border-radius-2xl: var(--bs-border-radius-xxl); |
|||
--bs-border-radius-pill: 50rem; |
|||
--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); |
|||
--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); |
|||
--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); |
|||
--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); |
|||
--bs-focus-ring-width: 0.25rem; |
|||
--bs-focus-ring-opacity: 0.25; |
|||
--bs-focus-ring-color: rgba(13, 110, 253, 0.25); |
|||
--bs-form-valid-color: #198754; |
|||
--bs-form-valid-border-color: #198754; |
|||
--bs-form-invalid-color: #dc3545; |
|||
--bs-form-invalid-border-color: #dc3545; |
|||
} |
|||
|
|||
[data-bs-theme=dark] { |
|||
color-scheme: dark; |
|||
--bs-body-color: #dee2e6; |
|||
--bs-body-color-rgb: 222, 226, 230; |
|||
--bs-body-bg: #212529; |
|||
--bs-body-bg-rgb: 33, 37, 41; |
|||
--bs-emphasis-color: #fff; |
|||
--bs-emphasis-color-rgb: 255, 255, 255; |
|||
--bs-secondary-color: rgba(222, 226, 230, 0.75); |
|||
--bs-secondary-color-rgb: 222, 226, 230; |
|||
--bs-secondary-bg: #343a40; |
|||
--bs-secondary-bg-rgb: 52, 58, 64; |
|||
--bs-tertiary-color: rgba(222, 226, 230, 0.5); |
|||
--bs-tertiary-color-rgb: 222, 226, 230; |
|||
--bs-tertiary-bg: #2b3035; |
|||
--bs-tertiary-bg-rgb: 43, 48, 53; |
|||
--bs-primary-text-emphasis: #6ea8fe; |
|||
--bs-secondary-text-emphasis: #a7acb1; |
|||
--bs-success-text-emphasis: #75b798; |
|||
--bs-info-text-emphasis: #6edff6; |
|||
--bs-warning-text-emphasis: #ffda6a; |
|||
--bs-danger-text-emphasis: #ea868f; |
|||
--bs-light-text-emphasis: #f8f9fa; |
|||
--bs-dark-text-emphasis: #dee2e6; |
|||
--bs-primary-bg-subtle: #031633; |
|||
--bs-secondary-bg-subtle: #161719; |
|||
--bs-success-bg-subtle: #051b11; |
|||
--bs-info-bg-subtle: #032830; |
|||
--bs-warning-bg-subtle: #332701; |
|||
--bs-danger-bg-subtle: #2c0b0e; |
|||
--bs-light-bg-subtle: #343a40; |
|||
--bs-dark-bg-subtle: #1a1d20; |
|||
--bs-primary-border-subtle: #084298; |
|||
--bs-secondary-border-subtle: #41464b; |
|||
--bs-success-border-subtle: #0f5132; |
|||
--bs-info-border-subtle: #087990; |
|||
--bs-warning-border-subtle: #997404; |
|||
--bs-danger-border-subtle: #842029; |
|||
--bs-light-border-subtle: #495057; |
|||
--bs-dark-border-subtle: #343a40; |
|||
--bs-heading-color: inherit; |
|||
--bs-link-color: #6ea8fe; |
|||
--bs-link-hover-color: #8bb9fe; |
|||
--bs-link-color-rgb: 110, 168, 254; |
|||
--bs-link-hover-color-rgb: 139, 185, 254; |
|||
--bs-code-color: #e685b5; |
|||
--bs-highlight-color: #dee2e6; |
|||
--bs-highlight-bg: #664d03; |
|||
--bs-border-color: #495057; |
|||
--bs-border-color-translucent: rgba(255, 255, 255, 0.15); |
|||
--bs-form-valid-color: #75b798; |
|||
--bs-form-valid-border-color: #75b798; |
|||
--bs-form-invalid-color: #ea868f; |
|||
--bs-form-invalid-border-color: #ea868f; |
|||
} |
|||
|
|||
*, |
|||
*::before, |
|||
*::after { |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
@media (prefers-reduced-motion: no-preference) { |
|||
:root { |
|||
scroll-behavior: smooth; |
|||
} |
|||
} |
|||
|
|||
body { |
|||
margin: 0; |
|||
font-family: var(--bs-body-font-family); |
|||
font-size: var(--bs-body-font-size); |
|||
font-weight: var(--bs-body-font-weight); |
|||
line-height: var(--bs-body-line-height); |
|||
color: var(--bs-body-color); |
|||
text-align: var(--bs-body-text-align); |
|||
background-color: var(--bs-body-bg); |
|||
-webkit-text-size-adjust: 100%; |
|||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
|||
} |
|||
|
|||
hr { |
|||
margin: 1rem 0; |
|||
color: inherit; |
|||
border: 0; |
|||
border-top: var(--bs-border-width) solid; |
|||
opacity: 0.25; |
|||
} |
|||
|
|||
h6, h5, h4, h3, h2, h1 { |
|||
margin-top: 0; |
|||
margin-bottom: 0.5rem; |
|||
font-weight: 500; |
|||
line-height: 1.2; |
|||
color: var(--bs-heading-color); |
|||
} |
|||
|
|||
h1 { |
|||
font-size: calc(1.375rem + 1.5vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h1 { |
|||
font-size: 2.5rem; |
|||
} |
|||
} |
|||
|
|||
h2 { |
|||
font-size: calc(1.325rem + 0.9vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h2 { |
|||
font-size: 2rem; |
|||
} |
|||
} |
|||
|
|||
h3 { |
|||
font-size: calc(1.3rem + 0.6vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h3 { |
|||
font-size: 1.75rem; |
|||
} |
|||
} |
|||
|
|||
h4 { |
|||
font-size: calc(1.275rem + 0.3vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h4 { |
|||
font-size: 1.5rem; |
|||
} |
|||
} |
|||
|
|||
h5 { |
|||
font-size: 1.25rem; |
|||
} |
|||
|
|||
h6 { |
|||
font-size: 1rem; |
|||
} |
|||
|
|||
p { |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
} |
|||
|
|||
abbr[title] { |
|||
-webkit-text-decoration: underline dotted; |
|||
text-decoration: underline dotted; |
|||
cursor: help; |
|||
-webkit-text-decoration-skip-ink: none; |
|||
text-decoration-skip-ink: none; |
|||
} |
|||
|
|||
address { |
|||
margin-bottom: 1rem; |
|||
font-style: normal; |
|||
line-height: inherit; |
|||
} |
|||
|
|||
ol, |
|||
ul { |
|||
padding-left: 2rem; |
|||
} |
|||
|
|||
ol, |
|||
ul, |
|||
dl { |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
} |
|||
|
|||
ol ol, |
|||
ul ul, |
|||
ol ul, |
|||
ul ol { |
|||
margin-bottom: 0; |
|||
} |
|||
|
|||
dt { |
|||
font-weight: 700; |
|||
} |
|||
|
|||
dd { |
|||
margin-bottom: 0.5rem; |
|||
margin-left: 0; |
|||
} |
|||
|
|||
blockquote { |
|||
margin: 0 0 1rem; |
|||
} |
|||
|
|||
b, |
|||
strong { |
|||
font-weight: bolder; |
|||
} |
|||
|
|||
small { |
|||
font-size: 0.875em; |
|||
} |
|||
|
|||
mark { |
|||
padding: 0.1875em; |
|||
color: var(--bs-highlight-color); |
|||
background-color: var(--bs-highlight-bg); |
|||
} |
|||
|
|||
sub, |
|||
sup { |
|||
position: relative; |
|||
font-size: 0.75em; |
|||
line-height: 0; |
|||
vertical-align: baseline; |
|||
} |
|||
|
|||
sub { |
|||
bottom: -0.25em; |
|||
} |
|||
|
|||
sup { |
|||
top: -0.5em; |
|||
} |
|||
|
|||
a { |
|||
color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); |
|||
text-decoration: underline; |
|||
} |
|||
a:hover { |
|||
--bs-link-color-rgb: var(--bs-link-hover-color-rgb); |
|||
} |
|||
|
|||
a:not([href]):not([class]), a:not([href]):not([class]):hover { |
|||
color: inherit; |
|||
text-decoration: none; |
|||
} |
|||
|
|||
pre, |
|||
code, |
|||
kbd, |
|||
samp { |
|||
font-family: var(--bs-font-monospace); |
|||
font-size: 1em; |
|||
} |
|||
|
|||
pre { |
|||
display: block; |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
overflow: auto; |
|||
font-size: 0.875em; |
|||
} |
|||
pre code { |
|||
font-size: inherit; |
|||
color: inherit; |
|||
word-break: normal; |
|||
} |
|||
|
|||
code { |
|||
font-size: 0.875em; |
|||
color: var(--bs-code-color); |
|||
word-wrap: break-word; |
|||
} |
|||
a > code { |
|||
color: inherit; |
|||
} |
|||
|
|||
kbd { |
|||
padding: 0.1875rem 0.375rem; |
|||
font-size: 0.875em; |
|||
color: var(--bs-body-bg); |
|||
background-color: var(--bs-body-color); |
|||
border-radius: 0.25rem; |
|||
} |
|||
kbd kbd { |
|||
padding: 0; |
|||
font-size: 1em; |
|||
} |
|||
|
|||
figure { |
|||
margin: 0 0 1rem; |
|||
} |
|||
|
|||
img, |
|||
svg { |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
table { |
|||
caption-side: bottom; |
|||
border-collapse: collapse; |
|||
} |
|||
|
|||
caption { |
|||
padding-top: 0.5rem; |
|||
padding-bottom: 0.5rem; |
|||
color: var(--bs-secondary-color); |
|||
text-align: left; |
|||
} |
|||
|
|||
th { |
|||
text-align: inherit; |
|||
text-align: -webkit-match-parent; |
|||
} |
|||
|
|||
thead, |
|||
tbody, |
|||
tfoot, |
|||
tr, |
|||
td, |
|||
th { |
|||
border-color: inherit; |
|||
border-style: solid; |
|||
border-width: 0; |
|||
} |
|||
|
|||
label { |
|||
display: inline-block; |
|||
} |
|||
|
|||
button { |
|||
border-radius: 0; |
|||
} |
|||
|
|||
button:focus:not(:focus-visible) { |
|||
outline: 0; |
|||
} |
|||
|
|||
input, |
|||
button, |
|||
select, |
|||
optgroup, |
|||
textarea { |
|||
margin: 0; |
|||
font-family: inherit; |
|||
font-size: inherit; |
|||
line-height: inherit; |
|||
} |
|||
|
|||
button, |
|||
select { |
|||
text-transform: none; |
|||
} |
|||
|
|||
[role=button] { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
select { |
|||
word-wrap: normal; |
|||
} |
|||
select:disabled { |
|||
opacity: 1; |
|||
} |
|||
|
|||
[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator { |
|||
display: none !important; |
|||
} |
|||
|
|||
button, |
|||
[type=button], |
|||
[type=reset], |
|||
[type=submit] { |
|||
-webkit-appearance: button; |
|||
} |
|||
button:not(:disabled), |
|||
[type=button]:not(:disabled), |
|||
[type=reset]:not(:disabled), |
|||
[type=submit]:not(:disabled) { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
::-moz-focus-inner { |
|||
padding: 0; |
|||
border-style: none; |
|||
} |
|||
|
|||
textarea { |
|||
resize: vertical; |
|||
} |
|||
|
|||
fieldset { |
|||
min-width: 0; |
|||
padding: 0; |
|||
margin: 0; |
|||
border: 0; |
|||
} |
|||
|
|||
legend { |
|||
float: left; |
|||
width: 100%; |
|||
padding: 0; |
|||
margin-bottom: 0.5rem; |
|||
font-size: calc(1.275rem + 0.3vw); |
|||
line-height: inherit; |
|||
} |
|||
@media (min-width: 1200px) { |
|||
legend { |
|||
font-size: 1.5rem; |
|||
} |
|||
} |
|||
legend + * { |
|||
clear: left; |
|||
} |
|||
|
|||
::-webkit-datetime-edit-fields-wrapper, |
|||
::-webkit-datetime-edit-text, |
|||
::-webkit-datetime-edit-minute, |
|||
::-webkit-datetime-edit-hour-field, |
|||
::-webkit-datetime-edit-day-field, |
|||
::-webkit-datetime-edit-month-field, |
|||
::-webkit-datetime-edit-year-field { |
|||
padding: 0; |
|||
} |
|||
|
|||
::-webkit-inner-spin-button { |
|||
height: auto; |
|||
} |
|||
|
|||
[type=search] { |
|||
-webkit-appearance: textfield; |
|||
outline-offset: -2px; |
|||
} |
|||
|
|||
/* rtl:raw: |
|||
[type="tel"], |
|||
[type="url"], |
|||
[type="email"], |
|||
[type="number"] { |
|||
direction: ltr; |
|||
} |
|||
*/ |
|||
::-webkit-search-decoration { |
|||
-webkit-appearance: none; |
|||
} |
|||
|
|||
::-webkit-color-swatch-wrapper { |
|||
padding: 0; |
|||
} |
|||
|
|||
::-webkit-file-upload-button { |
|||
font: inherit; |
|||
-webkit-appearance: button; |
|||
} |
|||
|
|||
::file-selector-button { |
|||
font: inherit; |
|||
-webkit-appearance: button; |
|||
} |
|||
|
|||
output { |
|||
display: inline-block; |
|||
} |
|||
|
|||
iframe { |
|||
border: 0; |
|||
} |
|||
|
|||
summary { |
|||
display: list-item; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
progress { |
|||
vertical-align: baseline; |
|||
} |
|||
|
|||
[hidden] { |
|||
display: none !important; |
|||
} |
|||
|
|||
/*# sourceMappingURL=bootstrap-reboot.css.map */ |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,594 @@ |
|||
/*! |
|||
* Bootstrap Reboot v5.3.3 (https://getbootstrap.com/) |
|||
* Copyright 2011-2024 The Bootstrap Authors |
|||
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) |
|||
*/ |
|||
:root, |
|||
[data-bs-theme=light] { |
|||
--bs-blue: #0d6efd; |
|||
--bs-indigo: #6610f2; |
|||
--bs-purple: #6f42c1; |
|||
--bs-pink: #d63384; |
|||
--bs-red: #dc3545; |
|||
--bs-orange: #fd7e14; |
|||
--bs-yellow: #ffc107; |
|||
--bs-green: #198754; |
|||
--bs-teal: #20c997; |
|||
--bs-cyan: #0dcaf0; |
|||
--bs-black: #000; |
|||
--bs-white: #fff; |
|||
--bs-gray: #6c757d; |
|||
--bs-gray-dark: #343a40; |
|||
--bs-gray-100: #f8f9fa; |
|||
--bs-gray-200: #e9ecef; |
|||
--bs-gray-300: #dee2e6; |
|||
--bs-gray-400: #ced4da; |
|||
--bs-gray-500: #adb5bd; |
|||
--bs-gray-600: #6c757d; |
|||
--bs-gray-700: #495057; |
|||
--bs-gray-800: #343a40; |
|||
--bs-gray-900: #212529; |
|||
--bs-primary: #0d6efd; |
|||
--bs-secondary: #6c757d; |
|||
--bs-success: #198754; |
|||
--bs-info: #0dcaf0; |
|||
--bs-warning: #ffc107; |
|||
--bs-danger: #dc3545; |
|||
--bs-light: #f8f9fa; |
|||
--bs-dark: #212529; |
|||
--bs-primary-rgb: 13, 110, 253; |
|||
--bs-secondary-rgb: 108, 117, 125; |
|||
--bs-success-rgb: 25, 135, 84; |
|||
--bs-info-rgb: 13, 202, 240; |
|||
--bs-warning-rgb: 255, 193, 7; |
|||
--bs-danger-rgb: 220, 53, 69; |
|||
--bs-light-rgb: 248, 249, 250; |
|||
--bs-dark-rgb: 33, 37, 41; |
|||
--bs-primary-text-emphasis: #052c65; |
|||
--bs-secondary-text-emphasis: #2b2f32; |
|||
--bs-success-text-emphasis: #0a3622; |
|||
--bs-info-text-emphasis: #055160; |
|||
--bs-warning-text-emphasis: #664d03; |
|||
--bs-danger-text-emphasis: #58151c; |
|||
--bs-light-text-emphasis: #495057; |
|||
--bs-dark-text-emphasis: #495057; |
|||
--bs-primary-bg-subtle: #cfe2ff; |
|||
--bs-secondary-bg-subtle: #e2e3e5; |
|||
--bs-success-bg-subtle: #d1e7dd; |
|||
--bs-info-bg-subtle: #cff4fc; |
|||
--bs-warning-bg-subtle: #fff3cd; |
|||
--bs-danger-bg-subtle: #f8d7da; |
|||
--bs-light-bg-subtle: #fcfcfd; |
|||
--bs-dark-bg-subtle: #ced4da; |
|||
--bs-primary-border-subtle: #9ec5fe; |
|||
--bs-secondary-border-subtle: #c4c8cb; |
|||
--bs-success-border-subtle: #a3cfbb; |
|||
--bs-info-border-subtle: #9eeaf9; |
|||
--bs-warning-border-subtle: #ffe69c; |
|||
--bs-danger-border-subtle: #f1aeb5; |
|||
--bs-light-border-subtle: #e9ecef; |
|||
--bs-dark-border-subtle: #adb5bd; |
|||
--bs-white-rgb: 255, 255, 255; |
|||
--bs-black-rgb: 0, 0, 0; |
|||
--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; |
|||
--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; |
|||
--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); |
|||
--bs-body-font-family: var(--bs-font-sans-serif); |
|||
--bs-body-font-size: 1rem; |
|||
--bs-body-font-weight: 400; |
|||
--bs-body-line-height: 1.5; |
|||
--bs-body-color: #212529; |
|||
--bs-body-color-rgb: 33, 37, 41; |
|||
--bs-body-bg: #fff; |
|||
--bs-body-bg-rgb: 255, 255, 255; |
|||
--bs-emphasis-color: #000; |
|||
--bs-emphasis-color-rgb: 0, 0, 0; |
|||
--bs-secondary-color: rgba(33, 37, 41, 0.75); |
|||
--bs-secondary-color-rgb: 33, 37, 41; |
|||
--bs-secondary-bg: #e9ecef; |
|||
--bs-secondary-bg-rgb: 233, 236, 239; |
|||
--bs-tertiary-color: rgba(33, 37, 41, 0.5); |
|||
--bs-tertiary-color-rgb: 33, 37, 41; |
|||
--bs-tertiary-bg: #f8f9fa; |
|||
--bs-tertiary-bg-rgb: 248, 249, 250; |
|||
--bs-heading-color: inherit; |
|||
--bs-link-color: #0d6efd; |
|||
--bs-link-color-rgb: 13, 110, 253; |
|||
--bs-link-decoration: underline; |
|||
--bs-link-hover-color: #0a58ca; |
|||
--bs-link-hover-color-rgb: 10, 88, 202; |
|||
--bs-code-color: #d63384; |
|||
--bs-highlight-color: #212529; |
|||
--bs-highlight-bg: #fff3cd; |
|||
--bs-border-width: 1px; |
|||
--bs-border-style: solid; |
|||
--bs-border-color: #dee2e6; |
|||
--bs-border-color-translucent: rgba(0, 0, 0, 0.175); |
|||
--bs-border-radius: 0.375rem; |
|||
--bs-border-radius-sm: 0.25rem; |
|||
--bs-border-radius-lg: 0.5rem; |
|||
--bs-border-radius-xl: 1rem; |
|||
--bs-border-radius-xxl: 2rem; |
|||
--bs-border-radius-2xl: var(--bs-border-radius-xxl); |
|||
--bs-border-radius-pill: 50rem; |
|||
--bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); |
|||
--bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); |
|||
--bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175); |
|||
--bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075); |
|||
--bs-focus-ring-width: 0.25rem; |
|||
--bs-focus-ring-opacity: 0.25; |
|||
--bs-focus-ring-color: rgba(13, 110, 253, 0.25); |
|||
--bs-form-valid-color: #198754; |
|||
--bs-form-valid-border-color: #198754; |
|||
--bs-form-invalid-color: #dc3545; |
|||
--bs-form-invalid-border-color: #dc3545; |
|||
} |
|||
|
|||
[data-bs-theme=dark] { |
|||
color-scheme: dark; |
|||
--bs-body-color: #dee2e6; |
|||
--bs-body-color-rgb: 222, 226, 230; |
|||
--bs-body-bg: #212529; |
|||
--bs-body-bg-rgb: 33, 37, 41; |
|||
--bs-emphasis-color: #fff; |
|||
--bs-emphasis-color-rgb: 255, 255, 255; |
|||
--bs-secondary-color: rgba(222, 226, 230, 0.75); |
|||
--bs-secondary-color-rgb: 222, 226, 230; |
|||
--bs-secondary-bg: #343a40; |
|||
--bs-secondary-bg-rgb: 52, 58, 64; |
|||
--bs-tertiary-color: rgba(222, 226, 230, 0.5); |
|||
--bs-tertiary-color-rgb: 222, 226, 230; |
|||
--bs-tertiary-bg: #2b3035; |
|||
--bs-tertiary-bg-rgb: 43, 48, 53; |
|||
--bs-primary-text-emphasis: #6ea8fe; |
|||
--bs-secondary-text-emphasis: #a7acb1; |
|||
--bs-success-text-emphasis: #75b798; |
|||
--bs-info-text-emphasis: #6edff6; |
|||
--bs-warning-text-emphasis: #ffda6a; |
|||
--bs-danger-text-emphasis: #ea868f; |
|||
--bs-light-text-emphasis: #f8f9fa; |
|||
--bs-dark-text-emphasis: #dee2e6; |
|||
--bs-primary-bg-subtle: #031633; |
|||
--bs-secondary-bg-subtle: #161719; |
|||
--bs-success-bg-subtle: #051b11; |
|||
--bs-info-bg-subtle: #032830; |
|||
--bs-warning-bg-subtle: #332701; |
|||
--bs-danger-bg-subtle: #2c0b0e; |
|||
--bs-light-bg-subtle: #343a40; |
|||
--bs-dark-bg-subtle: #1a1d20; |
|||
--bs-primary-border-subtle: #084298; |
|||
--bs-secondary-border-subtle: #41464b; |
|||
--bs-success-border-subtle: #0f5132; |
|||
--bs-info-border-subtle: #087990; |
|||
--bs-warning-border-subtle: #997404; |
|||
--bs-danger-border-subtle: #842029; |
|||
--bs-light-border-subtle: #495057; |
|||
--bs-dark-border-subtle: #343a40; |
|||
--bs-heading-color: inherit; |
|||
--bs-link-color: #6ea8fe; |
|||
--bs-link-hover-color: #8bb9fe; |
|||
--bs-link-color-rgb: 110, 168, 254; |
|||
--bs-link-hover-color-rgb: 139, 185, 254; |
|||
--bs-code-color: #e685b5; |
|||
--bs-highlight-color: #dee2e6; |
|||
--bs-highlight-bg: #664d03; |
|||
--bs-border-color: #495057; |
|||
--bs-border-color-translucent: rgba(255, 255, 255, 0.15); |
|||
--bs-form-valid-color: #75b798; |
|||
--bs-form-valid-border-color: #75b798; |
|||
--bs-form-invalid-color: #ea868f; |
|||
--bs-form-invalid-border-color: #ea868f; |
|||
} |
|||
|
|||
*, |
|||
*::before, |
|||
*::after { |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
@media (prefers-reduced-motion: no-preference) { |
|||
:root { |
|||
scroll-behavior: smooth; |
|||
} |
|||
} |
|||
|
|||
body { |
|||
margin: 0; |
|||
font-family: var(--bs-body-font-family); |
|||
font-size: var(--bs-body-font-size); |
|||
font-weight: var(--bs-body-font-weight); |
|||
line-height: var(--bs-body-line-height); |
|||
color: var(--bs-body-color); |
|||
text-align: var(--bs-body-text-align); |
|||
background-color: var(--bs-body-bg); |
|||
-webkit-text-size-adjust: 100%; |
|||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); |
|||
} |
|||
|
|||
hr { |
|||
margin: 1rem 0; |
|||
color: inherit; |
|||
border: 0; |
|||
border-top: var(--bs-border-width) solid; |
|||
opacity: 0.25; |
|||
} |
|||
|
|||
h6, h5, h4, h3, h2, h1 { |
|||
margin-top: 0; |
|||
margin-bottom: 0.5rem; |
|||
font-weight: 500; |
|||
line-height: 1.2; |
|||
color: var(--bs-heading-color); |
|||
} |
|||
|
|||
h1 { |
|||
font-size: calc(1.375rem + 1.5vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h1 { |
|||
font-size: 2.5rem; |
|||
} |
|||
} |
|||
|
|||
h2 { |
|||
font-size: calc(1.325rem + 0.9vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h2 { |
|||
font-size: 2rem; |
|||
} |
|||
} |
|||
|
|||
h3 { |
|||
font-size: calc(1.3rem + 0.6vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h3 { |
|||
font-size: 1.75rem; |
|||
} |
|||
} |
|||
|
|||
h4 { |
|||
font-size: calc(1.275rem + 0.3vw); |
|||
} |
|||
@media (min-width: 1200px) { |
|||
h4 { |
|||
font-size: 1.5rem; |
|||
} |
|||
} |
|||
|
|||
h5 { |
|||
font-size: 1.25rem; |
|||
} |
|||
|
|||
h6 { |
|||
font-size: 1rem; |
|||
} |
|||
|
|||
p { |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
} |
|||
|
|||
abbr[title] { |
|||
-webkit-text-decoration: underline dotted; |
|||
text-decoration: underline dotted; |
|||
cursor: help; |
|||
-webkit-text-decoration-skip-ink: none; |
|||
text-decoration-skip-ink: none; |
|||
} |
|||
|
|||
address { |
|||
margin-bottom: 1rem; |
|||
font-style: normal; |
|||
line-height: inherit; |
|||
} |
|||
|
|||
ol, |
|||
ul { |
|||
padding-right: 2rem; |
|||
} |
|||
|
|||
ol, |
|||
ul, |
|||
dl { |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
} |
|||
|
|||
ol ol, |
|||
ul ul, |
|||
ol ul, |
|||
ul ol { |
|||
margin-bottom: 0; |
|||
} |
|||
|
|||
dt { |
|||
font-weight: 700; |
|||
} |
|||
|
|||
dd { |
|||
margin-bottom: 0.5rem; |
|||
margin-right: 0; |
|||
} |
|||
|
|||
blockquote { |
|||
margin: 0 0 1rem; |
|||
} |
|||
|
|||
b, |
|||
strong { |
|||
font-weight: bolder; |
|||
} |
|||
|
|||
small { |
|||
font-size: 0.875em; |
|||
} |
|||
|
|||
mark { |
|||
padding: 0.1875em; |
|||
color: var(--bs-highlight-color); |
|||
background-color: var(--bs-highlight-bg); |
|||
} |
|||
|
|||
sub, |
|||
sup { |
|||
position: relative; |
|||
font-size: 0.75em; |
|||
line-height: 0; |
|||
vertical-align: baseline; |
|||
} |
|||
|
|||
sub { |
|||
bottom: -0.25em; |
|||
} |
|||
|
|||
sup { |
|||
top: -0.5em; |
|||
} |
|||
|
|||
a { |
|||
color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1)); |
|||
text-decoration: underline; |
|||
} |
|||
a:hover { |
|||
--bs-link-color-rgb: var(--bs-link-hover-color-rgb); |
|||
} |
|||
|
|||
a:not([href]):not([class]), a:not([href]):not([class]):hover { |
|||
color: inherit; |
|||
text-decoration: none; |
|||
} |
|||
|
|||
pre, |
|||
code, |
|||
kbd, |
|||
samp { |
|||
font-family: var(--bs-font-monospace); |
|||
font-size: 1em; |
|||
} |
|||
|
|||
pre { |
|||
display: block; |
|||
margin-top: 0; |
|||
margin-bottom: 1rem; |
|||
overflow: auto; |
|||
font-size: 0.875em; |
|||
} |
|||
pre code { |
|||
font-size: inherit; |
|||
color: inherit; |
|||
word-break: normal; |
|||
} |
|||
|
|||
code { |
|||
font-size: 0.875em; |
|||
color: var(--bs-code-color); |
|||
word-wrap: break-word; |
|||
} |
|||
a > code { |
|||
color: inherit; |
|||
} |
|||
|
|||
kbd { |
|||
padding: 0.1875rem 0.375rem; |
|||
font-size: 0.875em; |
|||
color: var(--bs-body-bg); |
|||
background-color: var(--bs-body-color); |
|||
border-radius: 0.25rem; |
|||
} |
|||
kbd kbd { |
|||
padding: 0; |
|||
font-size: 1em; |
|||
} |
|||
|
|||
figure { |
|||
margin: 0 0 1rem; |
|||
} |
|||
|
|||
img, |
|||
svg { |
|||
vertical-align: middle; |
|||
} |
|||
|
|||
table { |
|||
caption-side: bottom; |
|||
border-collapse: collapse; |
|||
} |
|||
|
|||
caption { |
|||
padding-top: 0.5rem; |
|||
padding-bottom: 0.5rem; |
|||
color: var(--bs-secondary-color); |
|||
text-align: right; |
|||
} |
|||
|
|||
th { |
|||
text-align: inherit; |
|||
text-align: -webkit-match-parent; |
|||
} |
|||
|
|||
thead, |
|||
tbody, |
|||
tfoot, |
|||
tr, |
|||
td, |
|||
th { |
|||
border-color: inherit; |
|||
border-style: solid; |
|||
border-width: 0; |
|||
} |
|||
|
|||
label { |
|||
display: inline-block; |
|||
} |
|||
|
|||
button { |
|||
border-radius: 0; |
|||
} |
|||
|
|||
button:focus:not(:focus-visible) { |
|||
outline: 0; |
|||
} |
|||
|
|||
input, |
|||
button, |
|||
select, |
|||
optgroup, |
|||
textarea { |
|||
margin: 0; |
|||
font-family: inherit; |
|||
font-size: inherit; |
|||
line-height: inherit; |
|||
} |
|||
|
|||
button, |
|||
select { |
|||
text-transform: none; |
|||
} |
|||
|
|||
[role=button] { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
select { |
|||
word-wrap: normal; |
|||
} |
|||
select:disabled { |
|||
opacity: 1; |
|||
} |
|||
|
|||
[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator { |
|||
display: none !important; |
|||
} |
|||
|
|||
button, |
|||
[type=button], |
|||
[type=reset], |
|||
[type=submit] { |
|||
-webkit-appearance: button; |
|||
} |
|||
button:not(:disabled), |
|||
[type=button]:not(:disabled), |
|||
[type=reset]:not(:disabled), |
|||
[type=submit]:not(:disabled) { |
|||
cursor: pointer; |
|||
} |
|||
|
|||
::-moz-focus-inner { |
|||
padding: 0; |
|||
border-style: none; |
|||
} |
|||
|
|||
textarea { |
|||
resize: vertical; |
|||
} |
|||
|
|||
fieldset { |
|||
min-width: 0; |
|||
padding: 0; |
|||
margin: 0; |
|||
border: 0; |
|||
} |
|||
|
|||
legend { |
|||
float: right; |
|||
width: 100%; |
|||
padding: 0; |
|||
margin-bottom: 0.5rem; |
|||
font-size: calc(1.275rem + 0.3vw); |
|||
line-height: inherit; |
|||
} |
|||
@media (min-width: 1200px) { |
|||
legend { |
|||
font-size: 1.5rem; |
|||
} |
|||
} |
|||
legend + * { |
|||
clear: right; |
|||
} |
|||
|
|||
::-webkit-datetime-edit-fields-wrapper, |
|||
::-webkit-datetime-edit-text, |
|||
::-webkit-datetime-edit-minute, |
|||
::-webkit-datetime-edit-hour-field, |
|||
::-webkit-datetime-edit-day-field, |
|||
::-webkit-datetime-edit-month-field, |
|||
::-webkit-datetime-edit-year-field { |
|||
padding: 0; |
|||
} |
|||
|
|||
::-webkit-inner-spin-button { |
|||
height: auto; |
|||
} |
|||
|
|||
[type=search] { |
|||
-webkit-appearance: textfield; |
|||
outline-offset: -2px; |
|||
} |
|||
|
|||
[type="tel"], |
|||
[type="url"], |
|||
[type="email"], |
|||
[type="number"] { |
|||
direction: ltr; |
|||
} |
|||
::-webkit-search-decoration { |
|||
-webkit-appearance: none; |
|||
} |
|||
|
|||
::-webkit-color-swatch-wrapper { |
|||
padding: 0; |
|||
} |
|||
|
|||
::-webkit-file-upload-button { |
|||
font: inherit; |
|||
-webkit-appearance: button; |
|||
} |
|||
|
|||
::file-selector-button { |
|||
font: inherit; |
|||
-webkit-appearance: button; |
|||
} |
|||
|
|||
output { |
|||
display: inline-block; |
|||
} |
|||
|
|||
iframe { |
|||
border: 0; |
|||
} |
|||
|
|||
summary { |
|||
display: list-item; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
progress { |
|||
vertical-align: baseline; |
|||
} |
|||
|
|||
[hidden] { |
|||
display: none !important; |
|||
} |
|||
/*# sourceMappingURL=bootstrap-reboot.rtl.css.map */ |
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,61 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<title>Kalkulačka</title> |
|||
<link rel="stylesheet" href="css/bootstrap.css"> |
|||
<style> |
|||
.calculator { |
|||
border: 1px solid #aaa; |
|||
border-radius: 10px; |
|||
padding: 15px; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<div class="container"> |
|||
<h1 class="mt-3 text-center">Kalkulačka</h1> |
|||
|
|||
<div class="justify-content-center"> |
|||
<div class="calculator"> |
|||
<input type="text" id="display" class="form-control form-control-lg" readonly> |
|||
<!-- div.row*4>div.col-md-3*4>button.btn.btn-outline-dark --> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">7</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">8</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">9</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator">/</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">4</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">5</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">6</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator">*</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">1</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">2</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">3</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator">-</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 number">0</button></div> |
|||
<div class="col-md-3"><button class="btn btn-outline-dark w-100 decimal">.</button></div> |
|||
<div class="col-md-3"><button class="btn btn-success w-100" id="equals">=</button></div> |
|||
<div class="col-md-3"><button class="btn btn-primary w-100 operator">+</button></div> |
|||
</div> |
|||
<div class="row my-2"> |
|||
<div class="col-md-12"><button class="btn btn-outline-danger w-100" id="clear">C</button></div> |
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
</div> |
|||
|
|||
<script src="js/bootstrap.bundle.js"></script> |
|||
<script src="js/calculator.js"></script> |
|||
</body> |
|||
</html> |
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,80 @@ |
|||
const display = document.getElementById("display"); |
|||
const numbers = document.querySelectorAll(".number"); |
|||
const operators = document.querySelectorAll(".operator"); |
|||
const equals = document.getElementById("equals"); |
|||
const clear = document.getElementById("clear"); |
|||
const decimal = document.querySelector(".decimal"); |
|||
|
|||
let currentInput = ""; |
|||
let firstOperand = null; |
|||
let operator = null; |
|||
|
|||
numbers.forEach( number=> { |
|||
number.addEventListener("click", () => { |
|||
currentInput += number.textContent; |
|||
display.value = currentInput; |
|||
}) |
|||
}) |
|||
decimal.addEventListener("click", () => { |
|||
if(!currentInput.includes(".")) { |
|||
currentInput += "."; |
|||
display.value = currentInput; |
|||
} |
|||
}) |
|||
|
|||
|
|||
operators.forEach(op => { |
|||
op.addEventListener("click", () => { |
|||
if(currentInput !== "") { |
|||
if(firstOperand === null){ |
|||
firstOperand = parseFloat(currentInput); |
|||
} else { |
|||
calculate(); |
|||
firstOperand = parseFloat(currentInput); |
|||
} |
|||
operator = op.textContent; |
|||
currentInput = ""; |
|||
} |
|||
}) |
|||
}) |
|||
|
|||
function calculate() { |
|||
const secondOperand = parseFloat(currentInput); |
|||
let result; |
|||
switch(operator) { |
|||
case "+": |
|||
result = firstOperand + secondOperand; |
|||
break; |
|||
case "-": |
|||
result = firstOperand - secondOperand; |
|||
break; |
|||
case "*": |
|||
result = firstOperand * secondOperand; |
|||
break; |
|||
case "/": |
|||
if(secondOperand == 0) { |
|||
result = "Nelze dělit nulou"; |
|||
} else { |
|||
result = firstOperand / secondOperand; |
|||
} |
|||
break; |
|||
} |
|||
currentInput = result.toString(); |
|||
display.value = currentInput; |
|||
} |
|||
|
|||
equals.addEventListener("click", () => { |
|||
if(firstOperand !== null && operator !== null |
|||
&& currentInput !== null) { |
|||
calculate(); |
|||
firstOperand = null; |
|||
operator = null; |
|||
} |
|||
}) |
|||
|
|||
clear.addEventListener("click", () => { |
|||
currentInput = ""; |
|||
operator = null; |
|||
firstOperand = null; |
|||
display.value = ""; |
|||
}) |
Loading…
Reference in new issue