Netsyms
/
Material-Color
2
0
Fork 0
Code Issues Pull Requests Releases 3 Wiki Activity

Improve coverage

Browse Source
bootstrap-4
Skylar Ittner 6 years ago
parent 02bba5be19
commit 65b8d67832
3 changed files with 356 additions and 75 deletions
Show Stats Download Patch File Download Diff File

144
generate.php
Unescape Escape View File

@ -1,50 +1,60 @@
<?php <?php
$use_variables = false; $use_variables = false;
$classes = ["alert", "badge", "btn", "bg", "list-group-item"]; $classes = [
"alert" => ["background-color" => "m", "color" => "t!"],
"alert .alert-link" => ["color" => "t!"],
"alert .alert-heading" => ["color" => "t!"],
"badge" => ["background-color" => "m", "color" => "t"],
"btn" => ["background-color" => "m", "color" => "t"],
"bg" => ["background-color" => "m"],
"list-group-item" => ["background-color" => "m", "color" => "t"],
"border" => ["border-color" => "m", "border-width" => "1px"],
"text" => ["color" => "m"]
];
$colors = [ $colors = [
"red" => "#f44336", "red" => "#f44336",
"pink" => "#e91e63", "pink" => "#e91e63",
"purple" => "#9c27b0", "purple" => "#9c27b0",
"deep-purple" => "#673ab7", "deep-purple" => "#673ab7",
"indigo" => "#3f51b5", "indigo" => "#3f51b5",
"blue" => "#2196f3", "blue" => "#2196f3",
"light-blue" => "#03a9f4", "light-blue" => "#03a9f4",
"cyan" => "#00bcd4", "cyan" => "#00bcd4",
"teal" => "#009688", "teal" => "#009688",
"green" => "#4caf50", "green" => "#4caf50",
"light-green" => "#8bc34a", "light-green" => "#8bc34a",
"lime" => "#cddc39", "lime" => "#cddc39",
"yellow" => "#ffeb3b", "yellow" => "#ffeb3b",
"amber" => "#ffc107", "amber" => "#ffc107",
"orange" => "#ff9800", "orange" => "#ff9800",
"deep-orange" => "#ff5722", "deep-orange" => "#ff5722",
"brown" => "#795548", "brown" => "#795548",
"grey" => "#9e9e9e", "grey" => "#9e9e9e",
"blue-grey" => "#607d8b" "blue-grey" => "#607d8b"
]; ];
$texts = [ $texts = [
"red" => "white", "red" => "white",
"pink" => "white", "pink" => "white",
"purple" => "white", "purple" => "white",
"deep-purple" => "white", "deep-purple" => "white",
"indigo" => "white", "indigo" => "white",
"blue" => "white", "blue" => "white",
"light-blue" => "black", "light-blue" => "black",
"cyan" => "black", "cyan" => "black",
"teal" => "white", "teal" => "white",
"green" => "white", "green" => "white",
"light-green" => "black", "light-green" => "black",
"lime" => "black", "lime" => "black",
"yellow" => "black", "yellow" => "black",
"amber" => "black", "amber" => "black",
"orange" => "black", "orange" => "black",
"deep-orange" => "white", "deep-orange" => "white",
"brown" => "white", "brown" => "white",
"grey" => "black", "grey" => "black",
"blue-grey" => "white" "blue-grey" => "white"
]; ];
@ -72,30 +82,54 @@ if ($use_variables) {
} }
/* The fun bit */ /* The fun bit */
foreach ($classes as $c) { foreach ($classes as $c => $props) {
foreach ($colors as $k => $v) { foreach ($colors as $k => $v) {
$textcolor = $texts[$k]; $t = $texts[$k];
// Save a few bytes // Save a few bytes
if ($textcolor == "white") { if ($t == "white") {
$textcolor = "#fff"; $t = "#fff";
} else if ($textcolor == "black") { } else if ($t == "black") {
$textcolor = "#000"; $t = "#000";
} }
// Class and background color // Color setup
echo ".$c-$k {\n\tbackground-color: ";
if ($use_variables) { if ($use_variables) {
echo "var(--material-color-$k)"; $m = "var(--material-color-$k)";
} else { } else {
echo $v; $m = $v;
} }
echo ";\n";
// Text color // Class
if ($c != "bg") { if (strpos($c, " ") !== FALSE) {
echo "\tcolor: $textcolor;\n"; $classes = explode(" ", $c);
foreach ($classes as $cl) {
if (strpos($cl, ".") === 0) {
echo "$cl ";
} else {
echo ".$cl-$k ";
}
}
echo "{\n";
} else {
echo ".$c-$k {\n";
} }
foreach ($props as $prop => $val) {
echo "\t$prop: ";
if (strpos($val, "m") === 0) {
echo $m;
} else if (strpos($val, "t") === 0) {
echo $t;
} else {
echo $val;
}
if (strpos($val, "!") === 1) {
echo " !important";
}
echo ";\n";
}
// Finish it off
echo "}\n"; echo "}\n";
} }
} }

