<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="dist/circletype.min.js"></script>
+ <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
<title>Antifa Generator</title>
</head>
<body>
<section class="logo">
- <h2 class="logo-text" id="antifa-group"> Grupo </h2>
- <h2 class="logo-text" id="antifa"> Antifacistas </h2>
+ <div id="top-text">
+ <h2 class="logo-text" id="antifa-group"> Desenvolvedores </h2>
+ </div>
+ <div id="bottom-text">
+ <h2 class="logo-text" id="antifa"> Antifacistas </h2>
+ </div>
</section>
<script>
const antifaGroup = document.getElementById('antifa-group')
const antifa = document.getElementById('antifa')
- const radius = 500;
+ const logo = document.getElementsByClassName('logo')[0]
+ const radius = logo.offsetHeight / 2;
+ console.log('radius :>> ', radius);
new CircleType(antifaGroup)
.radius(radius);
display: flex;
margin: 0;
color: white;
- font-size: 50px;
+ font-size: 80px;
padding: 1%;
+ font-family: 'Roboto', sans-serif;
+ text-transform: capitalize;
}
-#antifa-group {
+#top-text {
padding-left: 50%;
}
-#antifa {
+#bottom-text {
+ /* padding-top: 80%; */
align-self: flex-end;
}
projects / antifa-generator.git / commitdiff