material-symbols-class 0.9.1 → 0.9.3

package/README.md

@@ -35,31 +35,44 @@ or import in HTML:
 ```
 
 To display an icon, use one of the following:
+The different font/styles can be used with the full name or the `short` version, be default `msc` will refer to `outlined`
 
 ```html
 <span class="msc msc-face"></span>
+<!-- Outlined default -->
+<span class="msc-o msc-face"></span>
+<!-- Outlined short class -->
+<span class="msc-outlined msc-face"></span>
 <!-- Outlined -->
+<span class="msc-r msc-face"></span>
+<!-- Rounded short class -->
 <span class="msc-rounded  msc-face"></span>
 <!-- Rounded -->
+<span class="msc-s msc-face"></span>
+<!-- Sharp short class -->
 <span class="msc-sharp  msc-face"></span>
 <!-- Sharp -->
 ```
 
-Adding the `utils.css` you can edit the `fill` and `weight` variables with classes too:
+Adding the `utils.css` you can edit the `fill`, `weight`, `spin` and `fix` variables with classes too:
 
 ```html
-<span class="msc msc-face msc-fill"></span>
+<span class="msc-outlined msc-face msc-fill"></span>
 <!-- 'FILL': 1 -->
-<span class="msc msc-face msc-100"></span>
+<span class="msc-outlined msc-face msc-100"></span>
 <!-- 'weight': 100 -->
-<span class="msc msc-face msc-fill msc-100"></span>
+<span class="msc-outlined msc-face msc-fill msc-100"></span>
 <!-- 'FILL': 1 && 'weight': 300 -->
+<span class="msc-outlined msc-face msc-spin"></span>
+<!-- Spinning icon -->
+<span class="msc-outlined msc-face msc-fix"></span>
+<!-- Fixed width icon -->
 ```
 
 To customize the variable font axes (fill, weight, grade, and optical size), use:
 
 ```css
