mirror of
https://github.com/d3ward/toolz.git
synced 2025-02-20 22:02:54 +08:00
#1.0.0
This commit is contained in:
commit
7418d3aef1
7 changed files with 1100 additions and 0 deletions
438
LICENSE
Normal file
438
LICENSE
Normal file
|
@ -0,0 +1,438 @@
|
|||
Attribution-NonCommercial-ShareAlike 4.0 International
|
||||
|
||||
=======================================================================
|
||||
|
||||
Creative Commons Corporation ("Creative Commons") is not a law firm and
|
||||
does not provide legal services or legal advice. Distribution of
|
||||
Creative Commons public licenses does not create a lawyer-client or
|
||||
other relationship. Creative Commons makes its licenses and related
|
||||
information available on an "as-is" basis. Creative Commons gives no
|
||||
warranties regarding its licenses, any material licensed under their
|
||||
terms and conditions, or any related information. Creative Commons
|
||||
disclaims all liability for damages resulting from their use to the
|
||||
fullest extent possible.
|
||||
|
||||
Using Creative Commons Public Licenses
|
||||
|
||||
Creative Commons public licenses provide a standard set of terms and
|
||||
conditions that creators and other rights holders may use to share
|
||||
original works of authorship and other material subject to copyright
|
||||
and certain other rights specified in the public license below. The
|
||||
following considerations are for informational purposes only, are not
|
||||
exhaustive, and do not form part of our licenses.
|
||||
|
||||
Considerations for licensors: Our public licenses are
|
||||
intended for use by those authorized to give the public
|
||||
permission to use material in ways otherwise restricted by
|
||||
copyright and certain other rights. Our licenses are
|
||||
irrevocable. Licensors should read and understand the terms
|
||||
and conditions of the license they choose before applying it.
|
||||
Licensors should also secure all rights necessary before
|
||||
applying our licenses so that the public can reuse the
|
||||
material as expected. Licensors should clearly mark any
|
||||
material not subject to the license. This includes other CC-
|
||||
licensed material, or material used under an exception or
|
||||
limitation to copyright. More considerations for licensors:
|
||||
wiki.creativecommons.org/Considerations_for_licensors
|
||||
|
||||
Considerations for the public: By using one of our public
|
||||
licenses, a licensor grants the public permission to use the
|
||||
licensed material under specified terms and conditions. If
|
||||
the licensor's permission is not necessary for any reason--for
|
||||
example, because of any applicable exception or limitation to
|
||||
copyright--then that use is not regulated by the license. Our
|
||||
licenses grant only permissions under copyright and certain
|
||||
other rights that a licensor has authority to grant. Use of
|
||||
the licensed material may still be restricted for other
|
||||
reasons, including because others have copyright or other
|
||||
rights in the material. A licensor may make special requests,
|
||||
such as asking that all changes be marked or described.
|
||||
Although not required by our licenses, you are encouraged to
|
||||
respect those requests where reasonable. More considerations
|
||||
for the public:
|
||||
wiki.creativecommons.org/Considerations_for_licensees
|
||||
|
||||
=======================================================================
|
||||
|
||||
Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International
|
||||
Public License
|
||||
|
||||
By exercising the Licensed Rights (defined below), You accept and agree
|
||||
to be bound by the terms and conditions of this Creative Commons
|
||||
Attribution-NonCommercial-ShareAlike 4.0 International Public License
|
||||
("Public License"). To the extent this Public License may be
|
||||
interpreted as a contract, You are granted the Licensed Rights in
|
||||
consideration of Your acceptance of these terms and conditions, and the
|
||||
Licensor grants You such rights in consideration of benefits the
|
||||
Licensor receives from making the Licensed Material available under
|
||||
these terms and conditions.
|
||||
|
||||
|
||||
Section 1 -- Definitions.
|
||||
|
||||
a. Adapted Material means material subject to Copyright and Similar
|
||||
Rights that is derived from or based upon the Licensed Material
|
||||
and in which the Licensed Material is translated, altered,
|
||||
arranged, transformed, or otherwise modified in a manner requiring
|
||||
permission under the Copyright and Similar Rights held by the
|
||||
Licensor. For purposes of this Public License, where the Licensed
|
||||
Material is a musical work, performance, or sound recording,
|
||||
Adapted Material is always produced where the Licensed Material is
|
||||
synched in timed relation with a moving image.
|
||||
|
||||
b. Adapter's License means the license You apply to Your Copyright
|
||||
and Similar Rights in Your contributions to Adapted Material in
|
||||
accordance with the terms and conditions of this Public License.
|
||||
|
||||
c. BY-NC-SA Compatible License means a license listed at
|
||||
creativecommons.org/compatiblelicenses, approved by Creative
|
||||
Commons as essentially the equivalent of this Public License.
|
||||
|
||||
d. Copyright and Similar Rights means copyright and/or similar rights
|
||||
closely related to copyright including, without limitation,
|
||||
performance, broadcast, sound recording, and Sui Generis Database
|
||||
Rights, without regard to how the rights are labeled or
|
||||
categorized. For purposes of this Public License, the rights
|
||||
specified in Section 2(b)(1)-(2) are not Copyright and Similar
|
||||
Rights.
|
||||
|
||||
e. Effective Technological Measures means those measures that, in the
|
||||
absence of proper authority, may not be circumvented under laws
|
||||
fulfilling obligations under Article 11 of the WIPO Copyright
|
||||
Treaty adopted on December 20, 1996, and/or similar international
|
||||
agreements.
|
||||
|
||||
f. Exceptions and Limitations means fair use, fair dealing, and/or
|
||||
any other exception or limitation to Copyright and Similar Rights
|
||||
that applies to Your use of the Licensed Material.
|
||||
|
||||
g. License Elements means the license attributes listed in the name
|
||||
of a Creative Commons Public License. The License Elements of this
|
||||
Public License are Attribution, NonCommercial, and ShareAlike.
|
||||
|
||||
h. Licensed Material means the artistic or literary work, database,
|
||||
or other material to which the Licensor applied this Public
|
||||
License.
|
||||
|
||||
i. Licensed Rights means the rights granted to You subject to the
|
||||
terms and conditions of this Public License, which are limited to
|
||||
all Copyright and Similar Rights that apply to Your use of the
|
||||
Licensed Material and that the Licensor has authority to license.
|
||||
|
||||
j. Licensor means the individual(s) or entity(ies) granting rights
|
||||
under this Public License.
|
||||
|
||||
k. NonCommercial means not primarily intended for or directed towards
|
||||
commercial advantage or monetary compensation. For purposes of
|
||||
this Public License, the exchange of the Licensed Material for
|
||||
other material subject to Copyright and Similar Rights by digital
|
||||
file-sharing or similar means is NonCommercial provided there is
|
||||
no payment of monetary compensation in connection with the
|
||||
exchange.
|
||||
|
||||
l. Share means to provide material to the public by any means or
|
||||
process that requires permission under the Licensed Rights, such
|
||||
as reproduction, public display, public performance, distribution,
|
||||
dissemination, communication, or importation, and to make material
|
||||
available to the public including in ways that members of the
|
||||
public may access the material from a place and at a time
|
||||
individually chosen by them.
|
||||
|
||||
m. Sui Generis Database Rights means rights other than copyright
|
||||
resulting from Directive 96/9/EC of the European Parliament and of
|
||||
the Council of 11 March 1996 on the legal protection of databases,
|
||||
as amended and/or succeeded, as well as other essentially
|
||||
equivalent rights anywhere in the world.
|
||||
|
||||
n. You means the individual or entity exercising the Licensed Rights
|
||||
under this Public License. Your has a corresponding meaning.
|
||||
|
||||
|
||||
Section 2 -- Scope.
|
||||
|
||||
a. License grant.
|
||||
|
||||
1. Subject to the terms and conditions of this Public License,
|
||||
the Licensor hereby grants You a worldwide, royalty-free,
|
||||
non-sublicensable, non-exclusive, irrevocable license to
|
||||
exercise the Licensed Rights in the Licensed Material to:
|
||||
|
||||
a. reproduce and Share the Licensed Material, in whole or
|
||||
in part, for NonCommercial purposes only; and
|
||||
|
||||
b. produce, reproduce, and Share Adapted Material for
|
||||
NonCommercial purposes only.
|
||||
|
||||
2. Exceptions and Limitations. For the avoidance of doubt, where
|
||||
Exceptions and Limitations apply to Your use, this Public
|
||||
License does not apply, and You do not need to comply with
|
||||
its terms and conditions.
|
||||
|
||||
3. Term. The term of this Public License is specified in Section
|
||||
6(a).
|
||||
|
||||
4. Media and formats; technical modifications allowed. The
|
||||
Licensor authorizes You to exercise the Licensed Rights in
|
||||
all media and formats whether now known or hereafter created,
|
||||
and to make technical modifications necessary to do so. The
|
||||
Licensor waives and/or agrees not to assert any right or
|
||||
authority to forbid You from making technical modifications
|
||||
necessary to exercise the Licensed Rights, including
|
||||
technical modifications necessary to circumvent Effective
|
||||
Technological Measures. For purposes of this Public License,
|
||||
simply making modifications authorized by this Section 2(a)
|
||||
(4) never produces Adapted Material.
|
||||
|
||||
5. Downstream recipients.
|
||||
|
||||
a. Offer from the Licensor -- Licensed Material. Every
|
||||
recipient of the Licensed Material automatically
|
||||
receives an offer from the Licensor to exercise the
|
||||
Licensed Rights under the terms and conditions of this
|
||||
Public License.
|
||||
|
||||
b. Additional offer from the Licensor -- Adapted Material.
|
||||
Every recipient of Adapted Material from You
|
||||
automatically receives an offer from the Licensor to
|
||||
exercise the Licensed Rights in the Adapted Material
|
||||
under the conditions of the Adapter's License You apply.
|
||||
|
||||
c. No downstream restrictions. You may not offer or impose
|
||||
any additional or different terms or conditions on, or
|
||||
apply any Effective Technological Measures to, the
|
||||
Licensed Material if doing so restricts exercise of the
|
||||
Licensed Rights by any recipient of the Licensed
|
||||
Material.
|
||||
|
||||
6. No endorsement. Nothing in this Public License constitutes or
|
||||
may be construed as permission to assert or imply that You
|
||||
are, or that Your use of the Licensed Material is, connected
|
||||
with, or sponsored, endorsed, or granted official status by,
|
||||
the Licensor or others designated to receive attribution as
|
||||
provided in Section 3(a)(1)(A)(i).
|
||||
|
||||
b. Other rights.
|
||||
|
||||
1. Moral rights, such as the right of integrity, are not
|
||||
licensed under this Public License, nor are publicity,
|
||||
privacy, and/or other similar personality rights; however, to
|
||||
the extent possible, the Licensor waives and/or agrees not to
|
||||
assert any such rights held by the Licensor to the limited
|
||||
extent necessary to allow You to exercise the Licensed
|
||||
Rights, but not otherwise.
|
||||
|
||||
2. Patent and trademark rights are not licensed under this
|
||||
Public License.
|
||||
|
||||
3. To the extent possible, the Licensor waives any right to
|
||||
collect royalties from You for the exercise of the Licensed
|
||||
Rights, whether directly or through a collecting society
|
||||
under any voluntary or waivable statutory or compulsory
|
||||
licensing scheme. In all other cases the Licensor expressly
|
||||
reserves any right to collect such royalties, including when
|
||||
the Licensed Material is used other than for NonCommercial
|
||||
purposes.
|
||||
|
||||
|
||||
Section 3 -- License Conditions.
|
||||
|
||||
Your exercise of the Licensed Rights is expressly made subject to the
|
||||
following conditions.
|
||||
|
||||
a. Attribution.
|
||||
|
||||
1. If You Share the Licensed Material (including in modified
|
||||
form), You must:
|
||||
|
||||
a. retain the following if it is supplied by the Licensor
|
||||
with the Licensed Material:
|
||||
|
||||
i. identification of the creator(s) of the Licensed
|
||||
Material and any others designated to receive
|
||||
attribution, in any reasonable manner requested by
|
||||
the Licensor (including by pseudonym if
|
||||
designated);
|
||||
|
||||
ii. a copyright notice;
|
||||
|
||||
iii. a notice that refers to this Public License;
|
||||
|
||||
iv. a notice that refers to the disclaimer of
|
||||
warranties;
|
||||
|
||||
v. a URI or hyperlink to the Licensed Material to the
|
||||
extent reasonably practicable;
|
||||
|
||||
b. indicate if You modified the Licensed Material and
|
||||
retain an indication of any previous modifications; and
|
||||
|
||||
c. indicate the Licensed Material is licensed under this
|
||||
Public License, and include the text of, or the URI or
|
||||
hyperlink to, this Public License.
|
||||
|
||||
2. You may satisfy the conditions in Section 3(a)(1) in any
|
||||
reasonable manner based on the medium, means, and context in
|
||||
which You Share the Licensed Material. For example, it may be
|
||||
reasonable to satisfy the conditions by providing a URI or
|
||||
hyperlink to a resource that includes the required
|
||||
information.
|
||||
3. If requested by the Licensor, You must remove any of the
|
||||
information required by Section 3(a)(1)(A) to the extent
|
||||
reasonably practicable.
|
||||
|
||||
b. ShareAlike.
|
||||
|
||||
In addition to the conditions in Section 3(a), if You Share
|
||||
Adapted Material You produce, the following conditions also apply.
|
||||
|
||||
1. The Adapter's License You apply must be a Creative Commons
|
||||
license with the same License Elements, this version or
|
||||
later, or a BY-NC-SA Compatible License.
|
||||
|
||||
2. You must include the text of, or the URI or hyperlink to, the
|
||||
Adapter's License You apply. You may satisfy this condition
|
||||
in any reasonable manner based on the medium, means, and
|
||||
context in which You Share Adapted Material.
|
||||
|
||||
3. You may not offer or impose any additional or different terms
|
||||
or conditions on, or apply any Effective Technological
|
||||
Measures to, Adapted Material that restrict exercise of the
|
||||
rights granted under the Adapter's License You apply.
|
||||
|
||||
|
||||
Section 4 -- Sui Generis Database Rights.
|
||||
|
||||
Where the Licensed Rights include Sui Generis Database Rights that
|
||||
apply to Your use of the Licensed Material:
|
||||
|
||||
a. for the avoidance of doubt, Section 2(a)(1) grants You the right
|
||||
to extract, reuse, reproduce, and Share all or a substantial
|
||||
portion of the contents of the database for NonCommercial purposes
|
||||
only;
|
||||
|
||||
b. if You include all or a substantial portion of the database
|
||||
contents in a database in which You have Sui Generis Database
|
||||
Rights, then the database in which You have Sui Generis Database
|
||||
Rights (but not its individual contents) is Adapted Material,
|
||||
including for purposes of Section 3(b); and
|
||||
|
||||
c. You must comply with the conditions in Section 3(a) if You Share
|
||||
all or a substantial portion of the contents of the database.
|
||||
|
||||
For the avoidance of doubt, this Section 4 supplements and does not
|
||||
replace Your obligations under this Public License where the Licensed
|
||||
Rights include other Copyright and Similar Rights.
|
||||
|
||||
|
||||
Section 5 -- Disclaimer of Warranties and Limitation of Liability.
|
||||
|
||||
a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE
|
||||
EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS
|
||||
AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF
|
||||
ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS,
|
||||
IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION,
|
||||
WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR
|
||||
PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS,
|
||||
ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT
|
||||
KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT
|
||||
ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU.
|
||||
|
||||
b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE
|
||||
TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION,
|
||||
NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT,
|
||||
INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES,
|
||||
COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR
|
||||
USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN
|
||||
ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR
|
||||
DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR
|
||||
IN PART, THIS LIMITATION MAY NOT APPLY TO YOU.
|
||||
|
||||
c. The disclaimer of warranties and limitation of liability provided
|
||||
above shall be interpreted in a manner that, to the extent
|
||||
possible, most closely approximates an absolute disclaimer and
|
||||
waiver of all liability.
|
||||
|
||||
|
||||
Section 6 -- Term and Termination.
|
||||
|
||||
a. This Public License applies for the term of the Copyright and
|
||||
Similar Rights licensed here. However, if You fail to comply with
|
||||
this Public License, then Your rights under this Public License
|
||||
terminate automatically.
|
||||
|
||||
b. Where Your right to use the Licensed Material has terminated under
|
||||
Section 6(a), it reinstates:
|
||||
|
||||
1. automatically as of the date the violation is cured, provided
|
||||
it is cured within 30 days of Your discovery of the
|
||||
violation; or
|
||||
|
||||
2. upon express reinstatement by the Licensor.
|
||||
|
||||
For the avoidance of doubt, this Section 6(b) does not affect any
|
||||
right the Licensor may have to seek remedies for Your violations
|
||||
of this Public License.
|
||||
|
||||
c. For the avoidance of doubt, the Licensor may also offer the
|
||||
Licensed Material under separate terms or conditions or stop
|
||||
distributing the Licensed Material at any time; however, doing so
|
||||
will not terminate this Public License.
|
||||
|
||||
d. Sections 1, 5, 6, 7, and 8 survive termination of this Public
|
||||
License.
|
||||
|
||||
|
||||
Section 7 -- Other Terms and Conditions.
|
||||
|
||||
a. The Licensor shall not be bound by any additional or different
|
||||
terms or conditions communicated by You unless expressly agreed.
|
||||
|
||||
b. Any arrangements, understandings, or agreements regarding the
|
||||
Licensed Material not stated herein are separate from and
|
||||
independent of the terms and conditions of this Public License.
|
||||
|
||||
|
||||
Section 8 -- Interpretation.
|
||||
|
||||
a. For the avoidance of doubt, this Public License does not, and
|
||||
shall not be interpreted to, reduce, limit, restrict, or impose
|
||||
conditions on any use of the Licensed Material that could lawfully
|
||||
be made without permission under this Public License.
|
||||
|
||||
b. To the extent possible, if any provision of this Public License is
|
||||
deemed unenforceable, it shall be automatically reformed to the
|
||||
minimum extent necessary to make it enforceable. If the provision
|
||||
cannot be reformed, it shall be severed from this Public License
|
||||
without affecting the enforceability of the remaining terms and
|
||||
conditions.
|
||||
|
||||
c. No term or condition of this Public License will be waived and no
|
||||
failure to comply consented to unless expressly agreed to by the
|
||||
Licensor.
|
||||
|
||||
d. Nothing in this Public License constitutes or may be interpreted
|
||||
as a limitation upon, or waiver of, any privileges and immunities
|
||||
that apply to the Licensor or You, including from the legal
|
||||
processes of any jurisdiction or authority.
|
||||
|
||||
=======================================================================
|
||||
|
||||
Creative Commons is not a party to its public
|
||||
licenses. Notwithstanding, Creative Commons may elect to apply one of
|
||||
its public licenses to material it publishes and in those instances
|
||||
will be considered the “Licensor.” The text of the Creative Commons
|
||||
public licenses is dedicated to the public domain under the CC0 Public
|
||||
Domain Dedication. Except for the limited purpose of indicating that
|
||||
material is shared under a Creative Commons public license or as
|
||||
otherwise permitted by the Creative Commons policies published at
|
||||
creativecommons.org/policies, Creative Commons does not authorize the
|
||||
use of the trademark "Creative Commons" or any other trademark or logo
|
||||
of Creative Commons without its prior written consent including,
|
||||
without limitation, in connection with any unauthorized modifications
|
||||
to any of its public licenses or any other arrangements,
|
||||
understandings, or agreements concerning use of licensed material. For
|
||||
the avoidance of doubt, this paragraph does not form part of the
|
||||
public licenses.
|
||||
|
||||
Creative Commons may be contacted at creativecommons.org.
|
||||
|
12
README.md
Normal file
12
README.md
Normal file
|
@ -0,0 +1,12 @@
|
|||
# Toolz
|
||||
|
||||
A set of web tools to check, verify, and test.
|
||||
|
||||
## Ad Block Test [Link](https://d3ward.github.io/toolz/src/adblock)
|
||||
Check if your adblock is blocking enough hosts ( not ads )
|
||||
With a simple UI check how much yoou blocked , the tool try to connect to most common domains for a couple of category ( Ads,Analytics,Error Tracking and Social)
|
||||
|
||||
## 100vh Viewport Units Test [Link](https://d3ward.github.io/toolz/src/units)
|
||||
CSS has several different units for expressing a length. One of them is the 'vh' , basically
|
||||
100vh should be 100% but on Mobile Browsers it isn't.
|
||||
Over the years there has been a lot of talk about this problem on mobile browsers, mainly on Safari (wich use WebKit , but Chromium browsers are affected). In addition to the test, there are in-depth studies and solutions
|
37
lib/d3Notif.js
vendored
Normal file
37
lib/d3Notif.js
vendored
Normal file
|
@ -0,0 +1,37 @@
|
|||
|
||||
function Notif(option){
|
||||
//Configuration
|
||||
var el = this;
|
||||
el.self = document.querySelector('.toast-message');
|
||||
el.message = document.querySelector('.message');
|
||||
el.top = option.topPos;
|
||||
el.classNames = option.classNames;
|
||||
el.autoClose = (typeof option.autoClose === "boolean")? option.autoClose: false;
|
||||
el.autoCloseTimeout = (option.autoClose && typeof option.autoCloseTimeout === "number")? option.autoCloseTimeout: 3000;
|
||||
console.log(el);
|
||||
|
||||
//Methods
|
||||
el.reset = function(){
|
||||
(el.message).innerHTML="";
|
||||
el.self.classList.remove(el.classNames);
|
||||
}
|
||||
el.showN = function(msg,type){
|
||||
el.reset();
|
||||
el.message.innerHTML=msg;
|
||||
el.self.style.top= el.top;
|
||||
el.self.classList.add(type);
|
||||
|
||||
if(el.autoClose){
|
||||
setTimeout(function(){
|
||||
el.hideN();
|
||||
}, el.autoCloseTimeout);
|
||||
}
|
||||
}
|
||||
el.hideN = function(){
|
||||
el.self.style.top='-100%';
|
||||
el.reset();
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
76
lib/radialprogress.js
Normal file
76
lib/radialprogress.js
Normal file
|
@ -0,0 +1,76 @@
|
|||
window.rp_requestAnimationFrame=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||(function(callback,element){setTimeout(callback,1000/60);});
|
||||
function RadialProgress(container,cfg){
|
||||
container.innerHTML="";
|
||||
var nc=document.createElement("div");
|
||||
nc.style.width="10em"; nc.style.height="10em";
|
||||
nc.style.position="relative";
|
||||
container.appendChild(nc);
|
||||
container=nc;
|
||||
if(!cfg) cfg={};
|
||||
this.colorBg=cfg.colorBg==undefined?"#404040":cfg.colorBg;
|
||||
this.colorFg=cfg.colorFg==undefined?"#007FFF":cfg.colorFg;
|
||||
this.colorText=cfg.colorText==undefined?"#FFFFFF":cfg.colorText;
|
||||
this.indeterminate=cfg.indeterminate==undefined?false:cfg.indeterminate;
|
||||
this.round=cfg.round==undefined?false:cfg.round;
|
||||
this.thick=cfg.thick==undefined?2:cfg.thick;
|
||||
this.progress=cfg.progress==undefined?0:cfg.progress;
|
||||
this.noAnimations=cfg.noAnimations==undefined?0:cfg.noAnimations;
|
||||
this.fixedTextSize=cfg.fixedTextSize==undefined?false:cfg.fixedTextSize;
|
||||
this.animationSpeed=cfg.animationSpeed==undefined?1:cfg.animationSpeed>0?cfg.animationSpeed:1;
|
||||
this.noPercentage=cfg.noPercentage==undefined?false:cfg.noPercentage;
|
||||
this.spin=cfg.spin==undefined?false:cfg.spin;
|
||||
if(cfg.noInitAnimation) this.aniP=this.progress; else this.aniP=0;
|
||||
var c=document.createElement("canvas");
|
||||
c.style.position="absolute";c.style.top="0";c.style.left="0";c.style.width="100%";c.style.height="100%";c.className="rp_canvas";
|
||||
container.appendChild(c);
|
||||
this.canvas=c;
|
||||
var tcc=document.createElement("div");
|
||||
tcc.style.position="absolute";tcc.style.display="table";tcc.style.width="100%";tcc.style.height="100%";
|
||||
var tc=document.createElement("div");
|
||||
tc.style.display="table-cell";tc.style.verticalAlign="middle";
|
||||
var t=document.createElement("div");
|
||||
t.style.color=this.colorText;t.style.textAlign="center";t.style.overflow="visible";t.style.whiteSpace="nowrap";t.className="rp_text";
|
||||
tc.appendChild(t);
|
||||
tcc.appendChild(tc);
|
||||
container.appendChild(tcc);
|
||||
this.text=t;
|
||||
this.prevW=0; this.prevH=0; this.prevP=0; this.indetA=0; this.indetB=0.2; this.rot=0;
|
||||
this.draw=function(f){
|
||||
if(!(f==true))rp_requestAnimationFrame(this.draw);
|
||||
var c=this.canvas;
|
||||
var dp=window.devicePixelRatio||1;
|
||||
c.width=c.clientWidth*dp; c.height=c.clientHeight*dp;
|
||||
if(!(f==true)&&!this.spin&&!this.indeterminate&&(Math.abs(this.prevP-this.progress)<1&&this.prevW==c.width&&this.prevH==c.height)) return;
|
||||
var centerX=c.width/2, centerY=c.height/2, bw=(c.clientWidth/100.0), radius=c.height/2-(this.thick*bw*dp)/2, bw=(c.clientWidth/100.0);
|
||||
this.text.style.fontSize=(this.fixedTextSize?(c.clientWidth*this.fixedTextSize):(c.clientWidth*0.26-this.thick))+"px";
|
||||
if(this.noAnimations) this.aniP=this.progress; else{var aniF=Math.pow(0.93,this.animationSpeed);this.aniP=this.aniP*aniF+this.progress*(1-aniF);}
|
||||
c=c.getContext("2d");
|
||||
c.beginPath();
|
||||
c.strokeStyle=this.colorBg;
|
||||
c.lineWidth=this.thick*bw*dp;
|
||||
c.arc(centerX,centerY,radius,-Math.PI/2, 2*Math.PI);
|
||||
c.stroke();
|
||||
c.beginPath();
|
||||
c.strokeStyle=this.colorFg;
|
||||
c.lineWidth=this.thick*bw*dp;
|
||||
if(this.round) c.lineCap="round";
|
||||
if(this.indeterminate){
|
||||
this.indetA=(this.indetA+0.07*this.animationSpeed)%(2*Math.PI);this.indetB=(this.indetB+0.14*this.animationSpeed)%(2*Math.PI);
|
||||
c.arc(centerX,centerY,radius,this.indetA, this.indetB);
|
||||
if(!this.noPercentage)this.text.innerHTML="";
|
||||
}else{
|
||||
if(this.spin&&!this.noAnimations)this.rot=(this.rot+0.07*this.animationSpeed)%(2*Math.PI)
|
||||
c.arc(centerX,centerY,radius,this.rot-Math.PI/2, this.rot+this.aniP*(2*Math.PI)-Math.PI/2);
|
||||
if(!this.noPercentage)this.text.innerHTML=Math.round(100*this.aniP)+" %";
|
||||
}
|
||||
c.stroke();
|
||||
this.prevW=c.width; this.prevH=c.height; this.prevP=this.aniP;
|
||||
}.bind(this);
|
||||
this.draw();
|
||||
}
|
||||
RadialProgress.prototype={
|
||||
constructor:RadialProgress,
|
||||
setValue:function(p){this.progress=p<0?0:p>1?1:p;},
|
||||
setIndeterminate:function(i){this.indeterminate=i;},
|
||||
setText:function(t){this.text.innerHTML=t;}
|
||||
}
|
1
lib/svelte.min.js
vendored
Normal file
1
lib/svelte.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
414
src/adblock.html
Normal file
414
src/adblock.html
Normal file
|
@ -0,0 +1,414 @@
|
|||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
|
||||
<title>Ad Blocker Test</title>
|
||||
<link rel="icon" href="icon.png">
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 5px;
|
||||
background: #efefef;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.dark {
|
||||
background: #173145;
|
||||
color: #efefef
|
||||
}
|
||||
|
||||
.go_top {
|
||||
transition: all .25s ease-in-out;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
display: inline-flex;
|
||||
cursor: pointer;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 1em 1em 0;
|
||||
border-radius: 50%;
|
||||
padding: .25em;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background-color: #333333;
|
||||
}
|
||||
|
||||
.go_top.show {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.go_top.hide {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.go_top svg {
|
||||
fill: #efefef;
|
||||
width: 24px;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.cnt {
|
||||
max-width: 700px;
|
||||
margin: auto;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.test {
|
||||
background-color: #992325;
|
||||
color: #fff;
|
||||
padding: 5px;
|
||||
font-weight: bold;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
margin: 10px;
|
||||
transition: all 1s;
|
||||
}
|
||||
|
||||
.test>div {
|
||||
position: relative;
|
||||
user-select: none;
|
||||
display: none;
|
||||
overflow-x: auto;
|
||||
border-radius: 8px;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
margin: 10px;
|
||||
padding: 5px;
|
||||
box-shadow: 0px -1px 20px 9px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
|
||||
|
||||
.test>span {
|
||||
width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.test.show>div {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#bar {
|
||||
width: 10em;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.cnt2 {
|
||||
margin: auto;
|
||||
max-width: 700px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cl_info {
|
||||
margin-top: 5px;
|
||||
font-weight: bold;
|
||||
width: 150px;
|
||||
padding: 5px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.cl1 {
|
||||
background: #3cc47c;
|
||||
}
|
||||
|
||||
.cl2 {
|
||||
background: #ff3b3f;
|
||||
}
|
||||
|
||||
.button {
|
||||
text-decoration: none;
|
||||
float: left;
|
||||
margin: 10px;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
background: #173145;
|
||||
color: #efefef;
|
||||
text-align: center;
|
||||
padding: 1em .75em;
|
||||
}
|
||||
|
||||
.toast-message {
|
||||
position: fixed;
|
||||
top: -100%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 10px;
|
||||
width: 400px;
|
||||
font-size: 16px;
|
||||
transition: all .5s;
|
||||
z-index: 9999;
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
@media (max-width: 424px) {
|
||||
.toast-message {
|
||||
width: calc(100% - 20px);
|
||||
}
|
||||
}
|
||||
|
||||
.toast-message.success {
|
||||
background: rgb(4, 184, 255);
|
||||
|
||||
}
|
||||
|
||||
.toast-message .message {
|
||||
color: #333333;
|
||||
padding: 20px 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.git_btn {
|
||||
position: relative;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
width: 110px;
|
||||
margin: 10px auto;
|
||||
padding: 0 0 0 40px;
|
||||
color: #efefef;
|
||||
border-radius: 8px;
|
||||
background-color: #173145;
|
||||
}
|
||||
|
||||
.git_btn span {
|
||||
font-size: 14px;
|
||||
line-height: 44px;
|
||||
}
|
||||
|
||||
.git_btn svg {
|
||||
position: absolute;
|
||||
fill: #efefef;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="dar">
|
||||
<a class="go_top hide" href="" id="go_top">
|
||||
<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 12 6">
|
||||
<path d="M12 6H0l6-6z" /></svg>
|
||||
</a>
|
||||
<div class="toast-message">
|
||||
<div class="message">
|
||||
This is an Alert!
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cnt">
|
||||
<div id="bar"></div>
|
||||
<div class="cl_info cl1">Blocked Hosts</div>
|
||||
<div class="cl_info cl2">Not Blocked</div>
|
||||
<p>
|
||||
Click on a test below to see details about urls <br>
|
||||
Click on a url to copy to clipboard <br>
|
||||
</p>
|
||||
<div id="test"></div>
|
||||
<h3>Other tools from web </h3>
|
||||
<div class="cnt2">
|
||||
<a href="https://cryptojackingtest.com/" class="button">Cryptojacking by Opera</a>
|
||||
<a href="https://ipleak.net/" class="button">IP Leak </a>
|
||||
<a href="https://blockads.fivefilters.org/" class="button">Block Ads Test </a>
|
||||
<a href="https://panopticlick.eff.org/" class="button">Browser Fingerprint by EEF</a>
|
||||
<a href="https://raymondhill.net/ublock/tiles1.html" class="button">Adblock Testing by raymondhill</a>
|
||||
<a href="https://raymondhill.net/ublock/popup.html" class="button">Popup Blocker by raymondhill</a>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div style="width: 100%;text-align: center;"><span> Made by d3ward </span> <br>
|
||||
<a href="https://github.com/d3ward/toolz" class="git_btn">
|
||||
<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32">
|
||||
<path fill-rule="evenodd"
|
||||
d="M 16 4 C 9.371094 4 4 9.371094 4 16 C 4 21.300781 7.4375 25.800781 12.207031 27.386719 C 12.808594 27.496094 13.027344 27.128906 13.027344 26.808594 C 13.027344 26.523438 13.015625 25.769531 13.011719 24.769531 C 9.671875 25.492188 8.96875 23.160156 8.96875 23.160156 C 8.421875 21.773438 7.636719 21.402344 7.636719 21.402344 C 6.546875 20.660156 7.71875 20.675781 7.71875 20.675781 C 8.921875 20.761719 9.554688 21.910156 9.554688 21.910156 C 10.625 23.746094 12.363281 23.214844 13.046875 22.910156 C 13.15625 22.132813 13.46875 21.605469 13.808594 21.304688 C 11.144531 21.003906 8.34375 19.972656 8.34375 15.375 C 8.34375 14.0625 8.8125 12.992188 9.578125 12.152344 C 9.457031 11.851563 9.042969 10.628906 9.695313 8.976563 C 9.695313 8.976563 10.703125 8.65625 12.996094 10.207031 C 13.953125 9.941406 14.980469 9.808594 16 9.804688 C 17.019531 9.808594 18.046875 9.941406 19.003906 10.207031 C 21.296875 8.65625 22.300781 8.976563 22.300781 8.976563 C 22.957031 10.628906 22.546875 11.851563 22.421875 12.152344 C 23.191406 12.992188 23.652344 14.0625 23.652344 15.375 C 23.652344 19.984375 20.847656 20.996094 18.175781 21.296875 C 18.605469 21.664063 18.988281 22.398438 18.988281 23.515625 C 18.988281 25.121094 18.976563 26.414063 18.976563 26.808594 C 18.976563 27.128906 19.191406 27.503906 19.800781 27.386719 C 24.566406 25.796875 28 21.300781 28 16 C 28 9.371094 22.628906 4 16 4 Z" />
|
||||
</svg>
|
||||
<span>View on Github</span>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../lib/svelte.min.js"></script>
|
||||
<script src="../lib/radialprogress.js"></script>
|
||||
<script src="../lib/d3Notif.js"></script>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
var notification = new Notif({
|
||||
topPos: 10,
|
||||
classNames: 'success',
|
||||
autoClose: true,
|
||||
autoCloseTimeout: 2000
|
||||
});
|
||||
var nTest = 0; //Number of url to be tested
|
||||
var data = {
|
||||
"Ads": { //Ads
|
||||
"Google Ads": ["https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js",
|
||||
"https://pagead2.googlesyndication.com/pagead/show_ads.js",
|
||||
"https://adservice.google.com/adsid/integrator.js?domain=localhost",
|
||||
"https://www.google-analytics.com/analytics.js"
|
||||
],
|
||||
"Media.net": ["https://static.media.net", "https://media.net", "https://adservetx.media.net"],
|
||||
"Doubleclick.net": ["https://doubleclick.net/", "https://ad.doubleclick.net/"],
|
||||
"FastClick": ["https://media.fastclick.net/", "https://cdn.fastclick.net/"]
|
||||
},
|
||||
"Analytics": { //Analytics
|
||||
"Google Analytics": "https://google-analytics.com",
|
||||
"Hotjar": ["https://www.hotjar.com", "https://static.hotjar.com/c/hotjar.js?sv=6"],
|
||||
"MouseFlow": ["https://mouseflow.com/", "https://a.mouseflow.com"],
|
||||
"FreshMarketer": "https://freshmarketer.com/",
|
||||
"Luckyorange": ["https://cdn.luckyorange.com", "https://w1.luckyorange.com", "https://upload.luckyorange.net", "https://cs.luckyorange.net", "https://settings.luckyorange.net"],
|
||||
"Stats WP Plugin": "https://stats.wp.com/e-202020.js"
|
||||
},
|
||||
"Error Trackers": { //Error tracker
|
||||
"Bugsnag": ["https://notify.bugsnag.com", "https://sessions.bugsnag.com"],
|
||||
"Sentry": "https://browser.sentry-cdn.com/5.10.2/bundle.min.js"
|
||||
},
|
||||
"Social": {
|
||||
"Facebook": ["https://pixel.facebook.com", "https://adtools.facebook.com", "https://analytics.facebook.com", "https://graph.facebook.com", "https://ads.facebook.com"],
|
||||
"Twitter": ["https://ads-twitter.com", "https://static.ads-twitter.com", "https://analytics.twitter.com"],
|
||||
"LinkedIn": ["https://ads.linkedin.com", "https://analytics.pointdrive.linkedin.com"],
|
||||
"Pinterest": ["https://ads.pinterest.com", "https://log.pinterest.com", "https://widgets.pinterest.com", "https://analytics.pinterest.com", "https://trk.pinterest.com"],
|
||||
"Reddit": ["https://ads.reddit", "https://stats.redditmedia.com", "https://rereddit.com", "https://events.redditmedia.com"],
|
||||
"YouTube": ["https://ads.youtube.com", "https://youtube.cleverads.vn"]
|
||||
}
|
||||
|
||||
};
|
||||
var points = 0;
|
||||
var bar = new RadialProgress(document.getElementById("bar"), {
|
||||
colorBg: "#ff3b3f",
|
||||
colorFg: "#3cc47c",
|
||||
colorText: "#202020",
|
||||
thick: 12
|
||||
});
|
||||
|
||||
function copyToClip(str) {
|
||||
const el = document.createElement('textarea');
|
||||
el.value = str;
|
||||
el.setAttribute('readonly', '');
|
||||
el.style.position = 'absolute';
|
||||
el.style.left = '-9999px';
|
||||
document.body.appendChild(el);
|
||||
const selected =
|
||||
document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;
|
||||
el.select();
|
||||
document.execCommand('copy');
|
||||
document.body.removeChild(el);
|
||||
if (selected) {
|
||||
document.getSelection().removeAllRanges();
|
||||
document.getSelection().addRange(selected);
|
||||
}
|
||||
notification.showN('URL copied to clipboard !', 'success');
|
||||
}
|
||||
|
||||
function check_url(url, div) {
|
||||
var hostDiv = document.createElement("div");
|
||||
nTest += 1;
|
||||
hostDiv.innerHTML = url;
|
||||
hostDiv.onclick = () => {
|
||||
copyToClip(url);
|
||||
};
|
||||
div.appendChild(hostDiv);
|
||||
fetch(url, {
|
||||
method: 'HEAD',
|
||||
mode: 'no-cors'
|
||||
})
|
||||
.then(response => {
|
||||
$(div).css("background", "#ff3b3f");
|
||||
$(hostDiv).css("background", "#ff3b3f");
|
||||
}) //Response was received --> ads are NOT blocked
|
||||
.catch(error => {
|
||||
$(hostDiv).css("background", "#3cc47c");
|
||||
if ($(div).css("background") != "#ff3b3f") {
|
||||
$(div).css("background", "#3cc47c");
|
||||
points += 100 / nTest;
|
||||
bar.setValue(points / 100);
|
||||
}
|
||||
|
||||
}); //No response --> ads are blocked
|
||||
}
|
||||
|
||||
function show_info(t) {
|
||||
t = t.parentElement;
|
||||
var others = document.querySelectorAll(".test");
|
||||
others.forEach(element => {
|
||||
if (element != t) $(element).removeClass("show");
|
||||
});
|
||||
$(t).toggleClass("show");
|
||||
}
|
||||
window.onload = function () {
|
||||
//Load JSON data
|
||||
for (element in data) {
|
||||
var catEl = document.createElement("div");
|
||||
catEl.id = element;
|
||||
catEl.innerHTML = "<h3>" + element + "</h3>";
|
||||
document.getElementById("test").appendChild(catEl);
|
||||
var category = data[element];
|
||||
for (key in category) {
|
||||
var div = document.createElement('div');
|
||||
div.classList.add("test");
|
||||
div.id = key;
|
||||
div.innerHTML = "<span onclick='show_info(this)'>" + key + "</span>";
|
||||
|
||||
document.getElementById(element).appendChild(div);
|
||||
if (category.hasOwnProperty(key)) {
|
||||
var value = category[key];
|
||||
if (Array.isArray(value)) {
|
||||
var cnt = 0;
|
||||
for (let i = 0; i < value.length; i++)
|
||||
check_url(value[i], div);
|
||||
|
||||
} else check_url(value, div);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
// Set a variable for our button element.
|
||||
const scrollToTopButton = document.getElementById('go_top');
|
||||
|
||||
// Let's set up a function that shows our scroll-to-top button if we scroll beyond the height of the initial window.
|
||||
const scrollFunc = () => {
|
||||
let y = window.scrollY;
|
||||
if (y > 0) {
|
||||
scrollToTopButton.className = "go_top show";
|
||||
} else {
|
||||
scrollToTopButton.className = "go_top hide";
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener("scroll", scrollFunc);
|
||||
|
||||
const scrollToTop = () => {
|
||||
const c = document.documentElement.scrollTop || document.body.scrollTop;
|
||||
if (c > 0) {
|
||||
window.requestAnimationFrame(scrollToTop);
|
||||
window.scrollTo(0, c - c / 10);
|
||||
}
|
||||
};
|
||||
|
||||
scrollToTopButton.onclick = function (e) {
|
||||
e.preventDefault();
|
||||
scrollToTop();
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
</html>
|
122
src/units.html
Normal file
122
src/units.html
Normal file
|
@ -0,0 +1,122 @@
|
|||
<html>
|
||||
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<title>100vh Test</title>
|
||||
<style>
|
||||
body,
|
||||
html {
|
||||
text-align: center;
|
||||
background: #efefef;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
div.test {
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
border: 5px solid red;
|
||||
padding-top: 50px;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
width: 20%;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.cnt {
|
||||
margin: auto;
|
||||
max-width: 500px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.cnt2 {
|
||||
padding :10px;
|
||||
}
|
||||
|
||||
.cnt> a {
|
||||
text-decoration: none;
|
||||
float: left;
|
||||
margin: 10px;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
background: #173145;
|
||||
color: #efefef;
|
||||
text-align: center;
|
||||
padding: 1em .75em;
|
||||
}
|
||||
|
||||
.a {
|
||||
background-color: #3cc47c;
|
||||
height: 50vh;
|
||||
}
|
||||
|
||||
.b {
|
||||
background-color: #0095ff;
|
||||
height: 50%;
|
||||
}
|
||||
.git_btn {
|
||||
position: relative;
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
width: 110px;
|
||||
margin: 10px auto;
|
||||
padding: 0 0 0 40px;
|
||||
color: #efefef;
|
||||
border-radius: 8px;
|
||||
background-color: #173145;
|
||||
}
|
||||
|
||||
.git_btn span {
|
||||
font-size: 14px;
|
||||
line-height: 44px;
|
||||
}
|
||||
|
||||
.git_btn svg {
|
||||
position: absolute;
|
||||
fill: #efefef;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="cnt2">
|
||||
|
||||
<h3>Test Viewport Units</h3>
|
||||
<p>The following figures are used to test the css viewport problem.<br>
|
||||
If the two figures have the same dimensions it means that your browser is not affected by the bug </p>
|
||||
</div>
|
||||
<div class="test a">50vh</div>
|
||||
<div class="test b">50%</div>
|
||||
<div class="cnt">
|
||||
<a href="https://allthingssmitty.com/2020/05/11/css-fix-for-100vh-in-mobile-webkit/">CSS fix for 100vh</a>
|
||||
<a href="https://www.bram.us/2020/05/06/100vh-in-safari-on-ios/">100vh in Safari</a>
|
||||
<a href="https://maximilianschmitt.me/posts/css-100vh-mobile-browsers/"> CSS 100vh Mobile Browsers</a>
|
||||
<a href="https://medium.com/@susiekim9/how-to-compensate-for-the-ios-viewport-unit-bug-46e78d54af0d">It’s not a bug,
|
||||
it’s a feature</a>
|
||||
<a href="https://css-tricks.com/the-trick-to-viewport-units-on-mobile/">The trick of Viewport Units</a>
|
||||
<a href="https://chanind.github.io/javascript/2019/09/28/avoid-100vh-on-mobile-web.html">Avoid 100vh on Mobile
|
||||
Web</a>
|
||||
<a href="https://bugs.webkit.org/show_bug.cgi?id=141832">WebKit Bugzilla</a>
|
||||
<a href="https://twitter.com/AllThingsSmitty/status/1254151507412496384/">Matt Smith Solution</a></div>
|
||||
<hr>
|
||||
|
||||
<div style="width: 100%;text-align: center;"><span> Made by d3ward </span> <br>
|
||||
<a href="https://github.com/d3ward/toolz" class="git_btn">
|
||||
<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32" >
|
||||
<path fill-rule="evenodd"
|
||||
d="M 16 4 C 9.371094 4 4 9.371094 4 16 C 4 21.300781 7.4375 25.800781 12.207031 27.386719 C 12.808594 27.496094 13.027344 27.128906 13.027344 26.808594 C 13.027344 26.523438 13.015625 25.769531 13.011719 24.769531 C 9.671875 25.492188 8.96875 23.160156 8.96875 23.160156 C 8.421875 21.773438 7.636719 21.402344 7.636719 21.402344 C 6.546875 20.660156 7.71875 20.675781 7.71875 20.675781 C 8.921875 20.761719 9.554688 21.910156 9.554688 21.910156 C 10.625 23.746094 12.363281 23.214844 13.046875 22.910156 C 13.15625 22.132813 13.46875 21.605469 13.808594 21.304688 C 11.144531 21.003906 8.34375 19.972656 8.34375 15.375 C 8.34375 14.0625 8.8125 12.992188 9.578125 12.152344 C 9.457031 11.851563 9.042969 10.628906 9.695313 8.976563 C 9.695313 8.976563 10.703125 8.65625 12.996094 10.207031 C 13.953125 9.941406 14.980469 9.808594 16 9.804688 C 17.019531 9.808594 18.046875 9.941406 19.003906 10.207031 C 21.296875 8.65625 22.300781 8.976563 22.300781 8.976563 C 22.957031 10.628906 22.546875 11.851563 22.421875 12.152344 C 23.191406 12.992188 23.652344 14.0625 23.652344 15.375 C 23.652344 19.984375 20.847656 20.996094 18.175781 21.296875 C 18.605469 21.664063 18.988281 22.398438 18.988281 23.515625 C 18.988281 25.121094 18.976563 26.414063 18.976563 26.808594 C 18.976563 27.128906 19.191406 27.503906 19.800781 27.386719 C 24.566406 25.796875 28 21.300781 28 16 C 28 9.371094 22.628906 4 16 4 Z" />
|
||||
</svg>
|
||||
<span>View on Github</span>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in a new issue