franpcode/Visit-counter
1
0
Fork 0
mirror of https://github.com/FranP-code/Visit-counter.git synced 2025-10-12 23:52:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Hecho el CSS principal

Browse Source
This commit is contained in:
Francisco P
2021-05-23 11:50:11 -03:00
parent 6a4f5ba928
commit f0e1ac99ec
2 changed files with 65 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
index.php
View File

@@ -2,6 +2,8 @@
require 'logic.php'; require 'logic.php';
$c = 665;
?> ?>
<!DOCTYPE html> <!DOCTYPE html>
@@ -15,12 +17,10 @@ require 'logic.php';
<link rel="stylesheet" href="normalize.css"> <link rel="stylesheet" href="normalize.css">
</head> </head>
<body> <body>
<div class="container">
<div class="blue-circle"> <div class="blue-circle">
<div class="gray-rectangle"> <div class="gray-rectangle">
<h2 class="visits">VISITAS</h2> <h2 class="visits">VISITAS</h2>
<h2 class="amount"><?php $c ?></h2> <h2 class="amount"><?php echo $c ?></h2>
</div>
</div> </div>
</div> </div>
</body> </body>

62
style.css
View File

@@ -1,3 +1,65 @@
* { * {
margin: 0; margin: 0;
}
html, body {
height: 100%;
}
body {
background-color: #2C3338;
font-family: Arial, Helvetica, sans-serif;
position: relative;
}
.blue-circle {
background-color: #578EB7;
/* */
position: relative;
top: 50%;
left: 50%;
margin: -250px 0 0 -250px; /* Half of the width*/
/* Credits: https://www.freecodecamp.org/news/how-to-center-anything-with-css-align-a-div-text-and-more/
/* */
width: 500px;
height: 500px;
border-radius: 100%;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
-ms-border-radius: 100%;
-o-border-radius: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.gray-rectangle {
width: 40%;
height: 40%;
background-color: #C4C4C4;
border-radius: 10%;
-webkit-border-radius: 10%;
-moz-border-radius: 10%;
-ms-border-radius: 10%;
-o-border-radius: 10%;
}
h2 {
text-align: center;
/* padding-top: 40px;*/
color: #2C3338;
font-weight: bolder;
}
.visits {
padding-top: 40px;
}
.amount {
padding-top: 20px;
font-size: 25pt;
} }