Skip to content

Instantly share code, notes, and snippets.

@raamdev
Created March 16, 2018 01:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save raamdev/84a46e5fe861d554dcdf604689ea468d to your computer and use it in GitHub Desktop.
Save raamdev/84a46e5fe861d554dcdf604689ea468d to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Welcome To Google Cloud | Kinsta</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,600' rel='stylesheet' type='text/css'>
<style type='text/css'>
/* CSS RESET */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}
/* General Styles */
body, html {
min-height: 100%;
background: #fafafa;
font-weight:300;
font-family: Open Sans;
line-height: 1.6;
color: #404040;
}
.row {
max-width:900px;
margin: 0 auto;
}
/* Top Menu */
header {
background: #fff;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);
padding:22px 0;
position:fixed;
top:0px;
width:100%;
visibility: hidden;
}
header:after {
content: "";
display: table;
clear: both;
}
header #logo {
float:left;
}
header nav {
float:right;
}
header nav li {
display:inline-block;
margin-right:22px;
}
header nav li:last-of-type {
margin-right:0px;
}
header a {
color: #888;
text-decoration:none;
}
header a:hover {
color: #000;
}
/* Content Section */
/* Welcome Section */
#welcome {
display:flex;
align-items: center;
}
#welcome #google-cloud{
visibility: hidden;
}
#welcome #text {
margin-left: 66px;
overflow: hidden;
visibility: hidden;
}
#welcome h1 {
font-weight: 600;
font-size: 30px;
}
#welcome p {
font-size:30px;
}
</style>
</head>
<body>
<header><div class='row'>
<svg id='logo' width="123px" height="23px" viewBox="0 0 123 23" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>logo-dark</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-1" transform="translate(-54.000000, -22.000000)">
<g id="logo-dark" transform="translate(54.000000, 22.000000)">
<g id="Layer_1">
<path d="M16.7159597,22.640625 L2.60425159,22.640625 C1.19308078,22.640625 0.0384864767,21.4854911 0.0384864767,20.0736607 L0.0384864767,2.61830357 C0.0384864767,1.20647321 1.19308078,0.0513392857 2.60425159,0.0513392857 L16.7159597,0.0513392857 C18.1271305,0.0513392857 19.2817248,1.20647321 19.2817248,2.61830357 L19.2817248,20.0736607 C19.2817248,21.4854911 18.1271305,22.640625 16.7159597,22.640625 L16.7159597,22.640625 Z" id="XMLID_1_" fill="#5DC0C0"></path>
<path d="M16.8185903,22.0245536 L2.50162099,22.0245536 C1.51380142,22.0245536 0.705585406,21.2159598 0.705585406,20.2276786 L0.705585406,2.46428571 C0.705585406,1.47600446 1.51380142,0.667410714 2.50162099,0.667410714 L16.8185903,0.667410714 C17.8064099,0.667410714 18.6146259,1.47600446 18.6146259,2.46428571 L18.6146259,20.2276786 C18.6146259,21.2159598 17.8064099,22.0245536 16.8185903,22.0245536 L16.8185903,22.0245536 Z" id="XMLID_18_" fill="#FFFFFF"></path>
<path d="M16.7159597,5.72689732 L2.60425159,5.72689732 C2.18090035,5.72689732 1.83452206,5.38035714 1.83452206,4.95680804 L1.83452206,2.33850446 C1.83452206,1.91495536 2.18090035,1.56841518 2.60425159,1.56841518 L16.7159597,1.56841518 C17.139311,1.56841518 17.4856893,1.91495536 17.4856893,2.33850446 L17.4856893,4.95680804 C17.4856893,5.38035714 17.139311,5.72689732 16.7159597,5.72689732 L16.7159597,5.72689732 Z" id="XMLID_2_" fill="#5DC0C0"></path>
<ellipse id="XMLID_19_" fill="#FFFFFF" cx="15.5921546" cy="3.71953125" rx="0.821044837" ry="0.821428571"></ellipse>
<path d="M16.7159597,10.8454241 L2.60425159,10.8454241 C2.18090035,10.8454241 1.83452206,10.4988839 1.83452206,10.0753348 L1.83452206,7.45703125 C1.83452206,7.03348214 2.18090035,6.68694196 2.60425159,6.68694196 L16.7159597,6.68694196 C17.139311,6.68694196 17.4856893,7.03348214 17.4856893,7.45703125 L17.4856893,10.0753348 C17.4856893,10.4988839 17.139311,10.8454241 16.7159597,10.8454241 L16.7159597,10.8454241 Z" id="XMLID_21_" fill="#5DC0C0"></path>
<ellipse id="XMLID_20_" fill="#FFFFFF" cx="15.5921546" cy="8.840625" rx="0.821044837" ry="0.821428571"></ellipse>
<path d="M16.7159597,15.9767857 L2.60425159,15.9767857 C2.18090035,15.9767857 1.83452206,15.6302455 1.83452206,15.2066964 L1.83452206,12.5883929 C1.83452206,12.1648438 2.18090035,11.8183036 2.60425159,11.8183036 L16.7159597,11.8183036 C17.139311,11.8183036 17.4856893,12.1648438 17.4856893,12.5883929 L17.4856893,15.2066964 C17.4856893,15.6302455 17.139311,15.9767857 16.7159597,15.9767857 L16.7159597,15.9767857 Z" id="XMLID_25_" fill="#5DC0C0"></path>
<ellipse id="XMLID_24_" fill="#FFFFFF" cx="15.5921546" cy="13.9694196" rx="0.821044837" ry="0.821428571"></ellipse>
<path d="M16.7159597,21.1209821 L2.60425159,21.1209821 C2.18090035,21.1209821 1.83452206,20.774442 1.83452206,20.3508929 L1.83452206,17.7325893 C1.83452206,17.3090402 2.18090035,16.9625 2.60425159,16.9625 L16.7159597,16.9625 C17.139311,16.9625 17.4856893,17.3090402 17.4856893,17.7325893 L17.4856893,20.3508929 C17.4856893,20.774442 17.139311,21.1209821 16.7159597,21.1209821 L16.7159597,21.1209821 Z" id="XMLID_23_" fill="#5DC0C0"></path>
<ellipse id="XMLID_22_" fill="#FFFFFF" cx="15.5921546" cy="19.1136161" rx="0.821044837" ry="0.821428571"></ellipse>
<g id="XMLID_27_" transform="translate(22.322156, 0.000000)">
<path d="M12.9468508,0.0231026786 L4.53114119,0.0231026786 L4.53114119,11.3305804 L12.9468508,0.0231026786 Z" id="XMLID_29_"></path>
<path d="M87.431012,10.8633929 C87.0410157,10.4372768 86.5868753,10.0958705 86.0685908,9.83917411 C85.5477404,9.58247768 84.9935352,9.45412946 84.405975,9.45412946 C83.8184148,9.45412946 83.2642095,9.55424107 82.7433592,9.75446429 C82.2225089,9.9546875 81.7709342,10.2498884 81.3886352,10.6375 C81.0037704,11.0276786 80.7035759,11.5077009 80.4829201,12.0801339 C80.2622643,12.652567 80.1519364,13.3071429 80.1519364,14.0438616 C80.1519364,14.7805804 80.2622643,15.4351562 80.4829201,16.0075893 C80.7035759,16.5800223 81.0063362,17.0600446 81.3886352,17.4502232 C81.7709342,17.8404018 82.2225089,18.1330357 82.7433592,18.3332589 C83.2642095,18.5334821 83.8184148,18.6335937 84.405975,18.6335937 C84.9935352,18.6335937 85.5477404,18.5052455 86.0685908,18.2485491 C86.5894411,17.9918527 87.0435815,17.6504464 87.431012,17.2243304 C87.8210083,16.7982143 88.1263344,16.3104911 88.3521217,15.7585937 C88.577909,15.2066964 88.6908027,14.6368304 88.6908027,14.0489955 C88.6908027,13.4611607 88.577909,12.8887277 88.3521217,12.3368304 C88.1263344,11.784933 87.8184426,11.2895089 87.431012,10.8633929 L87.431012,10.8633929 Z" id="XMLID_30_"></path>
<path d="M4.53114119,11.3305804 L4.53114119,0.0231026786 L4.18219714,0.0231026786 L0.00769729534,0.0231026786 L0.00769729534,22.6354911 L4.53114119,22.6354911 L4.53114119,18.109933 L7.98209527,13.4893973 L12.9468508,22.6354911 L18.0860783,22.6354911 L10.945554,9.56450893 L18.0860783,0.0231026786 L12.9468508,0.0231026786 L4.53114119,11.3305804 Z" id="XMLID_31_" fill="#5E6768"></path>
<path d="M99.5029369,18.9672991 C99.305373,18.7747768 99.0770199,18.6207589 98.8127461,18.5078125 C98.5484723,18.3948661 98.2688039,18.3358259 97.9686094,18.3358259 C97.6684148,18.3358259 97.3887464,18.3922991 97.1244726,18.5078125 C96.8601988,18.6207589 96.6318457,18.7747768 96.4394134,18.9672991 C96.246981,19.1598214 96.0930351,19.3882813 95.9775756,19.6526786 C95.864682,19.9170759 95.8056694,20.194308 95.8056694,20.484375 C95.8056694,20.7847098 95.8621162,21.0645089 95.9775756,21.3237723 C96.0904693,21.5830357 96.2444152,21.8089286 96.4394134,22.0040179 C96.6318457,22.1965402 96.8601988,22.350558 97.1244726,22.4635045 C97.3887464,22.5764509 97.6684148,22.6354911 97.9686094,22.6354911 C98.2688039,22.6354911 98.5484723,22.5790179 98.8127461,22.4635045 C99.0770199,22.350558 99.305373,22.1965402 99.5029369,22.0040179 C99.7005008,21.8114955 99.8544467,21.5856027 99.9699061,21.3237723 C100.0828,21.0645089 100.141812,20.7847098 100.141812,20.484375 C100.141812,20.194308 100.085366,19.9145089 99.9699061,19.6526786 C99.8570125,19.3882813 99.7005008,19.1598214 99.5029369,18.9672991 L99.5029369,18.9672991 Z" id="XMLID_32_" fill="#5E6768"></path>
<path d="M23.5768156,0.693080357 C23.3792517,0.500558036 23.1508986,0.346540179 22.8866248,0.23359375 C22.622351,0.120647321 22.3426826,0.0616071429 22.0424881,0.0616071429 C21.7422936,0.0616071429 21.4626252,0.118080357 21.1983514,0.23359375 C20.9340776,0.346540179 20.7057245,0.500558036 20.5132921,0.693080357 C20.3208597,0.885602679 20.1669138,1.1140625 20.0514544,1.37845982 C19.9385607,1.64285714 19.8795481,1.92008929 19.8795481,2.21015625 C19.8795481,2.51049107 19.9359949,2.79029018 20.0514544,3.04955357 C20.164348,3.30881696 20.3182939,3.53470982 20.5132921,3.72979911 C20.7057245,3.92232143 20.9340776,4.07633929 21.1983514,4.18928571 C21.4626252,4.30223214 21.7422936,4.36127232 22.0424881,4.36127232 C22.3426826,4.36127232 22.622351,4.30479911 22.8866248,4.18928571 C23.1508986,4.07377232 23.3792517,3.92232143 23.5768156,3.72979911 C23.7743795,3.53727679 23.9283255,3.31138393 24.0437849,3.04955357 C24.1566786,2.79029018 24.2156911,2.51049107 24.2156911,2.21015625 C24.2156911,1.92008929 24.1592443,1.64029018 24.0437849,1.37845982 C23.9308912,1.1140625 23.7743795,0.885602679 23.5768156,0.693080357 L23.5768156,0.693080357 Z" id="XMLID_36_" fill="#5E6768"></path>
<rect id="XMLID_37_" fill="#5E6768" x="19.8821139" y="5.74743304" width="4.33357728" height="16.888058"></rect>
<path d="M40.3697483,7.63158482 C39.6872548,6.94363839 38.8867361,6.40200893 37.9733237,6.00669643 C37.0599113,5.61395089 36.0874863,5.41629464 35.0586145,5.41629464 C34.1015841,5.41629464 33.185606,5.58828125 32.3081143,5.9296875 C31.4306227,6.27109375 30.6454985,6.75881696 29.9527419,7.38772321 L28.5338738,5.74743304 L27.494739,5.74743304 L27.494739,22.6354911 L31.7975271,22.6354911 L31.7975271,12.9862723 C31.7975271,12.5447545 31.8821973,12.1263393 32.048972,11.7335937 C32.2157468,11.3382812 32.4466656,10.994308 32.7417286,10.7016741 C33.0367916,10.4090402 33.3831699,10.1754464 33.7808635,10.0085937 C34.1811229,9.84174107 34.6044741,9.75703125 35.0586145,9.75703125 C35.4999261,9.75703125 35.9155801,9.84174107 36.3030106,10.0085937 C36.6930069,10.1780134 37.0342537,10.4090402 37.3267509,10.7016741 C37.6192481,10.994308 37.8527327,11.3408482 38.0195075,11.7335937 C38.1862822,12.1289062 38.2709524,12.5447545 38.2709524,12.9862723 L38.2709524,22.6354911 L42.5737405,22.6354911 L42.5737405,12.9862723 C42.5737405,11.9466518 42.3761766,10.9660714 41.9836146,10.0445312 C41.5910525,9.12555804 41.0522418,8.31953125 40.3697483,7.63158482 L40.3697483,7.63158482 Z" id="XMLID_38_" fill="#5E6768"></path>
<path d="M58.6841797,13.6485491 C58.2018159,13.2070313 57.632216,12.863058 56.9830774,12.6166295 C56.3339388,12.3702009 55.6386165,12.2469866 54.9022419,12.2469866 L50.4275476,12.2469866 C50.1324846,12.2469866 49.8810396,12.1391741 49.6706468,11.9235491 C49.4602541,11.7079241 49.3550577,11.4486607 49.3550577,11.143192 C49.3550577,10.8479911 49.4602541,10.5964286 49.6706468,10.3859375 C49.8810396,10.1754464 50.1324846,10.0702009 50.4275476,10.0702009 L59.1408859,10.0702009 L59.1408859,5.77823661 L50.4249818,5.77823661 C49.6783441,5.77823661 48.980456,5.91685268 48.3287517,6.19665179 C47.6770474,6.47388393 47.1100133,6.85636161 46.6276494,7.33895089 C46.1452856,7.82154018 45.7629866,8.39140625 45.4858839,9.04084821 C45.2062155,9.69285714 45.0676642,10.3910714 45.0676642,11.138058 C45.0676642,11.8850446 45.2062155,12.5832589 45.4858839,13.2352679 C45.7629866,13.8872768 46.1452856,14.4571429 46.6276494,14.9448661 C47.1100133,15.4325893 47.6796131,15.8202009 48.3287517,16.1051339 C48.980456,16.390067 49.6783441,16.53125 50.4249818,16.53125 L54.8996762,16.53125 C55.1947391,16.53125 55.4461841,16.5774554 55.6565769,16.672433 C55.8669696,16.7674107 55.972166,16.9676339 55.972166,17.2705357 C55.972166,17.5657366 55.8669696,17.8172991 55.6565769,18.0277902 C55.4461841,18.2382813 55.1947391,18.3435268 54.8996762,18.3435268 L45.0650985,18.3435268 L45.0650985,22.6329241 L54.8996762,22.6329241 C55.6360507,22.6329241 56.3288073,22.494308 56.9805117,22.2145089 C57.632216,21.9372768 58.1992501,21.5522321 58.6816139,21.0645089 C59.1639778,20.5767857 59.5488425,20.0094866 59.8310767,19.3626116 C60.1133109,18.7157366 60.2569937,18.0200893 60.2569937,17.2731027 C60.2569937,16.5363839 60.1158766,15.8587054 59.8310767,15.240067 C59.5462768,14.6214286 59.1665435,14.090067 58.6841797,13.6485491 L58.6841797,13.6485491 Z" id="XMLID_39_" fill="#5E6768"></path>
<path d="M63.4590686,5.77823661 L61.3628385,5.77823661 L61.3628385,10.0676339 L63.4590686,10.0676339 L63.4590686,15.0809152 C63.4590686,16.1205357 63.6566325,17.0985491 64.0491945,18.0149554 C64.4417566,18.9287946 64.983133,19.7322545 65.6733239,20.4202009 C66.3609489,21.1081473 67.1614676,21.6497768 68.0774458,22.0450893 C68.9908582,22.4404018 69.9684147,22.6354911 71.0101153,22.6354911 L74.2737685,22.6354911 L74.2737685,18.3460937 L71.0101153,18.3460937 C70.5585406,18.3460937 70.1326236,18.258817 69.7323643,18.0868304 C69.3321049,17.9148437 68.9857266,17.678683 68.6932294,17.3860491 C68.4007322,17.0934152 68.1672476,16.746875 68.0004728,16.3541295 C67.8311323,15.9613839 67.7490278,15.5378348 67.7490278,15.0834821 L67.7490278,10.0676339 L74.2737685,10.0676339 L74.2737685,5.77823661 L67.7490278,5.77823661 L67.7490278,0.0231026786 L63.4616343,0.0231026786 L63.4616343,5.77823661 L63.4590686,5.77823661 Z" id="XMLID_40_" fill="#5E6768"></path>
<path d="M90.314932,7.46729911 C89.9146727,7.08738839 89.4861899,6.73571429 89.0294837,6.40970982 C88.5727775,6.08370536 88.0929794,5.79877232 87.5875237,5.55747768 C87.082068,5.31618304 86.5637834,5.12622768 86.0275385,4.99017857 C85.4912936,4.85412946 84.9499172,4.78482143 84.4034092,4.78482143 C83.21546,4.78482143 82.0993521,5.00301339 81.0550857,5.43939732 C80.0108193,5.87578125 79.0948412,6.48671875 78.3122828,7.27734375 C77.5297245,8.06796875 76.9113751,9.01004464 76.4598004,10.1087054 C76.0082257,11.2073661 75.7824384,12.4138393 75.7824384,13.728125 C75.7824384,15.1373884 76.0082257,16.3926339 76.4598004,17.4964286 C76.9113751,18.6002232 77.5297245,19.5320312 78.3122828,20.2944196 C79.0948412,21.056808 80.0082536,21.636942 81.0550857,22.0373884 C82.1019179,22.4378348 83.2180257,22.6354911 84.4034092,22.6354911 C84.9499172,22.6354911 85.4887278,22.566183 86.0198412,22.4301339 C86.5509546,22.2940848 87.0666734,22.1066964 87.5721291,21.8705357 C88.0775848,21.634375 88.5573829,21.3545759 89.0140891,21.0337054 C89.4707953,20.7128348 89.9044096,20.3688616 90.314932,20.0017857 L91.9852451,22.3197545 L93.02438,22.3197545 L93.02438,5.46506696 L91.9852451,5.46506696 L90.314932,7.46729911 L90.314932,7.46729911 Z M88.3521217,15.4377232 C88.1263344,15.9896205 87.8184426,16.4773437 87.431012,16.9034598 C87.0410157,17.3295759 86.5868753,17.6709821 86.0685908,17.9276786 C85.5477404,18.184375 84.9935352,18.3127232 84.405975,18.3127232 C83.8184148,18.3127232 83.2642095,18.2126116 82.7433592,18.0123884 C82.2225089,17.8121652 81.7709342,17.5195312 81.3886352,17.1293527 C81.0037704,16.7391741 80.7035759,16.2591518 80.4829201,15.6867187 C80.2622643,15.1142857 80.1519364,14.4597098 80.1519364,13.7229911 C80.1519364,12.9862723 80.2622643,12.3316964 80.4829201,11.7592634 C80.7035759,11.1868304 81.0063362,10.706808 81.3886352,10.3166295 C81.7709342,9.92645089 82.2225089,9.63381696 82.7433592,9.43359375 C83.2642095,9.23337054 83.8184148,9.13325893 84.405975,9.13325893 C84.9935352,9.13325893 85.5477404,9.26160714 86.0685908,9.51830357 C86.5894411,9.775 87.0435815,10.1164062 87.431012,10.5425223 C87.8210083,10.9686384 88.1263344,11.4563616 88.3521217,12.0082589 C88.577909,12.5601562 88.6908027,13.1300223 88.6908027,13.7204241 C88.6908027,14.3159598 88.577909,14.8858259 88.3521217,15.4377232 L88.3521217,15.4377232 Z" id="XMLID_43_" fill="#5E6768"></path>
</g>
<rect id="_x3C_Slice_x3E_" x="0" y="1" width="122.489627" height="22.9486607"></rect>
</g>
</g>
</g>
</g>
</svg>
<nav id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">My Kinsta</a></li>
<li><a href="#">Knowledgebase</a></li>
</ul>
</nav>
</div></header>
<div id='content'><div class='row'>
<div id='welcome'>
<div id='google-cloud'><svg height="200px" viewBox="0 0 158 140" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Group 3</title>
<desc>Created with Sketch.</desc>
<defs>
<filter x="-50%" y="-50%" width="200%" height="200%" filterUnits="objectBoundingBox" id="filter-1">
<feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
<feGaussianBlur stdDeviation="0.5" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0687556612 0" in="shadowBlurOuter1" type="matrix" result="shadowMatrixOuter1"></feColorMatrix>
<feMerge>
<feMergeNode in="shadowMatrixOuter1"></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
</filter>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Artboard-1" transform="translate(-179.000000, -191.000000)">
<g id="Group-3" transform="translate(170.000000, 191.000000)">
<path d="M59.1519944,21.3057965 L30.5011973,62.5620001 L59.3300845,118.161898 L123.852293,120.260799 L147.190791,67.2241348 L124.676141,17.2049116 L59.1519944,21.3057965 Z M88.9582057,90.3554398 C100.421933,90.3554398 109.71512,81.071028 109.71512,69.6181257 C109.71512,58.1652234 100.421933,48.8808117 88.9582057,48.8808117 C77.4944782,48.8808117 68.201291,58.1652234 68.201291,69.6181257 C68.201291,81.071028 77.4944782,90.3554398 88.9582057,90.3554398 Z" id="Combined-Shape" fill="#EFEFEF" filter="url(#filter-1)"></path>
<path d="M0.486164197,98.3957855 C0.486164197,98.3957855 20.6732427,62.3917304 22.4346902,59.7049849 C24.1961378,57.0182393 29.3403895,55.4985041 29.3403895,55.4985041 C29.3403895,55.4985041 93.6674638,55.0009732 100.046526,55.4985041 C106.425588,55.996035 108.922076,61.4198347 108.922076,61.4198347 L121.22188,83.6420017 L40.7142694,83.6420017 L16.5452623,126.040042 L0.486164197,98.3957855 Z" id="Path-43" fill="#FFCF36" transform="translate(60.854022, 90.658710) scale(-1, -1) rotate(-300.000000) translate(-60.854022, -90.658710) "></path>
<path d="M59.7916346,90.9896019 C59.7916346,90.9896019 79.9787131,54.9855468 81.7401607,52.2988013 C83.5016082,49.6120557 88.6458599,48.0923205 88.6458599,48.0923205 C88.6458599,48.0923205 152.972934,47.5947896 159.351996,48.0923205 C165.731058,48.5898514 168.227546,54.0136511 168.227546,54.0136511 L180.52735,76.2358181 L100.01974,76.2358181 L75.8507328,118.633858 L59.7916346,90.9896019 Z" id="Path-43" fill="#DE4737" transform="translate(120.159493, 83.252527) rotate(-240.000000) translate(-120.159493, -83.252527) "></path>
<path d="M23.7221882,43.1184062 C23.7221882,43.1184062 43.9092667,7.11435114 45.6707142,4.42760561 C47.4321618,1.74086008 52.5764135,0.22112484 52.5764135,0.22112484 C52.5764135,0.22112484 116.903488,-0.276406051 123.28255,0.221124842 C129.661612,0.718655735 132.1581,6.14245541 132.1581,6.14245541 L144.457904,28.3646225 L63.9502934,28.3646225 L40.463025,69.4105501 L23.7221882,43.1184062 Z" id="Path-43" fill="#4A8AF8"></path>
</g>
</g>
</g>
</svg></div>
<div id='text'>
<h1>Welcome to Google Cloud</h1>
<p>Your Kinsta hosted website is now running on the world's largest network.</p>
</div>
</div>
</div></div>
<script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
<script type='text/javascript'>
function calc_left_for_centering( element ) {
var width = element.outerWidth();
var windowWidth = $(window).width();
var requiredOffset = ( windowWidth - width ) / 2;
return requiredOffset;
}
function logoAnimation() {
gcloud.e.fadeIn( 1000, function() {
gcloud.e.animate({
left: gcloud.left + 'px'
}, 700 );
});
}
function textAnimation() {
$('#text').fadeIn(1000)
}
function headerAnimation() {
$('header').animate({
top: 0
})
}
var gcloud = {
e : $('#google-cloud'),
left: $('#google-cloud').offset().left,
};
var text = {
e : $('#text'),
left: gcloud.left + gcloud.e.width(),
width: $('#text').width(),
top: $('#text').offset().top
}
var header = {
e: $('header'),
height: $('header').outerHeight()
}
var windowHeight = $(window).height();
var topOffset = ( windowHeight - gcloud.e.height() ) / 2;
gcloud.e.hide();
gcloud.e.css({
'position' : 'absolute',
'left' : calc_left_for_centering( gcloud.e ),
'visibility' : 'visible',
'top' : topOffset
});
text.e.hide();
text.e.css({
'position' : 'absolute',
'visibility' : 'visible',
'left' : text.left,
'width' : text.width,
'top' : text.top + topOffset
});
header.e.css({
'visibility' : 'visible',
'top' : '-' + header.height + 'px'
})
logo = setTimeout(logoAnimation, 400);
text = setTimeout(textAnimation, 2300);
header = setTimeout(headerAnimation, 4000);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment