diff --git a/css/style.css b/css/style.css index 935b95f..1b97c87 100644 --- a/css/style.css +++ b/css/style.css @@ -21,6 +21,7 @@ color: rgba(255, 255, 255, 0.3); color: #fff; font-weight: bold; font-size: 5rem; + padding: 2em 0 0 0; } .masthead h2 { font-weight: normal; diff --git a/index.html b/index.html index 1885f37..f7a4da4 100644 --- a/index.html +++ b/index.html @@ -38,14 +38,11 @@

What is my User-Agent

-
- Introducing -

UAParser.js

Abstracts Away The Hassle of User-Agent Detection

- Try Demo + Try Demo Read Docs Download
@@ -72,7 +69,7 @@
- DEMO : A USER-AGENT PLAYGROUND + DEMO: USER-AGENT PLAYGROUND
@@ -83,13 +80,13 @@

- What your browser provides = 😱😵‍💫❌ + What your browser tells you = 😵‍💫 🤯 ❌

VS

- What {UAParser.js} provides = 🙂💰✅ + What UAParser.js provides = 🙂 💲💲💲 ✅

@@ -217,7 +214,78 @@
- QUICKSTART : SUPPORT VARIOUS DEVELOPMENT STRATEGIES + FEATURES +
+
+
+
+
+
+

+ +
Extracts Valuable Data
+

+

UAParser.js filters the noise away and only extracts the most meaningful data in a well-structured format.

+
+
+
+
+

+ +
Relatively Small Footprint
+

+

While UAParser.js covers a vast range of detection, on the other hand its size is always kept to be as light as possible.

+
+
+
+
+

+ +
+ Zero-deps Vanilla JS +
+

+

No dependencies, bloated framework, unnecessary boilerplate, transpiler, or large-sized files required.

+
+
+
+
+
+
+

+ +
+ 100% Open Source +
+

+

UAParser.js is open source from the start. If you need more flexibility, PRO licenses are also available.

+
+
+
+
+

+ +
+ Best Developer Experience +
+

+

UAParser.js generates a plugin for jQuery user, and provides predefined type declarations for TypeScript user.

+
+
+
+
+

+ +
Client-side & Server-side
+

+

UAParser.js is an isomorphic JavaScript library, it can be run either in browser or node.js environment. +

+
+
+
+
+
+ QUICKSTART
ESM / TypeScript @@ -482,86 +550,15 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt READ THE DOCS
-
- FEATURES: WHEN LESS IS MORE -
-
-
-
-
-
-

- -
Extract Only What's Valuable
-

-

{UAParser.js} filters the noise away and only extracts the most meaningful data in a well-structured format.

-
-
-
-
-

- -
Relatively Small Footprint
-

-

While {UAParser.js} covers a vast range of detection, on the other hand its size is always kept to be as light as possible.

-
-
-
-
-

- -
- Zero-deps Vanilla JS -
-

-

No dependencies, bloated framework, unnecessary boilerplate, transpiler, or large-sized files required.

-
-
-
-
-
-
-

- -
- 100% Free & Open Source -
-

-

{UAParser.js} is free to use & modify at no charge. PRO licenses also available if you need a non-free license.

-
-
-
-
-

- -
- Best Developer Experience -
-

-

{UAParser.js} generates a plugin for jQuery user, and provides predefined type for TypeScript user.

-
-
-
-
-

- -
Client-side & Server-side
-

-

{UAParser.js} is an isomorphic JavaScript library that's able to run either in browser or node.js environment. -

-
-
-
-
- TESTIMONIALS : LOVED BY DEVELOPERS + LOVED BY DEVELOPERS
-
+
Great Utility! @@ -574,7 +571,20 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt investigating what kind of users are visiting your website and how you can improve their UX. Supports most browsers out there."

-

Gabrijel Golubić - Frontend Web Developer

+

Gabrijel Golubić

+
+
+
+
+
+ Easier Life! +
+
+ 5/5 +
+
+

"Thanks to the awesome people who make life so much easier for developers.. The evolution of the internet has made it critical that we detect the user's device type accurately to make our apps function better and look better.".

+

The-Linguist

@@ -587,20 +597,41 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt
Totally Rocks! +
+
+ 5/5 +

"I've been using your library for a long time and it totally rocks!".

-

Christian Rich - Web Developer

+

Christian Rich

Very Useful! +
+
+ 5/5 +

"Thank you for putting out this very useful library!".

-

Anuj Nijhawan - Web Developer

+

Anuj Nijhawan

+
+
+
+
+
+ Essential Library! +
+
+ 5/5 +
+
+

"For years, it has been appreciated as a valuable tool for web developers. Its ability to accurately parse user agent strings.. has made it an essential library for many of us.".

+

LogRocket

@@ -610,18 +641,17 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt
-
- SHOWCASES : TRUSTED BY TOP COMPANIES -
+
+ TRUSTED BY TOP TECH COMPANIES +
-

Who's Using {UAParser.js} ?
Showcasing some - companies that are using our library
+

Case Studies
Hover over the company logo to preview the project that uses UAParser.js

-
+
Microsoft logo
@@ -1271,7 +1301,42 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt
- DOWNLOADS : CHOOSE YOUR PACKAGE + SUPPORTED BY THE AMAZING OPEN-SOURCE COMMUNITIES +
+
+
+

