this repo has no description
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

looks pretty good?

alice d789d86c d382890d

+102 -14
+7 -2
index.html
··· 14 14 <div id="page-container"> 15 15 <div id="content-wrap"> 16 16 <div id="content"></div> 17 - <a id="tweetit" href="#"><img src="twitter.png" alt="twitter logo" width="0.8%" height="0.8%" /> tweet it</a> 18 - <button id="newplsuwu">can i have a new one? 🥺</button> 17 + <center> 18 + <a id="newplsuwu" href="#" class="button">can i have a new one? 🥺</a> 19 + <!-- <a id="tweetit" href="#"><img src="twitter.png" alt="twitter logo" width="20px" height="17px" /></a> --> 20 + <div class="twitter-btn"> 21 + <a href="#"><i></i> <span>Tweet</span></a> 22 + </div> 23 + </center> 19 24 </div> 20 25 <footer id="footer"> 21 26 created by <a href="https://twitter.com/__justplaying">alice</a>, inspired by
+90 -9
main.css
··· 1 1 body { 2 2 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif; 3 - } 4 - 5 - img { 6 - display: inline-block; 3 + line-height: 1.2; 7 4 } 8 5 9 6 #page-container { ··· 11 8 min-height: 100vh; 12 9 } 13 10 14 - #page-container { 11 + #content { 12 + font-size: 2.5rem; 13 + font-weight: bold; 14 + padding-bottom: 50px; 15 + } 16 + 17 + /* #tweetit { 18 + display: block; 19 + padding-top: 10px; 20 + } */ 21 + 22 + /* twitter button */ 23 + .twitter-btn { 24 + margin: 10px; 25 + width: 76px; 26 + display: block; 27 + text-align: left; 28 + white-space: nowrap; 29 + zoom: 1; 30 + font-size: 13px; 31 + line-height: 26px; 32 + font-family: "Helvetica Neue", Arial, sans-serif; 33 + } 34 + .twitter-btn a { 35 + height: 28px; 36 + padding: 1px 10px 1px 9px; 37 + border-radius: 4px; 38 + position: relative; 39 + font-weight: 500; 40 + color: #fff; 41 + cursor: pointer; 42 + background-color: #1da1f2; 43 + border-radius: 3px; 44 + box-sizing: border-box; 45 + display: inline-block; 46 + text-decoration: none; 47 + } 48 + /* .twitter-btn a:hover { 49 + background-color: #0c7abf; 50 + } */ 51 + .twitter-btn a i { 52 + width: 18px; 53 + height: 18px; 54 + top: 4px; 55 + position: relative; 56 + display: inline-block; 57 + background: transparent 0 0 no-repeat; 58 + background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E); 59 + } 60 + .twitter-btn a span { 61 + margin-left: 4px; 62 + white-space: nowrap; 63 + display: inline-block; 64 + vertical-align: top; 65 + zoom: 1; 15 66 } 16 67 17 - #content { 18 - font-size: 4rem; 19 - font-weight: bold; 68 + a.button { 69 + display: inline-block; 70 + padding: 0.3em 0.6em; 71 + border: 0.16em solid #000; 72 + margin: 0; 73 + box-sizing: border-box; 74 + text-decoration: none; 75 + font-size: 0.8rem; 76 + font-weight: 400; 77 + color: #000; 78 + text-align: center; 79 + transition: all 0.15s; 80 + } 81 + /* a.button:hover { 82 + color: #1da1f2; 83 + border-color: #1da1f2; 20 84 } 85 + a.button:active { 86 + color: #1da1f2; 87 + border-color: #1da1f2; 88 + } */ 89 + /* 90 + @media only screen and (max-width: 480px) { 91 + * { 92 + color: #ff00ff; 93 + } 94 + } */ 95 + /* @media all and (max-device-width: 812px) { 96 + a.button { 97 + display: block; 98 + margin: 0.4em auto; 99 + font-size: 0.5rem; 100 + } 101 + } */ 21 102 22 103 #content-wrap { 23 104 position: absolute; 24 - top: 20%; 105 + top: 30%; 25 106 left: 50%; 26 107 text-align: center; 27 108 -moz-transform: translateX(-50%) translateY(-50%);
+5 -3
main.js
··· 6 6 const randomable = ble[Math.floor(Math.random() * ble.length)]; 7 7 const output = `${randomive} and ${randomable}`; 8 8 document.querySelector("#content").innerHTML = output; 9 - document.querySelector("#tweetit").addEventListener("click", () => { 9 + document.querySelector(".twitter-btn").addEventListener("click", (event) => { 10 + event.preventDefault(); 10 11 window.open(`https://twitter.com/intent/tweet?text=i%27m%20${output}%20🥺&url=${self}`, "_blank"); 11 12 }); 12 13 }; 13 14 14 - document.addEventListener("DOMContentLoaded", function (event) { 15 + document.addEventListener("DOMContentLoaded", (event) => { 15 16 iveble(); 16 - document.querySelector("#newplsuwu").addEventListener("click", function () { 17 + document.querySelector("#newplsuwu").addEventListener("click", (event) => { 17 18 iveble(); 19 + event.preventDefault(); 18 20 }); 19 21 });