diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..3c3629e --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +node_modules diff --git a/css/dark-theme.css b/css/dark-theme.css new file mode 100644 index 0000000..05ce12a --- /dev/null +++ b/css/dark-theme.css @@ -0,0 +1,20 @@ +.dark-theme { + background: #232729; + color: #d9d9d9; +} +.dark-theme + .card, + .list-group-item, + input, + .nav-link { + background: none!important; + border-color: #3b4145; +} +.dark-theme input { + color: #FF00B9; +} +.dark-theme input:focus { + color: #FF00B9; + box-shadow: 0px 0px 5px #FF00B9!important; + border: none; +} diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..6d33a33 --- /dev/null +++ b/css/style.css @@ -0,0 +1,111 @@ +/* +main color: #FF00B9 +*/ + +.mainBox { + max-width: 900px; + margin-left: auto; + margin-right: auto; +} +a, a:link, a:visited, a:hover { + color: #FF00B9!important; + text-decoration: none!important; +} +a:hover { + color: #FF00B9!important; + text-decoration: none!important; +} +.btn { + cursor: pointer; +} + +hr { + height: 2px!important; + + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc66ff+0,FF00B9+98 */ + background: #cc66ff; /* Old browsers */ + background: -moz-linear-gradient(left, #cc66ff 0%, #FF00B9 98%); /* FF3.6-15 */ + background: -webkit-linear-gradient(left, #cc66ff 0%,#FF00B9 98%); /* Chrome10-25,Safari5.1-6 */ + background: linear-gradient(to right, #cc66ff 0%,#FF00B9 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc66ff', endColorstr='#FF00B9',GradientType=1 ); /* IE6-9 */ +} + +.color_primary { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc66ff+0,FF00B9+98 */ +background: #cc66ff; /* Old browsers */ +background: -moz-linear-gradient(left, #cc66ff 0%, #FF00B9 98%); /* FF3.6-15 */ +background: -webkit-linear-gradient(left, #cc66ff 0%,#FF00B9 98%); /* Chrome10-25,Safari5.1-6 */ +background: linear-gradient(to right, #cc66ff 0%,#FF00B9 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ +filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc66ff', endColorstr='#FF00B9',GradientType=1 ); /* IE6-9 */ + + color: #000000!important; + font-weight: bold!important; +} + +.color_primary-o { + border: 1px solid #FF00B9!important; + color: #FF00B9!important; + background: rgba(0,0,0,0)!important; + +} + + +.color_input { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc66ff+0,FF00B9+98 */ + background: #78a9ac; /* Old browsers */ + background: -moz-linear-gradient(left, #78a9ac 0%, #78a9ac 98%); /* FF3.6-15 */ + background: -webkit-linear-gradient(left, #78a9ac 0%,#78a9ac 98%); /* Chrome10-25,Safari5.1-6 */ + background: linear-gradient(to right, #78a9ac 0%,#78a9ac 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#78a9ac', endColorstr='#78a9ac',GradientType=1 ); /* IE6-9 */ + + color: #000000!important; +} + +.invisible { + display: none!important; +} + +.disable-selection { + -moz-user-select: none; /* Firefox */ + -ms-user-select: none; /* Internet Explorer */ + -khtml-user-select: none; /* KHTML browsers (e.g. Konqueror) */ + -webkit-user-select: none; /* Chrome, Safari, and Opera */ + -webkit-touch-callout: none; /* Disable Android and iOS callouts*/ +} + +#qrcode > img { + border: 8px solid #ffffff; +} + +.upload-btn-wrapper { + position: relative; + overflow: hidden; + display: inline-block; +} + +.upload-btn-wrapper input[type=file] { + font-size: 100px; + position: absolute; + left: 0; + top: 0; + opacity: 0; +} + +.balanceBox { + /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cc66ff+0,FF00B9+98 */ + background: #cc66ff; /* Old browsers */ + background: -moz-linear-gradient(left, #cc66ff 0%, #FF00B9 98%); /* FF3.6-15 */ + background: -webkit-linear-gradient(left, #cc66ff 0%,#FF00B9 98%); /* Chrome10-25,Safari5.1-6 */ + background: linear-gradient(to right, #cc66ff 0%,#FF00B9 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc66ff', endColorstr='#FF00B9',GradientType=1 ); /* IE6-9 */ + + color: #ffffff!important; + text-align: center; + + border-radius: 5px; + padding: 10px; + /* box-shadow: 0px 0px 30px grey; */ +} +.balanceBox > h3 { + font-weight: 900; +} diff --git a/css/utils.css b/css/utils.css new file mode 100644 index 0000000..f7980d8 --- /dev/null +++ b/css/utils.css @@ -0,0 +1,35 @@ + +/* switch button */ +.onoffswitch { + position: relative; width: 46px; + -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none; +} +.onoffswitch-checkbox { + display: none; +} +.onoffswitch-label { + display: block; overflow: hidden; cursor: pointer; + height: 20px; padding: 0; line-height: 20px; + border: 2px solid #FFFFFF; border-radius: 20px; + background-color: #9E9E9E; + transition: background-color 0.3s ease-in; + margin-bottom: 0; +} +.onoffswitch-label:before { + content: ""; + display: block; width: 20px; margin: 0px; + background: #FFFFFF; + position: absolute; top: 0; bottom: 0; + right: 24px; + border: 2px solid #FFFFFF; border-radius: 20px; + transition: all 0.3s ease-in 0s; +} +.onoffswitch-checkbox:checked + .onoffswitch-label { + background-color: #FF00B9; +} +.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before { + border-color: #FF00B9; +} +.onoffswitch-checkbox:checked + .onoffswitch-label:before { + right: 0px; +} diff --git a/index.html b/index.html new file mode 100644 index 0000000..86939e6 --- /dev/null +++ b/index.html @@ -0,0 +1,172 @@ + + + +
+ +