infinity-forge
Version:
15 lines • 3.55 kB
JavaScript
"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.FeaturedBlogItem = void 0;
var link_1 = __importDefault(require("next/link"));
var styled_components_1 = __importDefault(require("styled-components"));
exports.FeaturedBlogItem = (0, styled_components_1.default)(link_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n border-radius: 5px;\n padding: 4px;\n\n .image {\n width: 100%;\n max-width: 77px;\n aspect-ratio: 1;\n border-radius: 5px;\n overflow: hidden;\n }\n\n .text {\n width: 100%;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n gap: 6px;\n }\n\n h2 {\n display: -webkit-box;\n line-height: 1.25;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-box-orient: vertical;\n color: #000;\n line-height: 1.2;\n }\n\n .date {\n font-size: 14px;\n font-weight: 300;\n color: #565454;\n text-align: start;\n }\n\n @media only screen and (max-width: 1400px) {\n .image {\n max-width: 65px;\n }\n }\n\n @media only screen and (max-width: 1200px) {\n gap: 8px;\n\n .image {\n max-width: 62px;\n }\n\n .text {\n gap: 5px;\n }\n }\n\n @media only screen and (max-width: 1024px) {\n .image {\n max-width: 58px;\n }\n }\n\n @media only screen and (max-width: 900px) {\n }\n\n @media only screen and (max-width: 768px) {\n }\n\n @media only screen and (max-width: 650px) {\n }\n\n @media only screen and (max-width: 500px) {\n }\n\n @media only screen and (max-width: 390px) {\n }\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n border-radius: 5px;\n padding: 4px;\n\n .image {\n width: 100%;\n max-width: 77px;\n aspect-ratio: 1;\n border-radius: 5px;\n overflow: hidden;\n }\n\n .text {\n width: 100%;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n gap: 6px;\n }\n\n h2 {\n display: -webkit-box;\n line-height: 1.25;\n -webkit-line-clamp: 2;\n overflow: hidden;\n text-overflow: ellipsis;\n -webkit-box-orient: vertical;\n color: #000;\n line-height: 1.2;\n }\n\n .date {\n font-size: 14px;\n font-weight: 300;\n color: #565454;\n text-align: start;\n }\n\n @media only screen and (max-width: 1400px) {\n .image {\n max-width: 65px;\n }\n }\n\n @media only screen and (max-width: 1200px) {\n gap: 8px;\n\n .image {\n max-width: 62px;\n }\n\n .text {\n gap: 5px;\n }\n }\n\n @media only screen and (max-width: 1024px) {\n .image {\n max-width: 58px;\n }\n }\n\n @media only screen and (max-width: 900px) {\n }\n\n @media only screen and (max-width: 768px) {\n }\n\n @media only screen and (max-width: 650px) {\n }\n\n @media only screen and (max-width: 500px) {\n }\n\n @media only screen and (max-width: 390px) {\n }\n"])));
var templateObject_1;
//# sourceMappingURL=styles.js.map