Melvin Valster
1 line
12 KiB
Plaintext
1 line
12 KiB
Plaintext
{"version":3,"sources":["/Users/melvinvalster/Projects/talent-calculator/src/App.scss","/Users/melvinvalster/Projects/talent-calculator/src/components/TalentSlot.scss","/Users/melvinvalster/Projects/talent-calculator/src/sass/_config.scss","/Users/melvinvalster/Projects/talent-calculator/src/components/Icon.scss","/Users/melvinvalster/Projects/talent-calculator/src/components/Arrow.scss"],"names":[],"mappings":"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","file":"main.c877d756.chunk.css","sourcesContent":["@import \"sass/config\";\n\nbody {\n background-color: #111;\n font-family: Verdana;\n}\n\n.calculator {\n &__points {\n color: white;\n text-align: center;\n }\n}\n\n.trees {\n display: flex;\n justify-content: center;\n}\n\n.tree {\n position: relative;\n min-width: 300px; \n color: white;\n margin-right: 1em;\n background-color: #111;\n\n &:last-child {\n margin-right: 0;\n }\n\n &__header {\n text-align: center;\n\n h3 {\n margin-top: .75em;\n margin-bottom: .75em;\n }\n }\n\n &__body {\n position: relative;\n height: 520px;\n border: 1px solid black;\n background-size: cover;\n background-position: center;\n }\n}\n\n.class-picker {\n display: flex;\n justify-content: center;\n list-style: none;\n margin-top: 2em;\n margin-bottom: 2em;\n\n &__class {\n margin-right: 1em;\n opacity: 1;\n transition: all .1s ease-out;\n\n &:hover {\n opacity: 1;\n }\n\n &--active {\n opacity: 1;\n }\n\n &--inactive {\n opacity: .4;\n\n &:hover {\n opacity: .5;\n }\n }\n }\n}","@import \"../sass/config\";\n\n.talent {\n position: absolute;\n width: 40px;\n height: 40px;\n border-radius: 5px;\n transition: filter .1s linear;\n filter: none;\n cursor: pointer;\n\n &--available {\n .talent__status::after {\n // background-color: rgba($color-green, .8);\n box-shadow: inset 0px 0px 6px 3px rgba($color-green, .8);\n }\n\n .point-label {\n color: $color-green;\n }\n }\n\n &--maxed {\n .talent__status::after {\n box-shadow: inset 0px 0px 6px 3px rgba($color-yellow, .8);\n }\n\n .point-label {\n color: $color-yellow;\n }\n }\n\n &--disabled {\n filter: grayscale(100%);\n\n .talent__status { \n opacity: .7;\n }\n }\n\n // Rows\n @for $i from 0 through 6 {\n &[data-row=\"#{$i}\"] {\n top: $row-offset + (($i) * $row-distance);\n }\n }\n\n // Columns\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: $col-offset + ($col-distance * $i); \n }\n }\n\n &__status {\n position: absolute;\n width: 48px;\n height: 46px;\n bottom: -1px;\n left: -4px;\n background-image: url('../images/icons/large/default.png');\n background-size: cover;\n\n &:after {\n content: '';\n position: absolute;\n width: 44px;\n height: 44px;\n top: 2px;\n left: 2px;\n border-radius: 5px;\n }\n }\n}\n\n.point-label {\n position: absolute;\n bottom: -5px;\n right: -5px;\n min-width: 7px;\n text-align: center;\n padding: 1px 3px;\n color: #999;\n font-size: 11px;\n font-family: Arial, Helvetica, sans-serif;\n background: #111;\n border-radius: 4px;\n user-select: none;\n\n &--enabled {\n color: white;\n }\n}","$icon-size: 40px;\n\n$row-offset: 30px;\n$row-distance: $icon-size + $row-offset;\n\n$col-offset: 44px;\n$col-gutter: 16px;\n$col-distance: $icon-size + $col-gutter;\n\n$color-yellow: #ffd100;\n$color-green: #1eff00;\n$color-dark-green: #40bf40;\n$color-subtle: #9d9d9d;\n$color-icon-overlay: #6396d6;","@import \"../sass/_config\";\n\n.icon {\n position: relative;\n background-position: center;\n background-repeat: no-repeat;\n background-size: contain;\n background-color: #222;\n \n &:hover {\n .icon__bg {\n box-shadow: inset 0px 0px 6px 3px rgba($color-icon-overlay, .8);\n }\n }\n\n &:active {\n .icon__bg {\n box-shadow: inset 0px 0px 6px 3px rgba(lighten($color-icon-overlay, 20%), .8);\n }\n }\n\n &--medium {\n width: 40px;\n height: 40px;\n border-radius: 5px;\n\n .icon__bg {\n width: 36px;\n height: 36px;\n top: 2px;\n left: 2px;\n }\n }\n\n &--golden {\n .icon__frame {\n background-image: url('../images/icons/large/gold.png');\n }\n }\n\n &--loading {\n .icon__bg {\n opacity: 0;\n }\n }\n\n &__bg {\n position: absolute;\n background-size: cover;\n border-radius: 5px;\n opacity: 1;\n transition: all 100ms ease-out;\n }\n\n &__frame {\n position: absolute;\n width: 44px;\n height: 44px;\n top: -2px;\n left: -2px;\n background-image: url('../images/icons/large/default.png');\n background-repeat: no-repeat;\n background-size: contain;\n }\n}","@import \"../sass/config\";\n\n@function baseRowTopOffset($row) {\n @return $row-offset + ($row * $row-distance);\n}\n\n@function calcLeftOffset($col) {\n @return $col-offset + ($col-gutter * ($col - 1)) + $icon-size;\n}\n\n@function calcRightOffset($col) {\n @return $col-offset + ($col-distance * $col) + $icon-size;\n}\n\n@function calcArrowHeight($length) {\n @return 2px + ($row-offset * $length) + ($icon-size * ($length - 1));\n}\n\n@mixin arrow-left {\n background-image: url('../images/arrows/left.png');\n background-position: center left;\n\n &.arrow--active {\n background-image: url('../images/arrows/left-active.png');\n }\n\n // Cols\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: -3px + calcLeftOffset($i);\n }\n }\n}\n\n@mixin arrow-right {\n background-image: url('../images/arrows/right.png');\n background-position: center right;\n\n &.arrow--active {\n background-image: url('../images/arrows/right-active.png');\n }\n\n // Cols\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: 3px + calcRightOffset($i);\n }\n }\n}\n\n.arrow {\n $arrow-width: 15px;\n position: absolute;\n\n &--right,\n &--left {\n height: $arrow-width;\n\n // Rows\n @for $i from 0 through 6 {\n &[data-row=\"#{$i}\"] {\n top: 12px + baseRowTopOffset($i);\n }\n }\n\n // Lengths\n @for $i from 0 through 3 {\n &[data-length=\"#{$i}\"] { \n width: 1px + ($col-gutter * $i) + ($icon-size * ($i - 1));\n }\n }\n }\n\n &--right {\n @include arrow-right()\n }\n\n &--left {\n @include arrow-left()\n }\n\n &--down {\n width: $arrow-width;\n background-image: url('../images/arrows/down.png');\n background-position: center bottom;\n\n &.arrow--active {\n background-image: url('../images/arrows/down-active.png');\n }\n\n // Rows\n @for $i from 0 through 6 {\n &[data-row=\"#{$i}\"] {\n top: $icon-size + baseRowTopOffset($i);\n }\n }\n\n // Cols\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: 5px + $col-offset + ($col-distance * $i) + floor($arrow-width / 2); \n }\n }\n\n // Lengths\n @for $i from 0 through 3 {\n &[data-length=\"#{$i}\"] { \n height: calcArrowHeight($i);\n }\n }\n }\n\n &--side-down {\n // Position based on row\n @for $i from 0 through 6 {\n &[data-row=\"#{$i}\"] {\n top: 12px + baseRowTopOffset($i);\n\n &:after {\n top: $arrow-width;\n }\n }\n }\n\n // Width\n @for $i from 0 through 3 {\n &[data-width=\"#{$i}\"] {\n width: 2px + ($icon-size * $i);\n }\n }\n\n // Height\n @for $i from 0 through 3 {\n &[data-height=\"#{$i}\"] {\n height: 8px + ($row-offset + ($icon-size * .5)) * $i;\n }\n }\n\n // Horizontal\n &:before {\n content: \"\";\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: $arrow-width;\n }\n\n // Arrow down\n &:after {\n content: \"\";\n position: absolute;\n width: $arrow-width;\n top: $arrow-width;\n right: 0;\n bottom: -3px;\n background-image: url('../images/arrows/down.png');\n background-position: center bottom;\n }\n }\n\n &--right-down {\n // Positioning based on cols\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: 2px + calcRightOffset($i);\n }\n }\n\n &.arrow--active {\n &:before { background-image: url('../images/arrows/rightdown-active.png'); }\n &:after { background-image: url('../images/arrows/down-active.png'); }\n }\n \n // Arrow to the right\n &:before {\n background-image: url('../images/arrows/rightdown.png');\n background-position: center right;\n }\n\n // Arrow down\n &:after {\n right: 0;\n }\n }\n\n &--left-down {\n // Positioning based on cols\n @for $i from 0 through 3 {\n &[data-col=\"#{$i}\"] { \n left: -2px + calcLeftOffset($i);\n }\n }\n\n &.arrow--active {\n &:before { background-image: url('../images/arrows/leftdown-active.png'); }\n &:after { background-image: url('../images/arrows/down-active.png'); }\n }\n \n // Arrow to the left\n &:before {\n background-image: url('../images/arrows/leftdown.png');\n background-position: center left;\n }\n\n // Arrow down\n &:after {\n left: 0;\n }\n }\n}"]} |