285
material-color.css
Unescape Escape View File

@ -5,79 +5,193 @@
*/ */
.alert-red { .alert-red {
background-color: #f44336; background-color: #f44336;
color: #fff; color: #fff !important;
} }
.alert-pink { .alert-pink {
background-color: #e91e63; background-color: #e91e63;
color: #fff; color: #fff !important;
} }
.alert-purple { .alert-purple {
background-color: #9c27b0; background-color: #9c27b0;
color: #fff; color: #fff !important;
} }
.alert-deep-purple { .alert-deep-purple {
background-color: #673ab7; background-color: #673ab7;
color: #fff; color: #fff !important;
} }
.alert-indigo { .alert-indigo {
background-color: #3f51b5; background-color: #3f51b5;
color: #fff; color: #fff !important;
} }
.alert-blue { .alert-blue {
background-color: #2196f3; background-color: #2196f3;
color: #fff; color: #fff !important;
} }
.alert-light-blue { .alert-light-blue {
background-color: #03a9f4; background-color: #03a9f4;
color: #000; color: #000 !important;
} }
.alert-cyan { .alert-cyan {
background-color: #00bcd4; background-color: #00bcd4;
color: #000; color: #000 !important;
} }
.alert-teal { .alert-teal {
background-color: #009688; background-color: #009688;
color: #fff; color: #fff !important;
} }
.alert-green { .alert-green {
background-color: #4caf50; background-color: #4caf50;
color: #fff; color: #fff !important;
} }
.alert-light-green { .alert-light-green {
background-color: #8bc34a; background-color: #8bc34a;
color: #000; color: #000 !important;
} }
.alert-lime { .alert-lime {
background-color: #cddc39; background-color: #cddc39;
color: #000; color: #000 !important;
} }
.alert-yellow { .alert-yellow {
background-color: #ffeb3b; background-color: #ffeb3b;
color: #000; color: #000 !important;
} }
.alert-amber { .alert-amber {
background-color: #ffc107; background-color: #ffc107;
color: #000; color: #000 !important;
} }
.alert-orange { .alert-orange {
background-color: #ff9800; background-color: #ff9800;
color: #000; color: #000 !important;
} }
.alert-deep-orange { .alert-deep-orange {
background-color: #ff5722; background-color: #ff5722;
color: #fff; color: #fff !important;
} }
.alert-brown { .alert-brown {
background-color: #795548; background-color: #795548;
color: #fff; color: #fff !important;
} }
.alert-grey { .alert-grey {
background-color: #9e9e9e; background-color: #9e9e9e;
color: #000; color: #000 !important;
} }
.alert-blue-grey { .alert-blue-grey {
background-color: #607d8b; background-color: #607d8b;
color: #fff; color: #fff !important;
}
.alert-red .alert-link {
color: #fff !important;
}
.alert-pink .alert-link {
color: #fff !important;
}
.alert-purple .alert-link {
color: #fff !important;
}
.alert-deep-purple .alert-link {
color: #fff !important;
}
.alert-indigo .alert-link {
color: #fff !important;
}
.alert-blue .alert-link {
color: #fff !important;
}
.alert-light-blue .alert-link {
color: #000 !important;
}
.alert-cyan .alert-link {
color: #000 !important;
}
.alert-teal .alert-link {
color: #fff !important;
}
.alert-green .alert-link {
color: #fff !important;
}
.alert-light-green .alert-link {
color: #000 !important;
}
.alert-lime .alert-link {
color: #000 !important;
}
.alert-yellow .alert-link {
color: #000 !important;
}
.alert-amber .alert-link {
color: #000 !important;
}
.alert-orange .alert-link {
color: #000 !important;
}
.alert-deep-orange .alert-link {
color: #fff !important;
}
.alert-brown .alert-link {
color: #fff !important;
}
.alert-grey .alert-link {
color: #000 !important;
}
.alert-blue-grey .alert-link {
color: #fff !important;
}
.alert-red .alert-heading {
color: #fff !important;
}
.alert-pink .alert-heading {
color: #fff !important;
}
.alert-purple .alert-heading {
color: #fff !important;
}
.alert-deep-purple .alert-heading {
color: #fff !important;
}
.alert-indigo .alert-heading {
color: #fff !important;
}
.alert-blue .alert-heading {
color: #fff !important;
}
.alert-light-blue .alert-heading {
color: #000 !important;
}
.alert-cyan .alert-heading {
color: #000 !important;
}
.alert-teal .alert-heading {
color: #fff !important;
}
.alert-green .alert-heading {
color: #fff !important;
}
.alert-light-green .alert-heading {
color: #000 !important;
}
.alert-lime .alert-heading {
color: #000 !important;
}
.alert-yellow .alert-heading {
color: #000 !important;
}
.alert-amber .alert-heading {
color: #000 !important;
}
.alert-orange .alert-heading {
color: #000 !important;
}
.alert-deep-orange .alert-heading {
color: #fff !important;
}
.alert-brown .alert-heading {
color: #fff !important;
}
.alert-grey .alert-heading {
color: #000 !important;
}
.alert-blue-grey .alert-heading {
color: #fff !important;
} }
.badge-red { .badge-red {
background-color: #f44336; background-color: #f44336;
@ -364,3 +478,136 @@
background-color: #607d8b; background-color: #607d8b;
color: #fff; color: #fff;
} }
.border-red {
border-color: #f44336;
border-width: 1px;
}
.border-pink {
border-color: #e91e63;
border-width: 1px;
}
.border-purple {
border-color: #9c27b0;
border-width: 1px;
}
.border-deep-purple {
border-color: #673ab7;
border-width: 1px;
}
.border-indigo {
border-color: #3f51b5;
border-width: 1px;
}
.border-blue {
border-color: #2196f3;
border-width: 1px;
}
.border-light-blue {
border-color: #03a9f4;
border-width: 1px;
}
.border-cyan {
border-color: #00bcd4;
border-width: 1px;
}
.border-teal {
border-color: #009688;
border-width: 1px;
}
.border-green {
border-color: #4caf50;
border-width: 1px;
}
.border-light-green {
border-color: #8bc34a;
border-width: 1px;
}
.border-lime {
border-color: #cddc39;
border-width: 1px;
}
.border-yellow {
border-color: #ffeb3b;
border-width: 1px;
}
.border-amber {
border-color: #ffc107;
border-width: 1px;
}
.border-orange {
border-color: #ff9800;
border-width: 1px;
}
.border-deep-orange {
border-color: #ff5722;
border-width: 1px;
}
.border-brown {
border-color: #795548;
border-width: 1px;
}
.border-grey {
border-color: #9e9e9e;
border-width: 1px;
}
.border-blue-grey {
border-color: #607d8b;
border-width: 1px;
}
.text-red {
color: #f44336;
}
.text-pink {
color: #e91e63;
}
.text-purple {
color: #9c27b0;
}
.text-deep-purple {
color: #673ab7;
}
.text-indigo {
color: #3f51b5;
}
.text-blue {
color: #2196f3;
}
.text-light-blue {
color: #03a9f4;
}
.text-cyan {
color: #00bcd4;
}
.text-teal {
color: #009688;
}
.text-green {
color: #4caf50;
}
.text-light-green {
color: #8bc34a;
}
.text-lime {
color: #cddc39;
}
.text-yellow {
color: #ffeb3b;
}
.text-amber {
color: #ffc107;
}
.text-orange {
color: #ff9800;
}
.text-deep-orange {
color: #ff5722;
}
.text-brown {
color: #795548;
}
.text-grey {
color: #9e9e9e;
}
.text-blue-grey {
color: #607d8b;
}

2
material-color.min.css vendored
View File

File diff suppressed because one or more lines are too long
Write Preview
Loading…
Cancel
Save