Clean Up the Contributing Documentation and Process: Part VII.LXVI.II

* Fix the indentation in the clock CSS.
This commit is contained in:
Nicholas Hubbard 2016-09-08 15:51:58 -04:00 committed by GitHub
parent 4e91919990
commit 0ca903a146

View File

@ -5,70 +5,70 @@
} }
.clockCircle { .clockCircle {
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
border-radius: 50%; border-radius: 50%;
background-size: 100%; background-size: 100%;
} }
.clockFace { .clockFace {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.clockFace:after { .clockFace:after {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
width: 6px; width: 6px;
height: 6px; height: 6px;
margin: -3px 0 0 -3px; margin: -3px 0 0 -3px;
background: white; background: white;
border-radius: 3px; border-radius: 3px;
content: ""; content: "";
display: block; display: block;
} }
.clockHour { .clockHour {
width: 0; width: 0;
height: 0; height: 0;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -2px 0 -2px -25%; /* numbers much match negative length & thickness */ margin: -2px 0 -2px -25%; /* numbers much match negative length & thickness */
padding: 2px 0 2px 25%; /* indicator length & thickness */ padding: 2px 0 2px 25%; /* indicator length & thickness */
background: white; background: white;
-webkit-transform-origin: 100% 50%; -webkit-transform-origin: 100% 50%;
-ms-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%;
transform-origin: 100% 50%; transform-origin: 100% 50%;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
} }
.clockMinute { .clockMinute {
width: 0; width: 0;
height: 0; height: 0;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -35% -2px 0; /* numbers must match negative length & thickness */ margin: -35% -2px 0; /* numbers must match negative length & thickness */
padding: 35% 2px 0; /* indicator length & thickness */ padding: 35% 2px 0; /* indicator length & thickness */
background: white; background: white;
-webkit-transform-origin: 50% 100%; -webkit-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%;
transform-origin: 50% 100%; transform-origin: 50% 100%;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
} }
.clockSecond { .clockSecond {
width: 0; width: 0;
height: 0; height: 0;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
margin: -38% -1px 0 0; /* numbers must match negative length & thickness */ margin: -38% -1px 0 0; /* numbers must match negative length & thickness */
padding: 38% 1px 0 0; /* indicator length & thickness */ padding: 38% 1px 0 0; /* indicator length & thickness */
background: #888888; background: #888888;
-webkit-transform-origin: 50% 100%; -webkit-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%;
transform-origin: 50% 100%; transform-origin: 50% 100%;
} }