rumkin / Favicon Switcher
Licence: mit
Make favicon react on media queries
Stars: ✭ 76
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Favicon Switcher
Dialogutil
common used dialog with material style ( in support v7)，ios style，get top activity automatically, invoke everywhere (any thread , any window)
Stars: ✭ 948 (+1147.37%)
Mutual labels: utils
Sassyfication
💅Library with sass mixins to speed up your css workflow.
Stars: ✭ 51 (-32.89%)
Mutual labels: utils
Styled Theming
Create themes for your app using styled-components
Stars: ✭ 1,067 (+1303.95%)
Mutual labels: theming
Statusbarutil
A util for setting status bar style on Android App.
Stars: ✭ 8,726 (+11381.58%)
Mutual labels: utils
Css In Js Utils
Useful utility functions for CSS in JS solutions
Stars: ✭ 61 (-19.74%)
Mutual labels: utils
Tools
C# 工具箱，提供Socket（TCP、UDP协议）、Redis、activemq、数据库访问等技术的封装实现
Stars: ✭ 34 (-55.26%)
Mutual labels: utils
Apnsutil
APNSUtil is makes code simple using apple push notification service
Stars: ✭ 31 (-59.21%)
Mutual labels: utils
Tailwindcss Theme Variants
Media-query- or JavaScript-based theme variants with fallback for Tailwind CSS
Stars: ✭ 73 (-3.95%)
Mutual labels: theming
Androidutilcode
AndroidUtilCode 🔥 is a powerful & easy to use library for Android. This library encapsulates the functions that commonly used in Android development which have complete demo and unit test. By using it's encapsulated APIs, you can greatly improve the development efficiency. The program mainly consists of two modules which is utilcode, which is commonly used in development, and subutil which is rarely used in development, but the utils can be beneficial to simplify the main module. 🔥
Stars: ✭ 30,239 (+39688.16%)
Mutual labels: utils
Schematics Utilities
🛠️ Useful exported utilities for working with Schematics
Stars: ✭ 73 (-3.95%)
Mutual labels: utils
Theming Demo
https://codesandbox.io/s/github/juliaqiuxy/theming-demo/tree/master/?from-embed
Stars: ✭ 59 (-22.37%)
Mutual labels: theming
Favicon Switcher
Switches site's favicon by matching media queries. It could be used for light/dark mode switching. Due to browsers don't support all Media Query features in link tag, this module fixes it.
Usage
Script doesn't require any setup or configuration and works like a polyfill. The example below shows how to make dark/light mode icon switching.
Use the main library to automatically turn icon switching on:
<script src="https://unpkg.com/[email protected]/dist/index.js" crossorigin="anonymous" type="application/javascript"></script>
If you need more control to turn switching on and off use one of the next module:
UMD
Use with UMD:
<script src="https://unpkg.com/[email protected]/dist/index.umd.js" crossorigin="anonymous" type="application/javascript"></script>
<script>faviconSwitcher()</script>
ESM
Use as ES module:
<script type="module" language="javascript">
import initSwitcher from 'https://unpkg.com/[email protected]/dist/index.esm.js'
// Subscribe to media queries changing events
const unsubscribe = initSwitcher()
// Unsubscribe later on some condition. For example on page navigation.
unsubscribe()
</script>
Complete example
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<link rel="icon" media="(prefers-color-scheme:dark)" href="favicon-dark.png" type="image/png" />
<link rel="icon" media="(prefers-color-scheme:light)" href="favicon-light.png" type="image/png" />
<script src="https://unpkg.com/[email protected]/dist/index.js" crossorigin="anonymous" type="application/javascript"></script>
</head>
<body></body>
</html>
License
MIT © Rumkin
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].