57 lines
20 KiB
SCSS
57 lines
20 KiB
SCSS
|
/**
|
||
|
|
* Farbtastic Color Picker 1.2
|
||
|
|
* © 2008 Steven Wittens
|
||
|
|
*
|
||
|
|
* This program is free software; you can redistribute it and/or modify
|
||
|
|
* it under the terms of the GNU General Public License as published by
|
||
|
|
* the Free Software Foundation; either version 2 of the License, or
|
||
|
|
* (at your option) any later version.
|
||
|
|
*
|
||
|
|
* This program is distributed in the hope that it will be useful,
|
||
|
|
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
|
|
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
|
|
* GNU General Public License for more details.
|
||
|
|
*
|
||
|
|
* You should have received a copy of the GNU General Public License
|
||
|
|
* along with this program; if not, write to the Free Software
|
||
|
|
* Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
|
||
|
|
*/
|
||
|
|
// original size 195px
|
||
|
|
$farbtasticSize: 160;
|
||
|
|
$farbtasticFactor: $farbtasticSize / 195;
|
||
|
|
.farbtastic {
|
||
|
|
position: relative;
|
||
|
|
width: $farbtasticSize * 1px;
|
||
|
|
height: $farbtasticSize * 1px;
|
||
|
|
margin: 5px auto;
|
||
|
|
.color, .overlay {
|
||
|
|
top: ((47 * $farbtasticFactor) * 1px);
|
||
|
|
left: ((47 * $farbtasticFactor) * 1px);
|
||
|
|
width: ((101 * $farbtasticFactor) * 1px);
|
||
|
|
height: ((101 * $farbtasticFactor) * 1px);
|
||
|
|
}
|
||
|
|
.wheel {
|
||
|
|
background: url(data:image/png;base64,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
|
||
|
|
background-size: 100%;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
.overlay {
|
||
|
|
background: url(data:image/png;base64,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) no-repeat;
|
||
|
|
background-size: 100%;
|
||
|
|
}
|
||
|
|
.marker {
|
||
|
|
width: ((17 * $farbtasticFactor) * 1px);
|
||
|
|
height: ((17 * $farbtasticFactor) * 1px);
|
||
|
|
margin: ((8 * $farbtasticFactor) * -1px) 0 0 ((8 * $farbtasticFactor) * -1px);
|
||
|
|
overflow: hidden;
|
||
|
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAABvklEQVR42rWUv0sCYRjHO0zFOCoSSUFsq1AHoSkaisAGbXCRlsAtWiSD1v6AoMUtUAQnSRGkpNGoIWjMoU0qInSRTNGwunv6PvAeHKbm4guf4R64zz2/3puYGNchIgksggg4BodgE0yNKnCDC9ABClAF3+AZ7IHJYYIQqPJLrVaLSqUSpVIpymazVKlUSJwuyPTNSmRQVVWVCoUC+Xy+rizL9waDIWM2my/tdnstGo1SvV5n0Q846dcDLkHN5/Nks9leEQ6DGWAAZrAE4Xk4HKZ2u82iFljRS7iJnUajQR6P5xOhEJD6VDxvMpnu0uk0iT7F9RKeglIsFslisdwgJA/p/W4gEND686CX8BjVeDxOeEz8M0C3y+XSJB96yRFLkskkcSNFHwadVa/Xq0ne9JIt3oNyuUxWq/UJoYUBApafxmIxTXKll8hsVRSFIpEISZLEJc31EWw7HI53/phYxP3eMR+Ar1qtRsFgUDUajdcI74BlLoEzYEEul9Mmwya5V2ICBf5Cs9mkRCJBfr+fnE4ncQ+4BJEBC3jj1gat/Sw4E/dGpb+HS3gE66Ncwg3AG/UiVrwJbsVtnh7Lr+MXM921rfVCPpAAAAAASUVORK5CYII=) no-repeat;
|
||
|
|
background-size: 100%;
|
||
|
|
}
|
||
|
|
* {
|
||
|
|
position: absolute;
|
||
|
|
cursor: crosshair;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|