-.msc {
+.msc-outlined {
   font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
 }
 ```

package/index.css

@@ -5,7 +5,9 @@
   font-display: block;
   src: url("./material-symbols-outlined.woff2") format("woff2");
 }
-.material-symbols-outlined, .msc {
+.material-symbols-outlined, .msc,
+.msc-o,
+.msc-outlined {
   font-family: "Material Symbols Outlined";
   font-weight: normal;
   font-style: normal;
@@ -23,7 +25,9 @@
   font-feature-settings: "liga";
 }
 
-.msc {
+.msc,
+.msc-o,
+.msc-outlined {
   font-size: 1.25em;
 }
 
@@ -34,7 +38,8 @@
   font-display: block;
   src: url("./material-symbols-rounded.woff2") format("woff2");
 }
-.material-symbols-rounded, .msc-rounded {
+.material-symbols-rounded, .msc-r,
+.msc-rounded {
   font-family: "Material Symbols Rounded";
   font-weight: normal;
   font-style: normal;
@@ -52,6 +57,7 @@
   font-feature-settings: "liga";
 }
 
+.msc-r,
 .msc-rounded {
   font-size: 1.25em;
 }
@@ -63,7 +69,8 @@
   font-display: block;
   src: url("./material-symbols-sharp.woff2") format("woff2");
 }
-.material-symbols-sharp, .msc-sharp {
+.material-symbols-sharp, .msc-s,
+.msc-sharp {
   font-family: "Material Symbols Sharp";
   font-weight: normal;
   font-style: normal;
@@ -81,6 +88,7 @@
   font-feature-settings: "liga";
 }
 
+.msc-s,
 .msc-sharp {
   font-size: 1.25em;
 }

package/index.min.css

@@ -1 +1 @@
-@font-face{font-family:"Material Symbols Outlined";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-outlined.woff2") format("woff2")}.material-symbols-outlined,.msc{font-family:"Material Symbols 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"}.msc{font-size:1.25em}@font-face{font-family:"Material Symbols Rounded";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-rounded.woff2") format("woff2")}.material-symbols-rounded,.msc-rounded{font-family:"Material Symbols Rounded";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"}.msc-rounded{font-size:1.25em}@font-face{font-family:"Material Symbols Sharp";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-sharp.woff2") format("woff2")}.material-symbols-sharp,.msc-sharp{font-family:"Material Symbols 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"}.msc-sharp{font-size:1.25em}
+@font-face{font-family:"Material Symbols Outlined";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-outlined.woff2") format("woff2")}.material-symbols-outlined,.msc,.msc-o,.msc-outlined{font-family:"Material Symbols 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"}.msc,.msc-o,.msc-outlined{font-size:1.25em}@font-face{font-family:"Material Symbols Rounded";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-rounded.woff2") format("woff2")}.material-symbols-rounded,.msc-r,.msc-rounded{font-family:"Material Symbols Rounded";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"}.msc-r,.msc-rounded{font-size:1.25em}@font-face{font-family:"Material Symbols Sharp";font-style:normal;font-weight:100 700;font-display:block;src:url("./material-symbols-sharp.woff2") format("woff2")}.material-symbols-sharp,.msc-s,.msc-sharp{font-family:"Material Symbols 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"}.msc-s,.msc-sharp{font-size:1.25em}

package/material-symbols.css

@@ -118,6 +118,10 @@
   content: "30fps_select";
 }
 
+.msc-3d:after {
+  content: "3d";
+}
+
 .msc-3d_rotation:after {
   content: "3d_rotation";
 }
@@ -830,18 +834,10 @@
   content: "app_blocking";
 }
 
-.msc-app_promo:after {
-  content: "app_promo";
-}
-
 .msc-app_registration:after {
   content: "app_registration";
 }
 
-.msc-app_shortcut:after {
-  content: "app_shortcut";
-}
-
 .msc-apparel:after {
   content: "apparel";
 }
@@ -1438,6 +1434,62 @@
   content: "battery_alert";
 }
 
+.msc-battery_android_0:after {
+  content: "battery_android_0";
+}
+
+.msc-battery_android_1:after {
+  content: "battery_android_1";
+}
+
+.msc-battery_android_2:after {
+  content: "battery_android_2";
+}
+
+.msc-battery_android_3:after {
+  content: "battery_android_3";
+}
+
+.msc-battery_android_4:after {
+  content: "battery_android_4";
+}
+
+.msc-battery_android_5:after {
+  content: "battery_android_5";
+}
+
+.msc-battery_android_6:after {
+  content: "battery_android_6";
+}
+
+.msc-battery_android_alert:after {
+  content: "battery_android_alert";
+}
+
+.msc-battery_android_bolt:after {
+  content: "battery_android_bolt";
+}
+
+.msc-battery_android_full:after {
+  content: "battery_android_full";
+}
+
+.msc-battery_android_plus:after {
+  content: "battery_android_plus";
+}
+
+.msc-battery_android_question:after {
+  content: "battery_android_question";
+}
+
+.msc-battery_android_share:after {
+  content: "battery_android_share";
+}
+
+.msc-battery_android_shield:after {
+  content: "battery_android_shield";
+}
+
 .msc-battery_change:after {
   content: "battery_change";
 }
@@ -1710,10 +1762,6 @@
   content: "book_4";
 }
 
-.msc-book_4_spark:after {
-  content: "book_4_spark";
-}
-
 .msc-book_5:after {
   content: "book_5";
 }
@@ -2214,6 +2262,10 @@
   content: "candlestick_chart";
 }
 
+.msc-cannabis:after {
+  content: "cannabis";
+}
+
 .msc-captive_portal:after {
   content: "captive_portal";
 }
@@ -2866,6 +2918,14 @@
   content: "computer";
 }
 
+.msc-computer_arrow_up:after {
+  content: "computer_arrow_up";
+}
+
+.msc-computer_cancel:after {
+  content: "computer_cancel";
+}
+
 .msc-concierge:after {
   content: "concierge";
 }
@@ -3566,6 +3626,10 @@
   content: "developer_mode_tv";
 }
 
+.msc-device_band:after {
+  content: "device_band";
+}
+
 .msc-device_hub:after {
   content: "device_hub";
 }
@@ -4246,10 +4310,6 @@
   content: "emergency_share_off";
 }
 
-.msc-emoji_events:after {
-  content: "emoji_events";
-}
-
 .msc-emoji_food_beverage:after {
   content: "emoji_food_beverage";
 }
@@ -4562,6 +4622,10 @@
   content: "eyeglasses";
 }
 
+.msc-eyeglasses_2:after {
+  content: "eyeglasses_2";
+}
+
 .msc-face:after {
   content: "face";
 }
@@ -6050,6 +6114,14 @@
   content: "hearing_aid_disabled";
 }
 
+.msc-hearing_aid_disabled_left:after {
+  content: "hearing_aid_disabled_left";
+}
+
+.msc-hearing_aid_left:after {
+  content: "hearing_aid_left";
+}
+
 .msc-hearing_disabled:after {
   content: "hearing_disabled";
 }
@@ -6594,10 +6666,6 @@
   content: "install_desktop";
 }
 
-.msc-install_mobile:after {
-  content: "install_mobile";
-}
-
 .msc-instant_mix:after {
   content: "instant_mix";
 }
@@ -6886,6 +6954,10 @@
   content: "landscape_2";
 }
 
+.msc-landscape_2_edit:after {
+  content: "landscape_2_edit";
+}
+
 .msc-landscape_2_off:after {
   content: "landscape_2_off";
 }
@@ -7806,14 +7878,22 @@
   content: "mms";
 }
 
-.msc-mobile_friendly:after {
-  content: "mobile_friendly";
-}
-
 .msc-mobile_hand:after {
   content: "mobile_hand";
 }
 
+.msc-mobile_hand_left:after {
+  content: "mobile_hand_left";
+}
+
+.msc-mobile_hand_left_off:after {
+  content: "mobile_hand_left_off";
+}
+
+.msc-mobile_hand_off:after {
+  content: "mobile_hand_off";
+}
+
 .msc-mobile_loupe:after {
   content: "mobile_loupe";
 }
@@ -8486,10 +8566,6 @@
   content: "new_label";
 }
 
-.msc-new_releases:after {
-  content: "new_releases";
-}
-
 .msc-new_window:after {
   content: "new_window";
 }
@@ -8802,10 +8878,6 @@
   content: "open_in_new_off";
 }
 
-.msc-open_in_phone:after {
-  content: "open_in_phone";
-}
-
 .msc-open_jam:after {
   content: "open_jam";
 }
@@ -9334,14 +9406,6 @@
   content: "phonelink_erase";
 }
 
-.msc-phonelink_lock:after {
-  content: "phonelink_lock";
-}
-
-.msc-phonelink_off:after {
-  content: "phonelink_off";
-}
-
 .msc-phonelink_ring:after {
   content: "phonelink_ring";
 }
@@ -10398,6 +10462,10 @@
   content: "router";
 }
 
+.msc-router_off:after {
+  content: "router_off";
+}
+
 .msc-routine:after {
   content: "routine";
 }
@@ -11094,6 +11162,10 @@
   content: "shield_question";
 }
 
+.msc-shield_watch:after {
+  content: "shield_watch";
+}
+
 .msc-shield_with_heart:after {
   content: "shield_with_heart";
 }
@@ -11670,6 +11742,22 @@
   content: "split_scene";
 }
 
+.msc-split_scene_down:after {
+  content: "split_scene_down";
+}
+
+.msc-split_scene_left:after {
+  content: "split_scene_left";
+}
+
+.msc-split_scene_right:after {
+  content: "split_scene_right";
+}
+
+.msc-split_scene_up:after {
+  content: "split_scene_up";
+}
+
 .msc-splitscreen:after {
   content: "splitscreen";
 }
@@ -11942,18 +12030,6 @@
   content: "stay_current_landscape";
 }
 
-.msc-stay_current_portrait:after {
-  content: "stay_current_portrait";
-}
-
-.msc-stay_primary_landscape:after {
-  content: "stay_primary_landscape";
-}
-
-.msc-stay_primary_portrait:after {
-  content: "stay_primary_portrait";
-}
-
 .msc-steering_wheel_heat:after {
   content: "steering_wheel_heat";
 }
@@ -12434,6 +12510,10 @@
   content: "tab_recent";
 }
 
+.msc-tab_search:after {
+  content: "tab_search";
+}
+
 .msc-tab_unselected:after {
   content: "tab_unselected";
 }
@@ -13442,6 +13522,10 @@
   content: "verified";
 }
 
+.msc-verified_off:after {
+  content: "verified_off";
+}
+
 .msc-verified_user:after {
   content: "verified_user";
 }
@@ -13814,6 +13898,10 @@
   content: "watch";
 }
 
+.msc-watch_arrow:after {
+  content: "watch_arrow";
+}
+
 .msc-watch_button_press:after {
   content: "watch_button_press";
 }