Skip to content

Commit

Permalink
Econ 212 - Media Card layout (#169)
Browse files Browse the repository at this point in the history
* ECON-212 Add Media Card layout for Panels and Display Suite

* ECON-212 Adjust styles of the Media component for the Media Card layout

* ECON-212 Update Media Card layout thumbnail
  • Loading branch information
sacarney authored and angelamnr committed Mar 8, 2018
1 parent 358cfcb commit 71121c8
Show file tree
Hide file tree
Showing 5 changed files with 100 additions and 1 deletion.
22 changes: 21 additions & 1 deletion css/suitcase.css
Original file line number Diff line number Diff line change
Expand Up @@ -626,12 +626,32 @@ input[type=submit].form-submit {
border: 1px solid #ddd;
}


.media-heading {
margin-top: 0;
margin-bottom: 0;
}

/* Media Card Layout */

.media.media_card {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
align-items: flex-start;
}

.media.media_card .media-heading {
margin-bottom: 1rem;
}

.people_media-card_heading {
font-size: 1.25rem;
}

.people_media-card_position {
font-size: 1rem;
color: #676767;
}

/* -------------------- */
/* Icon Menus */

Expand Down
22 changes: 22 additions & 0 deletions panels/layouts/media_card/media-card.tpl.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<div class="media media_card" <?php if (!empty($css_id)) { print "id=\"$css_id\""; } ?>>

<?php if (!empty($content['media_left'])): ?>
<div class="media-left">
<?php print $content['media_left']; ?>
</div>
<?php endif; ?>

<div class="media-body">
<?php if (!empty($content['media_heading'])): ?>
<div class="media-heading">
<?php print $content['media_heading']; ?>
</div>
<?php endif; ?>

<?php if (!empty($content['media_body'])): ?>
<div class="media-body">
<?php print $content['media_body']; ?>
</div>
<?php endif; ?>
</div>
</div>
22 changes: 22 additions & 0 deletions panels/layouts/media_card/media_card.inc
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
<?php

/**
* Implements hook_panels_layouts().
*/
function suitcase_interim_media_card_panels_layouts() {
$items['media_card'] = array(
'title' => t('Media Card'),
'category' => t('Suitcase: Media Card'),
'icon' => 'media_card.jpg',
'theme' => 'media_card',
'admin css' => 'media_card_admin.css',
'regions' => array(
'media_left' => t('Left'),
'media_heading' => t('Heading'),
'media_body' => t('Body'),
),
);
return $items;
}


Binary file added panels/layouts/media_card/media_card.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
35 changes: 35 additions & 0 deletions panels/layouts/media_card/media_card_admin.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
.media {
/* Overrides blog_blog.css */
display: flex !important;
align-items: center;
margin-bottom: 1rem;
margin-right: 1rem;
}

.media.media_card {
wdith: 100%;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
align-items: flex-start;
}

.media-left {
min-width: 250px;
flex: 0 0 auto;
margin-right: 1rem;
margin-bottom: 0.5rem;
padding: 0;
}

.media-left img {
border: 1px solid #ddd;
}

.media-body {
flex-grow: 1;
}

.media-heading {
margin-top: 0;
margin-bottom: 0;
}

0 comments on commit 71121c8

Please sign in to comment.