/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/ComplexViewMode/widgets/HomeItem.vue?vue&type=style&index=0&id=893c1aa6&scoped=true&lang=scss ***! \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .homeItem[data-v-893c1aa6] { position: relative; width: 100%; min-height: 521px; display: flex; flex-direction: column; justify-content: flex-start; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.05); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); border-radius: 4px; } .homeItem__image[data-v-893c1aa6] { display: flex; align-items: center; justify-content: center; width: 100%; height: 250px; } .homeItem__image img[data-v-893c1aa6] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .homeItem__image .no-image[data-v-893c1aa6] { width: 32px; height: 32px; } .homeItem__floorInfo[data-v-893c1aa6] { display: flex; position: absolute; gap: 4px; top: 10px; left: 10px; } .homeItem__floorInfo div[data-v-893c1aa6] { background-color: #fff; border-radius: 2px; border: 1px solid rgba(168, 172, 180, 0.231372549); font-size: 12px; line-height: 24px; white-space: nowrap; padding: 0 4px; } .homeItem__content[data-v-893c1aa6] { width: 100%; background-color: rgba(255, 255, 255, 0.85); display: flex; flex-direction: column; justify-content: center; align-items: center; row-gap: 10px; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-bottom: 16px; } .homeItem__rooms[data-v-893c1aa6] { font-size: 16px; width: 100%; display: flex; flex-direction: column; gap: 8px; border-top: 1px solid #cfd8e1; padding: 16px; margin-top: 8px; } .homeItem__roomItem[data-v-893c1aa6] { display: flex; justify-content: space-between; cursor: pointer; } .homeItem__roomItem > div[data-v-893c1aa6] { display: flex; align-items: center; gap: 5px; } .homeItem__roomItem > div > div[data-v-893c1aa6]:nth-child(1) { font-weight: bold; letter-spacing: 0.25px; font-size: 14px; } .homeItem__roomItem[data-v-893c1aa6]:hover { color: #43a047; } .homeItem__desc[data-v-893c1aa6] { width: 100%; padding: 16px 16px 0 16px; display: flex; flex-direction: column; gap: 8px; } .homeItem__descComplex[data-v-893c1aa6], .homeItem__houseAddress[data-v-893c1aa6] { font-size: 14px; max-width: 250px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 20px; letter-spacing: 0.28px; } .homeItem__houseName[data-v-893c1aa6] { font-size: 24px; line-height: 24px; border-bottom: 1px solid; width: -moz-max-content; width: max-content; letter-spacing: 0.48px; padding-bottom: 3px; margin-bottom: 20px; } .homeItem__nav[data-v-893c1aa6] { position: relative; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); width: 100%; height: 64px; display: flex; justify-content: center; align-items: center; -moz-column-gap: 8px; column-gap: 8px; } .homeItem__nav button[data-v-893c1aa6] { display: flex; justify-content: center; align-items: center; border: 1px solid #dedede; padding: 8px; border-radius: 3px; } /*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/ComplexViewMode/widgets/ListHome.vue?vue&type=style&index=0&id=635d3338&scoped=true&lang=scss ***! \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .loader-div[data-v-635d3338] { margin-left: 45%; margin-right: 50%; margin-top: 30px; margin-bottom: 30px; } .loader-div img[data-v-635d3338] { width: 150px; max-width: none; } .listHome[data-v-635d3338] { width: 100%; height: auto; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .listHome__title[data-v-635d3338] { width: 100%; font-size: 32px; padding: 20px; border-bottom: 1px solid; --tw-border-opacity: 1; border-color: rgb(222 222 222 / var(--tw-border-opacity)); } .listHome__list[data-v-635d3338] { position: relative; width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 30px; --tw-bg-opacity: 1; background-color: rgb(245 245 245 / var(--tw-bg-opacity)); padding: 30px 0; } @media screen and (max-width: 1440px) { .listHome__list[data-v-635d3338] { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 1180px) { .listHome__list[data-v-635d3338] { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 800px) { .listHome__list[data-v-635d3338] { grid-template-columns: repeat(1, 1fr); } } /*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/pages/ComplexViewMode/index.vue?vue&type=style&index=0&id=40cb5547&scoped=true&lang=scss ***! \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .complexPage[data-v-40cb5547] { width: 100%; height: -moz-max-content; height: max-content; overflow: auto; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); border-radius: 4px; padding: 0; padding-bottom: 0; }