/* ============================================================ 相册边框样式(全局) - 前台 PhotoGallery 按 page.borderStyle 套用 - 后台 AdminEditor 预览复用同一套类 结构约定:
gf-frame 负责定位与裁切,gf-xxx 负责边框/卡纸/投影 ============================================================ */ .gf-frame { position: relative; background: #fff; overflow: hidden; } .gf-frame > img { display: block; width: 100%; height: 100%; object-fit: cover; } /* 无边框 */ .gf-none { padding: 0; border: 0; box-shadow: none; border-radius: 0; background: transparent; } /* 细金线 */ .gf-thin { padding: 0; border: 1px solid #cdb89c; border-radius: 4px; box-shadow: 0 2px 10px rgba(120, 90, 60, 0.08); background: #fff; } /* 白卡纸(经典裱框) */ .gf-mat { padding: 8px; border-radius: 2px; box-shadow: 0 6px 20px rgba(120, 90, 60, 0.12); background: #fff; } /* 柔圆角 */ .gf-rounded { padding: 0; border: 1px solid rgba(168, 140, 107, 0.4); border-radius: 20px; box-shadow: 0 8px 24px rgba(120, 90, 60, 0.1); background: #fff; } /* 双线框 */ .gf-double { padding: 6px; border: 3px double #b89a78; border-radius: 3px; box-shadow: 0 4px 16px rgba(120, 90, 60, 0.1); background: #fff; } /* 古典金框(外白 + 金线双层) */ .gf-gold { padding: 7px; border: 2px solid #c9a978; border-radius: 3px; box-shadow: 0 0 0 4px #fff, 0 0 0 5px #e7d6bb, 0 8px 22px rgba(120, 90, 60, 0.12); background: #fff; } /* 阴影浮起(无边框,大柔影悬浮感) */ .gf-shadow { padding: 0; border: 0; border-radius: 10px; box-shadow: 0 18px 44px rgba(96, 72, 50, 0.2), 0 4px 12px rgba(96, 72, 50, 0.1); background: #fff; } /* 墨黑描边(简约深色细框) */ .gf-ink { padding: 6px; border: 1.5px solid #3a3733; border-radius: 2px; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1); background: #fff; } /* 悬浮卡片(厚白边 + 大圆角 + 层叠影) */ .gf-card { padding: 12px; border: 1px solid rgba(168, 140, 107, 0.18); border-radius: 16px; box-shadow: 0 2px 6px rgba(120, 90, 60, 0.08), 0 16px 36px rgba(120, 90, 60, 0.16); background: #fff; } /* 虚线文艺(dashed 描边 + 内白边) */ .gf-lace { padding: 7px; border: 1.5px dashed #b89a78; border-radius: 8px; box-shadow: 0 3px 12px rgba(120, 90, 60, 0.08); background: #fff; } /* 柔光金晕(浅金边 + 外发光) */ .gf-glow { padding: 5px; border: 1px solid #e7d3ae; border-radius: 6px; box-shadow: 0 0 0 3px rgba(231, 211, 174, 0.35), 0 0 26px rgba(201, 169, 120, 0.45), 0 6px 16px rgba(120, 90, 60, 0.1); background: #fff; } /* 辅助:图片保持原始宽高比(单图铺满+保比例时使用,覆盖 gf-frame 的 height:100%) */ .gf-natural { height: auto !important; } .gf-natural > img { height: auto; object-fit: contain; }