@metropolle/design-system 1.0.0-beta.2026.1.24.851.ed85a09 → 1.0.0-beta.2026.1.24.924.ea29e2a

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3808,33 +3808,51 @@ html[data-theme="light"] .mds-profile-card__verified-trigger {
3808
3808
  }
3809
3809
 
3810
3810
  .mds-profile-card__verified-popup {
3811
+ /* Position to the LEFT of the trigger icon */
3811
3812
  position: absolute;
3812
- /* Centered on the card */
3813
3813
  top: 50%;
3814
- left: 50%;
3815
- transform: translate(-50%, -50%);
3816
- padding: 28px 32px;
3814
+ right: calc(100% + 12px);
3815
+ transform: translateY(-50%);
3816
+ padding: 32px 40px;
3817
3817
  /* Liquid Glass popup */
3818
- background: rgba(20, 20, 30, 0.85);
3819
- backdrop-filter: blur(20px) saturate(150%);
3820
- -webkit-backdrop-filter: blur(20px) saturate(150%);
3821
- border-radius: 18px;
3822
- border: 1px solid rgba(255, 255, 255, 0.12);
3818
+ background: rgba(20, 20, 30, 0.9);
3819
+ backdrop-filter: blur(24px) saturate(160%);
3820
+ -webkit-backdrop-filter: blur(24px) saturate(160%);
3821
+ border-radius: 20px;
3822
+ border: 1px solid rgba(255, 255, 255, 0.15);
3823
3823
  box-shadow:
3824
- 0 12px 40px rgba(0, 0, 0, 0.35),
3825
- inset 0 1px 0 rgba(255, 255, 255, 0.08);
3826
- min-width: 280px;
3827
- z-index: 20;
3824
+ 0 16px 48px rgba(0, 0, 0, 0.4),
3825
+ inset 0 1px 0 rgba(255, 255, 255, 0.1);
3826
+ min-width: 320px;
3827
+ z-index: 100;
3828
3828
  }
3829
3829
 
3830
3830
  html[data-theme="light"] .mds-profile-card__verified-popup {
3831
- background: rgba(255, 255, 255, 0.85);
3832
- border: 1px solid rgba(255, 255, 255, 0.95);
3831
+ background: rgba(255, 255, 255, 0.92);
3832
+ border: 1px solid rgba(255, 255, 255, 0.98);
3833
3833
  box-shadow:
3834
- 0 12px 40px rgba(0, 0, 0, 0.12),
3834
+ 0 16px 48px rgba(0, 0, 0, 0.15),
3835
3835
  inset 0 1px 0 rgba(255, 255, 255, 1);
3836
3836
  }
3837
3837
 
3838
+ /* Mobile: popup centered on screen */
3839
+ @media (max-width: 768px) {
3840
+ .mds-profile-card__verified-popup {
3841
+ position: fixed;
3842
+ top: 50%;
3843
+ left: 0;
3844
+ right: 0;
3845
+ bottom: auto;
3846
+ transform: translateY(-50%);
3847
+ width: 280px;
3848
+ min-width: auto;
3849
+ margin-left: auto;
3850
+ margin-right: auto;
3851
+ padding: 24px 28px;
3852
+ z-index: 1000;
3853
+ }
3854
+ }
3855
+
3838
3856
  .mds-profile-card__verified-header {
3839
3857
  font-family: 'OCR-B', 'OCR B Std', 'Courier New', monospace;
3840
3858
  font-size: 16px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@metropolle/design-system",
3
- "version": "1.0.0-beta.2026.01.24.0851.ed85a09",
3
+ "version": "1.0.0-beta.2026.01.24.0924.ea29e2a",
4
4
  "description": "Sistema de design unificado para a plataforma Metropolle",
5
5
  "type": "module",
6
6
  "main": "dist/react/index.js",