sanger/limber

View on GitHub
app/frontend/stylesheets/limber_print/print-colours.scss

Summary

Maintainability
Test Coverage
/*
 * Rather helpfully browsers decide to save the user ink and not print background
 * colours. While this is possible to override at the browser level, it is non-obvious
 * and I couldn't even find the option in my version of Firefox. Fortunately the
 * browsers do render drop-shadows. (Well IE doesn't, but we don't care.)
 */

@mixin shade-aliquot($base_colour) {
  background-color: $base_colour;
  box-shadow: inset 0 0 0 5mm $base_colour;
}

/*
 * Pinched from the crayola wiki page: http://en.wikipedia.org/wiki/List_of_Crayola_crayon_colors
 * Honestly, couldn't come up with a better set of colours and ones with greater names.  All credit
 * to them!
 */
.colour-1 {
  @include shade-aliquot(#ea7e5d);
}
.colour-2 {
  @include shade-aliquot(#78dbe2);
}
.colour-3 {
  @include shade-aliquot(#fdd9b5);
}
.colour-4 {
  @include shade-aliquot(#cd9575);
}
.colour-5 {
  @include shade-aliquot(#87a96b);
}
.colour-6 {
  @include shade-aliquot(#ffa474);
}
.colour-7 {
  @include shade-aliquot(#fae7b5);
}
.colour-8 {
  @include shade-aliquot(#9f8170);
}
.colour-9 {
  @include shade-aliquot(#fd7c6e);
}
.colour-10 {
  @include shade-aliquot(#ababab);
}
.colour-11 {
  @include shade-aliquot(#ace5ee);
}
.colour-12 {
  @include shade-aliquot(#1f75fe);
}
.colour-13 {
  @include shade-aliquot(#a2a2d0);
}
.colour-14 {
  @include shade-aliquot(#6699cc);
}
.colour-15 {
  @include shade-aliquot(#0d98ba);
}
.colour-16 {
  @include shade-aliquot(#7366bd);
}
.colour-17 {
  @include shade-aliquot(#de5d83);
}
.colour-18 {
  @include shade-aliquot(#cb4154);
}
.colour-19 {
  @include shade-aliquot(#b4674d);
}
.colour-20 {
  @include shade-aliquot(#ff7f49);
}
.colour-21 {
  @include shade-aliquot(#efdecd);
}
.colour-22 {
  @include shade-aliquot(#b0b7c6);
}
.colour-23 {
  @include shade-aliquot(#ffff99);
}
.colour-24 {
  @include shade-aliquot(#1cd3a2);
}
.colour-25 {
  @include shade-aliquot(#ffaacc);
}
.colour-26 {
  @include shade-aliquot(#dd4492);
}
.colour-27 {
  @include shade-aliquot(#1dacd6);
}
.colour-28 {
  @include shade-aliquot(#bc5d58);
}
.colour-29 {
  @include shade-aliquot(#dd9475);
}
.colour-30 {
  @include shade-aliquot(#9aceeb);
}
.colour-31 {
  @include shade-aliquot(#ffbcd9);
}
.colour-32 {
  @include shade-aliquot(#fddb6d);
}
.colour-33 {
  @include shade-aliquot(#2b6cc4);
}
.colour-34 {
  @include shade-aliquot(#efcdb8);
}
.colour-35 {
  @include shade-aliquot(#6e5160);
}
.colour-36 {
  @include shade-aliquot(#ceff1d);
}
.colour-37 {
  @include shade-aliquot(#71bc78);
}
.colour-38 {
  @include shade-aliquot(#6dae81);
}
.colour-39 {
  @include shade-aliquot(#c364c5);
}
.colour-40 {
  @include shade-aliquot(#cc6666);
}
.colour-41 {
  @include shade-aliquot(#e7c697);
}
.colour-42 {
  @include shade-aliquot(#fcd975);
}
.colour-43 {
  @include shade-aliquot(#a8e4a0);
}
.colour-44 {
  @include shade-aliquot(#95918c);
}
.colour-45 {
  @include shade-aliquot(#1cac78);
}
.colour-46 {
  @include shade-aliquot(#1164b4);
}
.colour-47 {
  @include shade-aliquot(#f0e891);
}
.colour-48 {
  @include shade-aliquot(#ff1dce);
}
.colour-49 {
  @include shade-aliquot(#b2ec5d);
}
.colour-50 {
  @include shade-aliquot(#5d76cb);
}
.colour-51 {
  @include shade-aliquot(#ca3767);
}
.colour-52 {
  @include shade-aliquot(#3bb08f);
}
.colour-53 {
  @include shade-aliquot(#fefe22);
}
.colour-54 {
  @include shade-aliquot(#fcb4d5);
}
.colour-55 {
  @include shade-aliquot(#fff44f);
}
.colour-56 {
  @include shade-aliquot(#ffbd88);
}
.colour-57 {
  @include shade-aliquot(#f664af);
}
.colour-58 {
  @include shade-aliquot(#aaf0d1);
}
.colour-59 {
  @include shade-aliquot(#cd4a4c);
}
.colour-60 {
  @include shade-aliquot(#edd19c);
}
.colour-61 {
  @include shade-aliquot(#979aaa);
}
.colour-62 {
  @include shade-aliquot(#ff8243);
}
.colour-63 {
  @include shade-aliquot(#c8385a);
}
.colour-64 {
  @include shade-aliquot(#ef98aa);
}
.colour-65 {
  @include shade-aliquot(#fdbcb4);
}
.colour-66 {
  @include shade-aliquot(#1a4876);
}
.colour-67 {
  @include shade-aliquot(#30ba8f);
}
.colour-68 {
  @include shade-aliquot(#c54b8c);
}
.colour-69 {
  @include shade-aliquot(#1974d2);
}
.colour-70 {
  @include shade-aliquot(#ffa343);
}
.colour-71 {
  @include shade-aliquot(#bab86c);
}
.colour-72 {
  @include shade-aliquot(#ff7538);
}
.colour-73 {
  @include shade-aliquot(#ff2b2b);
}
.colour-74 {
  @include shade-aliquot(#f8d568);
}
.colour-75 {
  @include shade-aliquot(#e6a8d7);
}
.colour-76 {
  @include shade-aliquot(#414a4c);
}
.colour-77 {
  @include shade-aliquot(#ff6e4a);
}
.colour-78 {
  @include shade-aliquot(#1ca9c9);
}
.colour-79 {
  @include shade-aliquot(#ffcfab);
}
.colour-80 {
  @include shade-aliquot(#c5d0e6);
}
.colour-81 {
  @include shade-aliquot(#fddde6);
}
.colour-82 {
  @include shade-aliquot(#158078);
}
.colour-83 {
  @include shade-aliquot(#fc74fd);
}
.colour-84 {
  @include shade-aliquot(#f78fa7);
}
.colour-85 {
  @include shade-aliquot(#8e4585);
}
.colour-86 {
  @include shade-aliquot(#7442c8);
}
.colour-87 {
  @include shade-aliquot(#9d81ba);
}
.colour-88 {
  @include shade-aliquot(#fe4eda);
}
.colour-89 {
  @include shade-aliquot(#ff496c);
}
.colour-90 {
  @include shade-aliquot(#d68a59);
}
.colour-91 {
  @include shade-aliquot(#714b23);
}
.colour-92 {
  @include shade-aliquot(#ff48d0);
}
.colour-93 {
  @include shade-aliquot(#e3256b);
}
.colour-94 {
  @include shade-aliquot(#ee204d);
}
.colour-95 {
  @include shade-aliquot(#ff5349);
}
.colour-96 {
  @include shade-aliquot(#c0448f);
}
.colour-97 {
  @include shade-aliquot(#1fcecb);
}
.colour-98 {
  @include shade-aliquot(#7851a9);
}
.colour-99 {
  @include shade-aliquot(#ff9baa);
}
.colour-100 {
  @include shade-aliquot(#fc2847);
}
.colour-101 {
  @include shade-aliquot(#76ff7a);
}
.colour-102 {
  @include shade-aliquot(#9fe2bf);
}
.colour-103 {
  @include shade-aliquot(#a5694f);
}
.colour-104 {
  @include shade-aliquot(#8a795d);
}
.colour-105 {
  @include shade-aliquot(#45cea2);
}
.colour-106 {
  @include shade-aliquot(#fb7efd);
}
.colour-107 {
  @include shade-aliquot(#cdc5c2);
}
.colour-108 {
  @include shade-aliquot(#80daeb);
}
.colour-109 {
  @include shade-aliquot(#eceabe);
}
.colour-110 {
  @include shade-aliquot(#ffcf48);
}
.colour-111 {
  @include shade-aliquot(#fd5e53);
}
.colour-112 {
  @include shade-aliquot(#faa76c);
}
.colour-113 {
  @include shade-aliquot(#18a7b5);
}
.colour-114 {
  @include shade-aliquot(#ebc7df);
}
.colour-115 {
  @include shade-aliquot(#fc89ac);
}
.colour-116 {
  @include shade-aliquot(#dbd7d2);
}
.colour-117 {
  @include shade-aliquot(#17806d);
}
.colour-118 {
  @include shade-aliquot(#deaa88);
}
.colour-119 {
  @include shade-aliquot(#77dde7);
}
.colour-120 {
  @include shade-aliquot(#ffff66);
}
.colour-121 {
  @include shade-aliquot(#926eae);
}
.colour-122 {
  @include shade-aliquot(#324ab2);
}
.colour-123 {
  @include shade-aliquot(#f75394);
}
.colour-124 {
  @include shade-aliquot(#ffa089);
}
.colour-125 {
  @include shade-aliquot(#8f509d);
}
.colour-126 {
  @include shade-aliquot(#ffffff);
}
.colour-127 {
  @include shade-aliquot(#a2add0);
}
.colour-128 {
  @include shade-aliquot(#ff43a4);
}
.colour-129 {
  @include shade-aliquot(#fc6c85);
}
.colour-130 {
  @include shade-aliquot(#cda4de);
}
.colour-131 {
  @include shade-aliquot(#fce883);
}
.colour-132 {
  @include shade-aliquot(#c5e384);
}
.colour-133 {
  @include shade-aliquot(#ffae42);
}