Backers & Sponsors
Those who give back and get + the value from using this library
+

+
+ organization backer photos + individual backer photos +
+
+
+

Contributors
Those who collaborate and + continuously improve this library to be awesome
+

+ contributor photos +
+
+

Support UAParser.js
Feel free to contribute if you find it helpful
+

+ + ONE-TIME DONATION + + MONTHLY + + GITHUB SPONSORS +
+
+
+ CHOOSE YOUR DOWNLOAD PACKAGE
@@ -1424,8 +1489,8 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt 1-year limited support - - + + @@ -1450,49 +1515,13 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt - GET THE PACKAGE + GET THE PACKAGE
-
- CONTRIBUTORS : SUPPORTED BY THE AMAZING OPEN-SOURCE COMMUNITIES -
-
-
-

Contributors
Those who collaborate and - continuously improve this library to be awesome
-

- contributor photos -
-
-

Backers & Sponsors
Those who give back and get - the value from using this library
-

-
- organization backer photos - individual backer photos -
-
-
-

Contribute to UAParser.js
It's free to use, but - feel free to contribute if you find it helpful
-

- - ONE-TIME SPONSOR - - MONTHLY SPONSOR - - GITHUB SPONSOR -
-
@@ -1535,7 +1564,7 @@ $ npx ua-parser-js "Flock/2.16 (Zenwalk 7.3; es_PR;)" >> log.txt
-

UAParser.js is licensed under MIT, AGPLv3 & PRO licenses. Copyright (c) 2012-2024 Faisal Salman.

+

UAParser.js is licensed under MIT / AGPLv3 / PRO licenses. Copyright (c) 2012-2024 Faisal Salman.

diff --git a/js/script.js b/js/script.js index 4925a0d..ec26ade 100644 --- a/js/script.js +++ b/js/script.js @@ -1,16 +1,16 @@ $(document) .ready(function() { - var labels = ['{ browser.name }', '{ os.version }', '{ device.type }', '{ cpu.arch }', '{ device.model }', '{ browser.version }', '{ device.vendor }', '{ engine.name }', '{ engine.version }']; + var labels = ['{ browser.name }', '{ os.version }', '{ device.type }']; var counter = 0; var rotateLabel = function () { $('.masthead h3 .label').transition('fly down', function () { $(this).text(labels[counter++]).transition('fade up', 100, function (){ if(counter>=labels.length)counter=0; - $(this).transition('tada'); + $(this).transition('jiggle'); }); }); }; - $('.masthead h3').transition({animation: 'slide up', interval: 9000}); + $('.masthead h3').transition({animation: 'slide up', interval: 5000}); rotateLabel(); setInterval(rotateLabel, 1000); @@ -108,7 +108,7 @@ $(document) qs = new URLSearchParams(window.location.search).get('ua'); } if (qs) { - $('#ua-txt-info').text('What the browser provides = 😱😵‍💫❌'); + $('#ua-txt-info').text('What your browser tells you = 😵‍💫 🤯 ❌'); $('#demo-result').get(0).scrollIntoView(); updateDemo(UAParser(qs)); } else { diff --git a/semantic-ui/semantic.css b/semantic-ui/semantic.css index 250f700..908bcb9 100644 --- a/semantic-ui/semantic.css +++ b/semantic-ui/semantic.css @@ -8,7 +8,7 @@ * http://opensource.org/licenses/MIT * */ -@import url('https://fonts.googleapis.com/css?family=Source+Code+Pro:500|Source+Sans+Pro:400,700,400italic,700italic&subset=latin'); +@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:500|Source+Code+Pro:500|Source+Sans+Pro:400,700,400italic,700italic&subset=latin'); /*! * # Semantic UI 2.4.0 - Reset * http://github.com/semantic-org/semantic-ui/ @@ -585,7 +585,7 @@ h2, h3, h4, h5 { - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; line-height: 1.28571429em; margin: calc(2rem - 0.14285714em ) 0em 1rem; font-weight: bold; @@ -6845,7 +6845,7 @@ i.flag.zimbabwe:before { border: none; margin: calc(2rem - 0.14285714em ) 0em 1rem; padding: 0em 0em; - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-weight: bold; line-height: 1.28571429em; text-transform: none; @@ -30962,7 +30962,7 @@ a.ui.card:hover, .ui.accordion .title:not(.ui) { padding: 0.5em 0em; - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 1em; color: rgba(0, 0, 0, 0.87); } @@ -34032,7 +34032,7 @@ select.ui.dropdown { .ui.modal > .header { display: block; - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; background: #FFFFFF; margin: 0em; padding: 1.25rem 1.5rem; @@ -34824,7 +34824,7 @@ a.ui.nag { .ui.popup > .header { padding: 0em; - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 1.14285714em; line-height: 1.2; font-weight: bold; @@ -36604,7 +36604,7 @@ a.ui.nag { .ui.search > .results .result .title { margin: -0.14285714em 0em 0em; - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-weight: bold; font-size: 1em; color: rgba(0, 0, 0, 0.85); @@ -36630,7 +36630,7 @@ a.ui.nag { } .ui.search > .results > .message .header { - font-family: 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; + font-family: 'IBM Plex Sans', 'Source Sans Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size: 1rem; font-weight: bold; color: rgba(0, 0, 0, 0.87);