klassen statt IDs
This commit is contained in:
parent
f338b47902
commit
5899a3a255
2 changed files with 14 additions and 14 deletions
14
index.html
14
index.html
|
@ -24,14 +24,14 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="uhr">
|
<div id="uhr" class="uhr">
|
||||||
<span class="item dot dot1" id="dot1"></span>
|
<span class="item dot dot1"></span>
|
||||||
<span class="item dot dot2" id="dot2"></span>
|
<span class="item dot dot2"></span>
|
||||||
<span class="item dot dot3" id="dot3"></span>
|
<span class="item dot dot3"></span>
|
||||||
<span class="item dot dot4" id="dot4"></span>
|
<span class="item dot dot4"></span>
|
||||||
<div id="renderarea"></div>
|
<div id="renderarea" class="renderarea"></div>
|
||||||
<!-- glossy reflection -->
|
<!-- glossy reflection -->
|
||||||
<span id="reflection"></span>
|
<span class="reflection"></span>
|
||||||
</div>
|
</div>
|
||||||
<select id="themeswitcher">
|
<select id="themeswitcher">
|
||||||
<option value="black">Schwarz</option>
|
<option value="black">Schwarz</option>
|
||||||
|
|
14
uhr.css
14
uhr.css
|
@ -19,7 +19,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
body {
|
body {
|
||||||
font-family: 'Uhrenfont', sans-serif;
|
font-family: 'Uhrenfont', sans-serif;
|
||||||
}
|
}
|
||||||
#uhr {
|
.uhr {
|
||||||
padding: 3em;
|
padding: 3em;
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -27,7 +27,7 @@ body {
|
||||||
height: 40em;
|
height: 40em;
|
||||||
transition: background-color 0.5s;
|
transition: background-color 0.5s;
|
||||||
}
|
}
|
||||||
#reflection {
|
.uhr .reflection {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
|
@ -39,7 +39,7 @@ body {
|
||||||
}
|
}
|
||||||
#themeswitcher {
|
#themeswitcher {
|
||||||
}
|
}
|
||||||
#renderarea {
|
.uhr .renderarea {
|
||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 5em;
|
top: 5em;
|
||||||
|
@ -63,19 +63,19 @@ body {
|
||||||
border-color: #eee;
|
border-color: #eee;
|
||||||
box-shadow: 0 0 0.2em #eee;
|
box-shadow: 0 0 0.2em #eee;
|
||||||
}
|
}
|
||||||
#dot1 {
|
.dot1 {
|
||||||
top: 1.5em;
|
top: 1.5em;
|
||||||
left: 1.5em;
|
left: 1.5em;
|
||||||
}
|
}
|
||||||
#dot2 {
|
.dot2 {
|
||||||
top: 1.5em;
|
top: 1.5em;
|
||||||
right: 1.5em;
|
right: 1.5em;
|
||||||
}
|
}
|
||||||
#dot3 {
|
.dot3 {
|
||||||
bottom: 1.5em;
|
bottom: 1.5em;
|
||||||
right: 1.5em;
|
right: 1.5em;
|
||||||
}
|
}
|
||||||
#dot4 {
|
.dot4 {
|
||||||
bottom: 1.5em;
|
bottom: 1.5em;
|
||||||
left: 1.5em;
|
left: 1.5em;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue