summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--styles/input.css461
1 files changed, 0 insertions, 461 deletions
diff --git a/styles/input.css b/styles/input.css
deleted file mode 100644
index 0b56982..0000000
--- a/styles/input.css
+++ /dev/null
@@ -1,461 +0,0 @@
-/* Begin Input CSS */
-
-/* All input */
-
-input, select
-{
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
-
- margin: 5px;
-
- display: block;
-
- box-sizing: border-box;
-}
-
-/* Button input */
-
-input[type=button], input[type=submit], button, a
-{
- padding: 10px;
-
- border: none;
- border-radius: 5px;
-
- background-color: var(--input-bg-button);
- color: var(--input-color-button);
-
- font-size: medium;
-
- transition-duration: 0.2s;
-
- cursor: pointer;
-}
-
-input[type=button]:hover, input[type=submit]:hover, button:hover, a:hover
-{
- background-color: var(--input-bg-button-hover);
-}
-
-input[type=button]:active, input[type=submit]:active, button:active, a:active
-{
- background-color: var(--input-bg-button-active);
-}
-
-/* Text, date, number, and time input */
-
-input[type=text], input[type=date], input[type=time], input[type="number"]
-{
- border: 2px solid var(--input-border-text);
- border-radius: 3px;
- padding: 5px;
- background-color: var(--input-bg-text);
- color: var(--input-color-text);
- font-size: 1em;
-}
-
-input[type=text]:hover, input[type=date]:hover, input[type=time]:hover, input[type="number"]:hover
-{
- border-color: var(--input-border-text-hover);
-}
-
-input[type=text]:focus, input[type=date]:focus, input[type=time]:focus, input[type="number"]:focus
-{
- border-color: var(--input-border-text-active);
-}
-
-/* Radial input */
-
-input[type=radio]
-{
- width: 20px;
- height: 20px;
-
- border: 3px solid var(--input-border-bool);
- border-radius: 50%;
-
- transition-duration: 0.2s;
-
- background-color: var(--input-bg-bool);
-
- cursor: pointer;
-
- display: inline-block;
- vertical-align: middle;
-}
-
-input[type=radio]:checked, input[type=radio]:hover{
- border-width: 6px;
-}
-
-input[type=radio]:checked
-{
- background-color: var(--input-bg-bool-true);
- border-color: var(--input-border-bool-true);
-}
-
-input[type=radio]:hover
-{
- background-color: var(--input-bg-bool-hover);
- border-color: var(--input-border-bool-hover);
-}
-
-input[type=radio]:active
-{
- background-color: var(--input-bg-bool-active);
- border-color: var(--input-border-bool-active);
-}
-
-/* Checkbox input */
-
-input[type=checkbox]
-{
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
-
- display: inline-block;
- vertical-align: middle;
-
- width: 20px;
- height: 20px;
-
- border: 3px solid var(--input-border-bool);
-
- border-radius: 2px;
-
- transition-duration: 0.2s;
-
- background-color: var(--input-bg-bool);
-
- cursor: pointer;
-}
-
-input[type=checkbox]:checked
-{
- border-width: 10px;
- background-color: var(--input-border-bool-true);
- border-color: var(--input-border-bool-true);
-}
-
-input[type=checkbox]:hover
-{
- background-color: var(--input-bg-bool-hover);
- border-color: var(--input-border-bool-hover);
-}
-
-input[type=checkbox]:active
-{
- background-color: var(--input-bg-bool-active);
- border-color: var(--input-border-bool-active);
-}
-
-input[type=checkbox]::after
-{
- height: 15px;
- width: 10px;
-
- box-sizing: border-box;
-
- position: relative;
-
- display: block;
-
- border-color: var(--input-bg-bool-true);
- border-style: solid;
- border-width: 0px 0px 0px 0px;
-
- top: calc(50% - 10px);
- left: calc(50% - 5px);
-
- transform-origin: center;
- transform: rotate(45deg);
-
- content: '';
-}
-
-input[type=checkbox]:checked::after
-{
- border-width: 0px 3px 3px 0px;
-}
-
-/* Color input */
-
-input[type=color]
-{
- display: inline-block;
-
- vertical-align: middle;
-
- height: 20px;
- width: 20px;
-
- margin: 0;
- padding: 0;
-
- border: 0;
-
- cursor: pointer;
-}
-
-/* File input */
-
-input[type=file]
-{
- display: none;
-}
-
-/* Custom select */
-
-div.input-select
-{
- font-size: 1em;
-
- display: block;
- position: absolute;
- z-index: 0;
-
- pointer-events: none;
-
- overflow-y: auto;
- overflow-x: hidden;
-
- max-height: 8em;
-
- border-radius: 3px;
-}
-
-div.input-select > div
-{
- display: none;
- pointer-events: none;
-}
-
-div.input-select > div[selected=true]
-{
- display: block;
-}
-
-div.input-container:focus > div.input-select
-{
- transform: translate(0, 2em);
-
- pointer-events: all;
- z-index: 1;
-
- border: 2px solid var(--input-border-select-active);
- background-color: var(--input-bg-select-active);
-}
-
-div.input-container:focus > div.input-select > div
-{
- pointer-events: all;
- display: block;
- padding: 5px;
- width: 6em;
-}
-
-div.input-container:focus > div.input-select > div:hover
-{
- background-color: var(--input-bg-select-hover);
- color: var(--input-color-select-hover);
-}
-
-div.input-container:focus > div.input-select > div[selected=true]:after
-{
- font-family: "IcoFont";
- content: '\eed8';
- font-size: medium;
-}
-
-/* Input container */
-
-*.input-container {
- margin: 5px;
- padding: 5px;
-
- border-radius: 3px;
-
- display: inline-block;
-}
-
-/* Color container */
-
-div.input-container[type=color]
-{
- text-align: center;
-
- background-color: var(--input-bg-button);
- color: var(--input-color-button);
-
- transition-duration: 0.2s;
-
- cursor: pointer;
-
- width: max-content;
-}
-
-div.input-container[type=color]::after
-{
- display: inline;
-
- vertical-align: middle;
-
- content: ' Pick a color';
-}
-
-div.input-container[type=color]:hover
-{
- background-color: var(--input-bg-button-hover);
-}
-
-div.input-container[type=color]:active
-{
- background-color: var(--input-bg-button-active);
-}
-
-/* File input container */
-
-div.input-container[type=file]
-{
- background-color: var(--input-bg-button);
- color: var(--input-color-button);
-
- transition-duration: 0.2s;
-
- cursor: pointer;
-
- text-align: center;
-
- width: max-content;
- height: max-content;
-}
-
-div.input-container[type=file]:hover
-{
- background-color: var(--input-bg-button-hover);
-}
-
-div.input-container[type=file]:active
-{
- background-color: var(--input-bg-button-active);
-}
-
-div.input-container[type=file]::after
-{
- display: inline;
-
- vertical-align: middle;
-
- content: attr(data-files);
-}
-
-/* Radio input container */
-
-div.input-container[type=radio]::before
-{
- display: block;
- content: attr(data-prompt) ":";
- transition-duration: 0.2s;
-}
-
-div.input-container[type=radio]
-{
- background-color: var(--input-bg-multi);
-}
-
-div.input-container[type=radio]:hover
-{
- background-color: var(--input-bg-multi);
-}
-
-/* Select input container */
-
-div.input-container[type=select]
-{
- border: 2px solid var(--input-border-select);
- background-color: var(--input-bg-select);
- min-height: 1.25em;
- min-width: 8em;
- width: calc(100% - 2em);
-
- color: var(--input-color-select);
-
- cursor: pointer;
-
- text-align: left;
-}
-
-div.input-container[type=select]:hover
-{
- border-color: var(--input-border-select-hover);
- background-color: var(--input-bg-select-hover);
-
- color: var(--input-color-select-hover);
-}
-
-div.input-container[type=select]:focus
-{
- border-color: var(--input-border-select-active);
- background-color: var(--input-bg-select-active);
-
- color: var(--input-color-select-active);
-
- overflow: visible;
-}
-
-div.input-container[type=select]:after
-{
- font-family: "IcoFont";
- font-size: medium;
- content: '\eab2';
- display: block;
- height: 100%;
- width: 100%;
- color: var(--input-color-select);
- text-align: right;
-}
-
-div.input-container[type=select]:after:hover
-{
- color: var(--input-color-select-hover);
-}
-
-div.input-container[type=select]:focus::after
-{
- content: '\eab9';
- color: var(--input-color-select-active);
-}
-
-/* Input Title Wrapper */
-
-div.input-title-wrapper::before
-{
- color: var(--main-color);
- content: attr(data-title);
- display: block;
-}
-
-div.input-title-wrapper
-{
- background-color: var(--main-bg);
- box-shadow: var(--gui-shadow-game) 3px 3px 2px;
- border-radius: 5px;
- margin: 10px;
- padding: 5px;
-}
-
-div.input-title-wrapper[type=checkbox]
-{
- cursor: pointer;
-}
-
-div.input-title-wrapper[type=checkbox] > input
-{
- pointer-events: none;
-}
-
-
-/* End Input CSS */ \ No newline at end of file