Skip to content

Commit

Permalink
Upgrade Material Design Icons (CFM-171)
Browse files Browse the repository at this point in the history
  • Loading branch information
arlen committed May 12, 2022
1 parent 68b0e7c commit d779ed4
Show file tree
Hide file tree
Showing 30 changed files with 308 additions and 2,391 deletions.
Binary file not shown.

This file was deleted.

2,373 changes: 0 additions & 2,373 deletions app/webroot/css/fonts/material-icons/MaterialIcons-Regular.svg

This file was deleted.

Binary file not shown.
Binary file not shown.
Binary file not shown.
55 changes: 55 additions & 0 deletions app/webroot/css/fonts/material-icons/_mixins.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
// @see https://github.com/twbs/bootstrap/blob/main/scss/_functions.scss
@function material-icons-str-replace($string, $search, $replace: '') {
$index: str-index($string, $search);
@if $index {
@return str-slice($string, 1, $index - 1) + $replace +
material-icons-str-replace(
str-slice($string, $index + str-length($search)),
$search,
$replace
);
}
@return $string;
}

@mixin material-icons-font-class($font-family) {
font-family: $font-family;
font-weight: normal;
font-style: normal;
font-size: $material-icons-font-size;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased; // Support for all WebKit browsers
-moz-osx-font-smoothing: grayscale; // Support for Firefox
text-rendering: optimizeLegibility; // Support for Safari and Chrome
font-feature-settings: 'liga'; // Support for IE
}

@mixin material-icons-font($font-family) {
$class-name: to-lower-case($font-family);
$class-name: material-icons-str-replace($class-name, ' ', '-');
$font-file: $material-icons-font-path + $class-name;

@font-face {
font-family: $font-family;
font-style: normal;
font-weight: 400;
font-display: $material-icons-font-display;
src: url('#{$font-file}.woff2') format('woff2'),
url('#{$font-file}.woff') format('woff');
}

.#{$class-name} {
@include material-icons-font-class($font-family);
}
}

@mixin material-icons() {
@warn "material-icons() Sass mixin has been deprecated as of 1.0. Use '@extend .material-icons;' instead of '@include material-icons();'.";
@include material-icons-font-class('Material Icons');
}
3 changes: 3 additions & 0 deletions app/webroot/css/fonts/material-icons/_variables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
$material-icons-font-path: './' !default;
$material-icons-font-size: 24px !default;
$material-icons-font-display: block !default;
24 changes: 24 additions & 0 deletions app/webroot/css/fonts/material-icons/filled.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@font-face {
font-family: "Material Icons";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons.woff2") format("woff2"), url("./material-icons.woff") format("woff");
}
.material-icons {
font-family: "Material Icons";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
4 changes: 4 additions & 0 deletions app/webroot/css/fonts/material-icons/filled.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
@import 'variables';
@import 'mixins';

@include material-icons-font('Material Icons');
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
122 changes: 105 additions & 17 deletions app/webroot/css/fonts/material-icons/material-icons.css
Original file line number Diff line number Diff line change
@@ -1,36 +1,124 @@
@font-face {
font-family: 'Material Icons';
font-family: "Material Icons";
font-style: normal;
font-weight: 400;
src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
src: local('Material Icons'),
local('MaterialIcons-Regular'),
url(MaterialIcons-Regular.woff2) format('woff2'),
url(MaterialIcons-Regular.woff) format('woff'),
url(MaterialIcons-Regular.ttf) format('truetype');
font-display: block;
src: url("./material-icons.woff2") format("woff2"), url("./material-icons.woff") format("woff");
}

.material-icons {
font-family: 'Material Icons';
font-family: "Material Icons";
font-weight: normal;
font-style: normal;
font-size: 24px; /* Preferred icon size */
display: inline-block;
font-size: 24px;
line-height: 1;
text-transform: none;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}

@font-face {
font-family: "Material Icons Outlined";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-outlined.woff2") format("woff2"), url("./material-icons-outlined.woff") format("woff");
}
.material-icons-outlined {
font-family: "Material Icons Outlined";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}

/* Support for all WebKit browsers. */
@font-face {
font-family: "Material Icons Round";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-round.woff2") format("woff2"), url("./material-icons-round.woff") format("woff");
}
.material-icons-round {
font-family: "Material Icons Round";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
/* Support for Safari and Chrome. */
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}

/* Support for Firefox. */
@font-face {
font-family: "Material Icons Sharp";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-sharp.woff2") format("woff2"), url("./material-icons-sharp.woff") format("woff");
}
.material-icons-sharp {
font-family: "Material Icons Sharp";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}

/* Support for IE. */
font-feature-settings: 'liga';
@font-face {
font-family: "Material Icons Two Tone";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-two-tone.woff2") format("woff2"), url("./material-icons-two-tone.woff") format("woff");
}
.material-icons-two-tone {
font-family: "Material Icons Two Tone";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
5 changes: 5 additions & 0 deletions app/webroot/css/fonts/material-icons/material-icons.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
@import 'filled';
@import 'outlined';
@import 'round';
@import 'sharp';
@import 'two-tone';
Binary file not shown.
Binary file not shown.
24 changes: 24 additions & 0 deletions app/webroot/css/fonts/material-icons/outlined.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@font-face {
font-family: "Material Icons Outlined";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-outlined.woff2") format("woff2"), url("./material-icons-outlined.woff") format("woff");
}
.material-icons-outlined {
font-family: "Material Icons Outlined";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
4 changes: 4 additions & 0 deletions app/webroot/css/fonts/material-icons/outlined.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
@import 'variables';
@import 'mixins';

@include material-icons-font('Material Icons Outlined');
24 changes: 24 additions & 0 deletions app/webroot/css/fonts/material-icons/round.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@font-face {
font-family: "Material Icons Round";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-round.woff2") format("woff2"), url("./material-icons-round.woff") format("woff");
}
.material-icons-round {
font-family: "Material Icons Round";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
4 changes: 4 additions & 0 deletions app/webroot/css/fonts/material-icons/round.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
@import 'variables';
@import 'mixins';

@include material-icons-font('Material Icons Round');
24 changes: 24 additions & 0 deletions app/webroot/css/fonts/material-icons/sharp.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@font-face {
font-family: "Material Icons Sharp";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-sharp.woff2") format("woff2"), url("./material-icons-sharp.woff") format("woff");
}
.material-icons-sharp {
font-family: "Material Icons Sharp";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
4 changes: 4 additions & 0 deletions app/webroot/css/fonts/material-icons/sharp.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
@import 'variables';
@import 'mixins';

@include material-icons-font('Material Icons Sharp');
24 changes: 24 additions & 0 deletions app/webroot/css/fonts/material-icons/two-tone.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
@font-face {
font-family: "Material Icons Two Tone";
font-style: normal;
font-weight: 400;
font-display: block;
src: url("./material-icons-two-tone.woff2") format("woff2"), url("./material-icons-two-tone.woff") format("woff");
}
.material-icons-two-tone {
font-family: "Material Icons Two Tone";
font-weight: normal;
font-style: normal;
font-size: 24px;
line-height: 1;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
font-feature-settings: "liga";
}
4 changes: 4 additions & 0 deletions app/webroot/css/fonts/material-icons/two-tone.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
@import 'variables';
@import 'mixins';

@include material-icons-font('Material Icons Two Tone');

0 comments on commit d779ed4

Please sign in to comment.