@lobehub/ui/es/Footer/style.js

Lobe UI is an open-source UI component library for building AIGC web apps

var _templateObject, _templateObject2;
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import { createStyles } from 'antd-style';
export var useStyles = createStyles(function (_ref, _ref2) {
  var css = _ref.css,
    responsive = _ref.responsive,
    token = _ref.token;
  var isEmpty = _ref2.isEmpty,
    contentMaxWidth = _ref2.contentMaxWidth;
  var prefix = "rc-footer";
  return {
    container: css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        grid-area: footer;\n        align-self: stretch;\n\n        color: ", ";\n        text-align: center;\n\n        border-block-start: 1px solid ", ";\n\n        ", " {\n          flex-direction: column;\n          border: none;\n        }\n      "])), token.colorTextDescription, token.colorSplit, responsive.mobile),
    footer: css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        font-size: 14px;\n        line-height: 1.5;\n        color: ", ";\n        background-color: ", ";\n\n        &.", " {\n          a {\n            color: ", ";\n            text-decoration: none;\n            transition: all 0.3s;\n\n            &:hover {\n              color: ", ";\n            }\n          }\n        }\n\n        .", " {\n          &-container {\n            width: 100%;\n            max-width: ", "px;\n            margin: auto;\n            padding: ", ";\n          }\n\n          &-columns {\n            display: flex;\n            justify-content: space-around;\n          }\n\n          &-column {\n            text-align: start;\n\n            h2 {\n              position: relative;\n\n              margin-block: 0;\n              margin-inline: auto;\n\n              font-size: 16px;\n              font-weight: 500;\n              color: ", ";\n            }\n\n            &-icon {\n              position: relative;\n              inset-block-start: -1px;\n\n              display: inline-block;\n\n              width: 22px;\n              margin-inline-end: 0.5em;\n\n              text-align: center;\n              vertical-align: middle;\n\n              > span,\n              > svg,\n              img {\n                display: block;\n                width: 100%;\n              }\n            }\n          }\n\n          &-item {\n            margin-block: 12px;\n            margin-inline: 0;\n\n            &-icon {\n              position: relative;\n              inset-block-start: -1px;\n\n              display: inline-block;\n\n              width: 16px;\n              margin-inline-end: 0.4em;\n\n              text-align: center;\n              vertical-align: middle;\n\n              > span,\n              > svg,\n              img {\n                display: block;\n                width: 100%;\n              }\n            }\n\n            &-separator {\n              margin-block: 0;\n              margin-inline: 0.3em;\n            }\n          }\n\n          &-bottom {\n            color: ", ";\n\n            &-container {\n              width: 100%;\n              max-width: ", "px;\n              margin-block: 0;\n              margin-inline: auto;\n              padding-block: 16px;\n              padding-inline: 0;\n\n              line-height: 32px;\n              text-align: center;\n            }\n          }\n\n          &-light {\n            color: rgba(0, 0, 0, 85%);\n            background-color: transparent;\n\n            h2,\n            a {\n              color: rgba(0, 0, 0, 85%);\n            }\n          }\n\n          &-light &-bottom-container {\n            border-block-start-color: #e8e8e8;\n          }\n\n          &-light &-item-separator,\n          &-light &-item-description {\n            color: rgba(0, 0, 0, 45%);\n          }\n        }\n\n        ", " {\n          .", " {\n            &-container {\n              padding-block: 40px;\n              padding-inline: 0;\n            }\n\n            &-columns {\n              display: block;\n            }\n\n            &-column {\n              display: block;\n              margin-block-end: 40px;\n              text-align: center;\n\n              &:last-child {\n                margin-block-end: 0;\n              }\n            }\n          }\n        }\n      "])), token.colorTextSecondary, token.colorBgLayout, prefix, token.colorTextTertiary, token.colorLinkHover, prefix, contentMaxWidth, isEmpty ? '0' : '60px 0 20px', token.colorText, token.colorTextDescription, contentMaxWidth, responsive.mobile, prefix)
  };
});