Skip to content
This repository has been archived by the owner on Apr 25, 2019. It is now read-only.

Commit

Permalink
Moving overlay to it's own HTML pattern
Browse files Browse the repository at this point in the history
  • Loading branch information
daveredfern committed Aug 25, 2016
1 parent 85e399f commit cb1dbec
Show file tree
Hide file tree
Showing 6 changed files with 29 additions and 15 deletions.
8 changes: 8 additions & 0 deletions html/atom/overlay.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
<?php /*
Title: Overlay
Class: .overlay
Description: Styles have been added to stop it going fullscreen. This will not affect anything includes.
Section: cc-overlay
*/ ?>

<div class="overlay" id="overlay" data-cc-action="deactivate" data-cc-target="modal drawer-left drawer-right"></div>
4 changes: 3 additions & 1 deletion html/molecule/drawer/1-toggles.php
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,6 @@
*/ ?>

<p><a href="#" data-cc-target="drawer-left-1" data-cc-action="activate">Left Drawer Panel 1</a></p>
<p><a href="#" data-cc-target="drawer-right-1" data-cc-action="activate">Right Drawer Panel 1</a></p>
<p><a href="#" data-cc-target="drawer-right-1" data-cc-action="activate">Right Drawer Panel 1</a></p>

<?php printPattern('atom/overlay'); ?>
7 changes: 0 additions & 7 deletions html/molecule/drawer/4-overlay.php

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<?php /*
Title: Modal
Class: .modal
Description: The modal is hidden off screen by default, use the modal toggles to show.
*/ ?>

<div class="modal" id="modal" data-cc-cascade="overlay" data-cc-trigger-on="direct-only" data-cc-action="deactivate" data-cc-target="modal">
Expand Down
7 changes: 0 additions & 7 deletions html/molecule/modal/2-overlay.php

This file was deleted.

16 changes: 16 additions & 0 deletions src/scss/chopchop-ui.scss
Original file line number Diff line number Diff line change
Expand Up @@ -265,4 +265,20 @@

.cc-shape-ring {
@include ring;
}


// =============================================
// Overlay override
// =============================================

.cc-overlay {
position: relative;
height: 50vh;

.overlay {
top: 200px;
display: block;
position: absolute;
}
}

0 comments on commit cb1dbec

Please sign in to comment.