xrfragment/example/assets/style.css

124 lines
2.1 KiB
CSS
Raw Normal View History

2023-04-21 12:37:23 +02:00
:root {
--primary: #6839dc;
--light-primary: #ea23cf;
--secondary: #872eff;
--light-secondary: #ce7df2;
--red: red;
--black: #424280;
--white: #fdfdfd;
--dark-gray: #343334;
--gray: #ecf7ff47;
--light-gray: #efefef;
--lighter-gray: #e4e2fb96;
--font-sans-serif: system-ui, -apple-system, segoe ui, roboto, ubuntu, helvetica, cantarell, noto sans, sans-serif;
--font-monospace: menlo, monaco, lucida console, liberation mono, dejavu sans mono, bitstream vera sans mono, courier new, monospace, serif;
--border-radius: 0.2rem;
}
.small{
font-size:12px;
}
2023-04-21 17:36:03 +02:00
textarea, select, input[type="text"] {
2023-04-28 16:04:32 +02:00
background: transparent; /* linear-gradient( var(--lighter-gray), var(--gray) ) !important; */
2023-04-21 12:37:23 +02:00
}
2023-04-21 17:36:03 +02:00
input[type="submit"] {
color: var(--light-gray);
}
2023-04-21 12:37:23 +02:00
.title {
border-bottom: 2px solid var(--secondary);
padding-bottom: 20px;
}
2023-04-21 17:36:03 +02:00
#overlay{
background: #FFF;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 48px;
box-shadow: 0px 0px 10px #0004;
opacity: 0.9;
}
#overlay .logo{
width: 92px;
position: absolute;
top: 7px;
left: 93px;
}
#overlay > input[type="submit"]{
height: 32px;
font-size: 14px;
position: absolute;
right: 9px;
top: 8px;
}
2023-04-28 16:04:32 +02:00
#overlay > #uri {
2023-04-28 16:04:32 +02:00
height: 29px;
font-size: 14px;
position: absolute;
left: 200px;
2023-04-28 16:04:32 +02:00
top: 9px;
max-width:550px;
padding: 5px 0px 5px 5px;
width: calc( 63% - 200px);
2023-04-28 16:04:32 +02:00
background: #f0f0f0;
border-color: #Ccc;
}
a#source{
position: absolute;
2023-05-08 12:46:33 +02:00
bottom: 29px;
right: 20px;
color: #888;
font-weight: bold;
font-family: sans-serif;
text-decoration: underline;
2023-05-04 17:00:55 +02:00
z-index:2000;
}
2023-05-08 12:46:33 +02:00
a#model{
position: absolute;
bottom: 29px;
right: 130px;
color: #888;
font-weight: bold;
font-family: sans-serif;
text-decoration: underline;
z-index:2000;
}
2023-05-04 17:00:55 +02:00
.render {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
}
2023-05-04 19:54:44 +02:00
.lil-gui.autoPlace{
right:0px !important;
2023-05-04 21:28:12 +02:00
top:auto !important;
bottom:0;
}
#VRButton {
margin-bottom:20vh;
}
@media (max-width: 450px) {
#uri{ display:none; }
}
2023-05-04 21:28:12 +02:00
@media (max-width: 640px) {
.lil-gui.root{
top:auto !important;
left:auto !important;
}
2023-05-04 19:54:44 +02:00
}