Mobile Status Bar

WiFi Icon Implementation Details

The WiFi icon has been fixed with the following improvements:

Increased size to match the battery icon (20px width)
Proper orientation with waves facing downward
Consistent spacing between status bar elements
Proper vertical alignment with other status bar icons

CSS Implementation

.wifi-icon {
    width: 20px;
    height: 16px;
    position: relative;
}

.wifi-wave {
    position: absolute;
    border: 2px solid white;
    border-top: none;
    border-radius: 0 0 100px 100px;
    width: 100%;
    height: 100%;
    clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 0);
}

.wave-1 {
    width: 8px;
    height: 8px;
    left: 6px;
    top: 8px;
}

.wave-2 {
    width: 14px;
    height: 14px;
    left: 3px;
    top: 2px;
}

.wave-3 {
    width: 20px;
    height: 20px;
    left: 0;
    top: -4px;
}