Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
An experimental strip layout for the Awesome Weather Widget Pro
<style>
/* STRIP */
.awe_strip { padding: 0; width: 100%;}
.awe_strip .awesome-weather-header { margin-left: -10px; padding: 10px 15px; }
.awe_strip .awesome-weather-strip-line { padding: 10px; white-space: nowrap; display: block; padding-right: 50px; text-transform: uppercase; overflow: hidden; overflow-x: scroll; }
.awe_strip .awesome-weather-strip-stat { padding: 0 10px; }
.awe_strip .awesome-weather-strip-line strong { padding-right: 5px; }
.awe_strip .awesome-weather-form { top: 5px; left: 5px; right: 35px; bottom: 5px; }
.awe_strip .awesome-weather-form input[type="text"] { max-height: 100%; }
.awe_strip .awesome-weather-blankout .awe-loading { width: auto; left: auto; right: 7px; top: 10px; font-size: 18px; }
.awe_strip .awe-weather-bubble { text-align: center; text-transform: uppercase; }
.awe_strip .awe-weather-trigger { background: rgba(0,0,0,0.8); top: 0; right: 0; bottom: 0; width: 35px; text-align: center; padding-top: 5px; padding-left: 5px; }
</style>
<div id="awesome-weather-<?php echo $weather->city_slug; ?>" class="awe_strip <?php echo $background_classes ?>" <?php echo $inline_style; ?>>
<?php if($weather->background_image) { ?><div class="awesome-weather-cover" style="background-image: url(<?php echo $weather->background_image; ?>);"><?php } ?>
<?php awe_change_weather_form( $weather ); ?>
<?php awe_change_weather_trigger( $weather ); ?>
<div class="awesome-weather-strip-line">
<span class="awesome-weather-header"><?php echo $header_title; ?></span>
<?php if( isset($weather->data['current'])) { ?>
<span class="awesome-weather-strip-stat">
<strong><?php _e('Now', 'awesome-weather-pro'); ?></strong>
<?php if($weather->show_icons) { ?><i class="<?php echo $weather->data['current']['icon']; ?>"></i><?php } ?>
<?php echo $weather->data['current']['temp']; ?><sup>&deg;</sup>
<?php echo $weather->data['current']['description']; ?>
</span>
<?php } ?>
<?php if($weather->forecast_days != "hide") { ?>
<?php foreach( $weather_forecast as $forecast ) { ?>
<span class="awesome-weather-strip-stat">
<strong><?php echo $forecast->day_of_week; ?></strong>
<?php if($weather->show_icons) { ?><i class="<?php echo $forecast->icon; ?>>"></i><?php } ?>
<?php echo $forecast->temp; ?><sup>&deg;</sup>
<?php echo $forecast->description; ?>
</span>
<?php } ?>
<?php } ?>
</div>
<?php if($weather->background_image) { ?></div><!-- /.awesome-weather-cover --><?php } ?>
</div><!-- /.awesome-weather-wrap: strip -->
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.