demo-visite-virtuelle / .history /style /property_info_20241130022457.css
Natha1627
Initial commit
3b6bb5e
raw
history blame
5 kB
/* Details Section */
/* Conteneur principal */
.info-tab {
position: fixed;
top: 50%;
left: 0;
transform: translateY(-50%);
display: flex;
align-items: center;
transition: transform 0.3s ease;
z-index: 1000;
}
/* Bouton de l'onglet */
.info-toggle {
background-color: var(--primary-color);
color: var(--neutral-color);
border: none;
border-radius: 0 5px 5px 0;
padding: 10px;
cursor: pointer;
box-shadow: var(--box-shadow);
transition: background-color 0.3s ease;
}
.info-toggle:hover {
background-color: var(--secondary-color);
}
/* Carte des informations */
.info-card {
background-color: var(--neutral-color);
color: var(--bg-color);
box-shadow: var(--box-shadow);
border-radius: 10px;
width: 300px;
padding: 15px;
transform: translateX(-100%);
transition: transform 0.3s ease;
display: flex;
flex-direction: column;
gap: 10px;
}
/* Carte visible */
.info-tab.open .info-card {
transform: translateX(0);
}
/* Bouton de fermeture */
.info-tab.open .info-toggle {
transform: rotate(180deg);
}
#property-details {
/* Style Sources */
width: 30svw;
display: flex;
flex-direction: column;
align-items: stretch;
justify-content: center;
flex-grow: 1;
flex-shrink: 0;
align-self: stretch;
min-width: 30svw;
max-width: max-content;
padding: 10px;
/* Cascaded */
background-color: rgba(255, 255, 255, 0.87);
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-bottom-style: none;
border-top-color: rgba(106, 55, 146, 0.87);
border-right-color: rgba(106, 55, 146, 0.87);
border-bottom-color: rgba(106, 55, 146, 0.87);
border-left-color: rgba(106, 55, 146, 0.87);
border-top-left-radius: 15px;
border-top-right-radius: 15px;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.2);
margin: 5px;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
box-sizing: border-box;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
outline-width: 1px;
}
.details-card {
/* Style Sources */
display: flex;
flex-direction: column;
flex-grow: 1;
flex-shrink: 0;
align-self: stretch;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
box-sizing: border-box;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
outline-width: 1px;
}
.property-title{
/* Style Sources */
align-self: auto;
flex-grow: 1;
flex-shrink: 0;
width: 100%;
min-width: 100%;
order: 0;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
display: contents;
white-space: normal;
white-space-collapse: collapse;
}
#property-info{
/* Style Sources */
flex-grow: 1;
flex-shrink: 0;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
box-sizing: border-box;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
outline-width: 1px;
}
.technical-info{
/* Style Sources */
align-self: auto;
flex-grow: 1;
flex-shrink: 0;
width: 100%;
min-width: 100%;
order: 0;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
display: contents;
white-space: normal;
white-space-collapse: collapse;
}
#description-container{
/* Style Sources */
flex-grow: 1;
flex-shrink: 0;
align-self: stretch;
min-width: 100svw;
max-width: none;
padding: 10px;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
box-sizing: border-box;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
outline-width: 1px;
}
.description{
justify-content: start;
flex-direction: column;
height: 100%;
min-height: 100%;
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
box-sizing: border-box;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
outline-width: 1px;
}
#text-description{
/* Inherited */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* Preset */
display: contents;
white-space: normal;
white-space-collapse: collapse;
}
#description-content{
display: flex;
}