share_activity/components/topbar.wxss

/* components/topbar.wxss */

.topbar {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
}

.topbar .back {
    width: 40rpx;
    height: 40rpx;
    position: absolute;
    left: 0;
    top: 0;
}

.topbar .title {
    width: calc(100vw - 60rpx);
    height: 100%;
    text-align: center;
    font-size: 32rpx;
}

@font-face {
    font-family: "back-iconfont"; 
    src: url('data:font/woff2;charset=utf-8;base64,d09GMgABAAAAAAKEAA0AAAAABnwAAAIyAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAP0ZGVE0cGh4GYACCZhEICkRYCwoAATYCJAMQBCAFhQIHNBufBciuBmx3MpBOu7aFwggHL5fi8p9GO0hhPPS/H+3OvFkTaVs3LtDEq2ipNEjs6URK0RJFs2by97/W9v5J6RtJZ5G5hlSmi+/uCfiHGRJkslimdCqhaqJCo9ILJ3PMWoXlC5AbnEgFxqVF9mEzeJP7wOl5PLetQwEFEudZlp4LFFiaXbqUBRRoFli5RtzuNIpD7XN5HLZIcjmmKOWwCQEfX9sPP3+FJzyaMIxZkELThEKiSpyzyRc5eKmuj3+C6Cf1NKi++rjQwaU7bbsb2g9LEABYR+hBwzEonCFwlylwzDSIM5Z5kBK6Tpud97EMIIzlFqihEb0scJFgfB6COV10nQQF+hGYALMACgAxofUuVzxcm482++j5olz68/F7X/w7/fAHAsGbP7fGTn/9lBmbSHRf82cK6JcgmIv6SoH87/4YqgCFEkMCZQKBxKBBdAAmvRBgSgaB0O8yAqnPEwSafs8QKP1eIdBjyAcEevX7jsCgozgFgSFTcc4UNYBdiGIYF4pp1B2xGTfAilqJPWadxV7jruKg295tQ3bjqZwxqYmDukNomYOxtoE+lWK4dkPRgaIYAIKZHsV1kjbV1TSGn2Z+8/0DeJs0NhF7BZ/Dg2OovO94XOxSdZ80HnHPxIwWYEwRlLGBHqFY4gmpq2tAGBobSEhtzIFLunsy0wGzOp/g0yjcYoz/uvcBTzE2lOVyqcq2o93SwnZrKTZcD6a0hDFonUIQGiMHTnzV7EfT2Ac=') format('woff2'),
    url('data:font/woff;charset=utf-8;base64,d09GRgABAAAAAARMAA0AAAAABnwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAEMAAAABoAAAAckXKgP0dERUYAAAQQAAAAHgAAAB4AKQAKT1MvMgAAAaQAAABEAAAAYFY0Ys5jbWFwAAAB+AAAAFIAAAFmADoI4Gdhc3AAAAQIAAAACAAAAAj//wADZ2x5ZgAAAlgAAABEAAAARN70fHFoZWFkAAABMAAAADEAAAA2Hu29M2hoZWEAAAFkAAAAHQAAACQG0wOFaG10eAAAAegAAAAQAAAAEAwAAQtsb2NhAAACTAAAAAoAAAAKACIAAG1heHAAAAGEAAAAHwAAACABDwAdbmFtZQAAApwAAAFGAAACgl6CAQJwb3N0AAAD5AAAACIAAAA0mu7T1XjaY2BkYGAA4pMvDcPi+W2+MnCzMIDA3ec2s2E0I/f/m0xfmdWBXA4GJpAoAFSjDC8AAAB42mNgZGBgbvjfwBDDwgACTF8ZGBlQAQsAWREDYAAAAHjaY2BkYGBgYRBkANEMDExAzAWEDAz/wXwGAAp2AS0AeNpjYGFhYJzAwMrAwNTJdIaBgaEfQjO+ZjBi5ACKMrAyM2AFAWmuKQwH/gMBc8P/BgYG5jsMQJKBEUmJAgMjAKRyDq8EAAAAAAAAAAQAAAAEAAELeNrdjLENgDAMBM9OoEBItBR0tIzBIOy/RPg8NKzAWaeXXraBASjykFWeBJ1LbbgvTO4rqzI1ojXbN2bvbzwES+7Wf2PkfahM338Jfs8NOysGHgAAAAAAAAAAAAAAIgAAAAEBC//ZAvUDJwAQAAAJATY0JiIHAQYUFwEWMjY0JwGJAVwQHywP/n8PDwGBDywfEAGAAVAPKh4P/owPKg/+jA8eKg942n2QzUrDQBSFz/RPbUHEgutZFUFIf5alu0LduXBR1206SVuSTJhMC126deUDuPUxfACfQXDlg3garwgVmpDLN+fec2YmAC7xCYWfp41rYYVT3AlXcIJYuEr9UbhGfhGuo4U34Qb1D+EmbtRIuIW2emaCqp1x1SnT9qxwgZFwBed4EK5St8I18pNwHVd4FW5QfxduYoov4RY6aokxHAxm8KwLaMyxY10hZG6GqKweGDsz82ah5zu9Cm0W2Yziv6m/1j3jYmyQMNpxaeJNMnNHLUdaU6Y5FBzZtzT6CNCjbFyxspnuB72j9lvaszLi8J4FtjzmgKqnUfNztKekicQYXiEha+Rlb00lpB4w1mTG/f6VYhsPvI905GyqJ9zWJInVubNrE3oOL8s9cgzR5RsdpAfl4VOOeZ8Pu91IAoLQpvgGD2pwhwAAeNpjYGKAAC4wyciADljAokyMTJzGhmmJeRmlmYYAEekDMQAAAAAAAf//AAIAAQAAAAwAAAAWAAAAAgABAAMAAwABAAQAAAACAAAAAHjaY2BgYGQAgqtL1DlA9N3nNrNhNABDmwbgAAA=') format('woff');
}

.back-iconfont {
    font-family: "back-iconfont" !important;
    font-size: 18px;
    font-style: normal;
  }
  .back-iconfont:before {
      content: "\f0223";
  }