Move style out of html

This commit is contained in:
Imbus 2023-11-01 10:55:13 +01:00
parent 51120ac303
commit 05050e07ea
2 changed files with 177 additions and 161 deletions

View file

@ -10,24 +10,6 @@
<LINK href="style.css" rel="stylesheet" type="text/css">
<title>TC Automotives</title>
<style>
#b1:hover {
background-image: url("resources/car.png");
}
#b2:hover {
background-image: url("resources/sketch.png");
}
#b3:hover {
background-image: url("resources/cogs.png");
}
#b4:hover {
background-image: url("resources/track.png");
}
</style>
<body>
<div id="menu">
<div id="buttonholder">

View file

@ -13,7 +13,8 @@ background-image:url("resources/carcbonbg.jpg");
position: fixed;
height: 100%;
vertical-align: center;
width:15%;--300px;
width: 15%;
/* --300px; */
left: 0;
border-right: 1px solid black;
background: rgb(160, 0, 0);
@ -34,6 +35,7 @@ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a00000', end
height: auto;
width: auto;
}
.button {
width: 100%;
height: 5%;
@ -59,15 +61,20 @@ font-family:race;
font-size: 250%;
text-shadow: 1px 1px #606060;
-box-shadow: inset 0 0 100px #000000;
cursor: pointer; cursor: hand;
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
cursor: pointer;
cursor: hand;
-webkit-user-select: none;
/* Chrome/Safari */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* IE10+ */
background-repeat: no-repeat;
background-size: 100%;
margin-bottom: -2;
overflow: hidden;
}
.button:hover {
height: 20%;
box-shadow: inset 0 0 100px #000000;
@ -91,8 +98,10 @@ background-position:45% 30%;
-moz-transition: all 1s ease-out;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
cursor: pointer; cursor: hand;
cursor: pointer;
cursor: hand;
}
#eagle:hover {
background-image: url('resources/eagleover.png');
}
@ -134,6 +143,7 @@ top:0px;
transition: all 1s ease-out;
opacity: 50%;
}
#bar:hover {
-height: 100%;
}
@ -150,6 +160,7 @@ left:0px;
transition: all 2s ease-out;
opacity: 50%;
}
#bar2:hover {
width: 100%;
}
@ -185,10 +196,12 @@ opacity: 1;
-o-transition: all 1s ease-out;
transition: all 1s ease-out;
}
#swrapper:hover {
opacity: 0.5;
background-size: 55%;
}
#panel {
position: absolute;
margin: auto;
@ -199,7 +212,12 @@ width:200px;
background: black;
}
#dropshadowbg {position:absolute;width:100%;height:100%;box-shadow: inset 0 0 200px #000000;}
#dropshadowbg {
position: absolute;
width: 100%;
height: 100%;
box-shadow: inset 0 0 200px #000000;
}
#logo {
position: absolute;
@ -210,3 +228,19 @@ height:300;
background-image: url("resources/logo.png");
background-repeat: no-repeat;
}
#b1:hover {
background-image: url("resources/car.png");
}
#b2:hover {
background-image: url("resources/sketch.png");
}
#b3:hover {
background-image: url("resources/cogs.png");
}
#b4:hover {
background-image: url("resources/track.png");
}