Spaces:
Running
on
CPU Upgrade
Running
on
CPU Upgrade
.main { | |
@media only screen and (min-width: 1000px) { | |
width: 70% ; | |
margin: 0 auto; /* Center the container */ | |
} | |
} | |
.small-font{ | |
font-size: 12pt ; | |
transition: font-size 0.4s ease-out; | |
transition-delay: 0.8s; | |
} | |
.small-font:hover { | |
font-size: 20px ; | |
transition: font-size 0.3s ease-out; | |
transition-delay: 1.5s; | |
} | |
.group { | |
padding-top: 10px; | |
padding-left: 10px; | |
padding-right: 10px; | |
padding-bottom: 10px; | |
border: 2px dashed gray; | |
border-radius: 20px; | |
box-shadow: 5px 3px 10px 1px rgba(0, 0, 0, 0.4) ; | |
} | |
.accordion > button > span{ | |
font-size: 12pt ; | |
} | |
.accordion { | |
border-style: dashed ; | |
border-left-width: 2px ; | |
border-bottom-width: 2.5px ; | |
border-top: none ; | |
border-right: none ; | |
box-shadow: none ; | |
} | |
.no-gap { | |
gap: 0px; | |
} | |
.no-radius { | |
border-radius: 0px; | |
} | |
.textbox-no-label > label > span { | |
display: none; | |
} | |
.exp-type > span { | |
display: none; | |
} | |
.conv-type > span { | |
display: none; | |
} | |
.conv-type .wrap:nth-child(3) { | |
width: 167px; | |
margin: auto; | |
} | |
button { | |
font-size: 10pt ; | |
} | |
h3 { | |
font-size: 13pt ; | |
} | |
#control-panel { | |
margin-bottom: 30px; | |
} | |
#chatbot { | |
background-color: white; | |
border: 1px solid #ccc; | |
padding: 20px; | |
box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.3); | |
border-radius: 30px; | |
height: 80%; | |
width: 80%; | |
position: fixed; | |
top: 50%; | |
left: 50%; | |
transform: translate(-50%, -50%); | |
z-index: 1000; /* Or a high enough value to stay on top */ | |
@media (max-width: 768px) { /* Adjust this breakpoint as needed */ | |
width: 95%; | |
} | |
@media (prefers-color-scheme: dark) { | |
background-color: dimgrey; | |
} | |
} | |
#chat-button { | |
border-radius: 30px; | |
font-size: 13pt ; | |
@media only screen and (min-width: 500px) { | |
font-size: 10pt; | |
margin: auto; /* Center the container */ | |
} | |
} | |
#chatbot-inside { | |
height: 500px ; | |
border-width: 1px ; | |
border-color: lightgray ; | |
} | |
#chatbot-txtbox { | |
padding-bottom: 25px; | |
} | |
#chatbot-bottm { | |
padding-left: 10px; | |
padding-right: 10px; | |
} | |
#chatbot-right-button { | |
float: right; | |
width: 20px; | |
font-size: 17pt; | |
} | |
#chatbot-info { | |
word-break: break-word; | |
} | |
#chatbot-back { | |
position: absolute; /* Stay in place even when scrolling */ | |
z-index: 1000; /* Ensure it's on top of everything else */ | |
width: 100%; | |
height: 100%; | |
left: 0px; | |
top: 0px; | |
opacity: 0; | |
visibility: hidden; /* Ensures the element is not interactive */ | |
transition: opacity 0.5s ease, visibility 0s 0.5s; /* Transition for opacity and delay visibility */ | |
} | |
#chatbot-back.visible { | |
opacity: 1; | |
visibility: visible; /* Now visible and interactive */ | |
transition: opacity 0.5s ease; /* Smooth transition for opacity */ | |
} | |
.hover-opacity { | |
opacity: 0.8; /* Normal opacity of the element */ | |
transition: opacity 0.3s ease-in-out; /* Smooth opacity change */ | |
} | |
.hover-opacity:hover { | |
opacity: 1; /* Full opacity on hover */ | |
} | |
.markdown-center { | |
display: block; | |
text-align: center; | |
} | |
#link-md { | |
display: flex; | |
justify-content: space-around; | |
} | |
#link-md a { | |
display: inline-block; | |
vertical-align: middle; | |
} | |
#link-md a { | |
display: inline-block; | |
vertical-align: middle; | |
} | |
#link-md a:nth-child(1) { | |
margin-right: 10px; | |
@media only screen and (max-width: 1000px) { | |
margin-right: 0px; | |
} | |
} | |
#link-md a:nth-child(2) { | |
margin-left: 10px; | |
@media only screen and (max-width: 1000px) { | |
margin-left: 0px; | |
} | |
} | |
#duplicate-button { | |
margin: auto; | |
color: white; | |
background: #1565c0; | |
border-radius: 100vh; | |
} |