Skip to content

correct errors in css code and refactor file to for consistency and s… #5

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
andrewtf wants to merge 4 commits into
base: drupal7
Choose a base branch
from
Open

correct errors in css code and refactor file to for consistency and s… #5

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
6bcee59
correct errors in css code and refactor file to for consistency and s…
andrewtf Jan 29, 2016
4497826
add Drupal $site_name variable to template
andrewtf Jan 29, 2016
fc0a144
move markup to themeable template file
andrewtf Jan 29, 2016
2e1315f
add Drupal readme
andrewtf Feb 10, 2016
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Empty file modified visitor_motivation_survey/js.cookie.js
100755 → 100644
View file
Open in desktop
Empty file.
36 changes: 36 additions & 0 deletions visitor_motivation_survey/readme.txt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
--------------------------------------------------------------------------------
Visitor Motivation Survey for Drupal 7.x
By Andrew Fox, Fine Arts Museums of San Francisco - afox@famsf.org
Based on work by Chris Brown at Yerba Buena Center for the Arts
--------------------------------------------------------------------------------

DESCRIPTION:
This module implements the Visitor Motivation Survey (VMS) for museum websites
by Marty Spellerberg (https://github.com/spellerberg/vms).

--------------------------------------------------------------------------------

REQUIREMENTS:
jQuery Update module (https://www.drupal.org/project/jquery_update).
The survey requires jQuery 1.7 or higher.

--------------------------------------------------------------------------------

INSTALLATION:
Put this module in your sites/all/modules directory and enable it at
admin/modules.

--------------------------------------------------------------------------------

CONFIGURATION:
Right now there are no configuration options for this module. It pulls the
Drupal site name ($site_name) into the template and uses it to customize the
survey content. If you wish to further customize this, you can copy the
visitor_motivation_survey.tpl.php file into your theme and edit it there. You
can also override the module css (located in vms.css) in your theme css.

--------------------------------------------------------------------------------

NOTE:
You must be participating in the VMS program for this survey to have any
meaningful use for your website!
47 changes: 19 additions & 28 deletions visitor_motivation_survey/visitor_motivation_survey.module
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,34 +33,25 @@ function visitor_motivation_survey_help($path, $arg) {
function visitor_motivation_survey_page_alter(&$page) {
if (!path_is_admin(current_path())) {
$page['content']['vms'] = array(
'#markup' => '
<div class="vms">
<div class="xbutton dismiss">Not now <span>&times;</span></div>
<div class="xbutton shrink">Close <span>&times;</span></div>
<div class="xbutton finish">Close <span>&times;</span></div>
<div class="margin">
<div class="opensurvey">
<div class="prompt clickable">Answer one question. <span>Improve our website.</span></div>
<div class="survey">
<p>Today, I&rsquo;m visiting the [museum name] website:</p>
<ul>
<li><a class="recharger" href="#">For inspiration.</a></li>
<li><a class="explorer" href="#">To learn something new.</a></li>
<li><a class="facilitator" href="#">To plan an activity for my family/friends.</a></li>
<li><a class="seeker" href="#">Because the [museum name] was recommended to me.</a></li>
<li><a class="professional" href="#">For professional reasons.</a></li>
</ul>
<p class="done">Done. Thank you!</p>
<p class="infobutton clickable">What is this?</p>
<p class="infotext">We&rsquo;re always looking for ways to improve our site, so we want to know why you&rsquo;re here and how we can help you find the information you need. For specific questions or comments about our website or this survey, please <a href="[contact]">contact us</a>. Thanks for your help!</p>
</div>
</div>
</div>
<div class="mquery"></div>
</div>
',
'#weight' => 120
);
'#theme' => 'visitor_motivation_survey',
'#weight' => 120,
);
}
}

/**
* Implements hook_theme().
*
*/

function visitor_motivation_survey_theme() {
return array(
'visitor_motivation_survey' => array(
'variables' => array(
'site_name' => variable_get('site_name', 'drupal'),
),
// Use a template file called visitor_motivation_survey.tpl.php
'template' => 'visitor_motivation_survey',
),
);
}
32 changes: 32 additions & 0 deletions visitor_motivation_survey/visitor_motivation_survey.tpl.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
<?php
/**
* Displays popup content for Visitor Motivation Survey for museum websites.
*
* Template file allows for simple adjustment of html and css.
*/
?>

<div class="vms">
<div class="xbutton dismiss">Not now <span>&times;</span></div>
<div class="xbutton shrink">Close <span>&times;</span></div>
<div class="xbutton finish">Close <span>&times;</span></div>
<div class="margin">
<div class="opensurvey">
<div class="prompt clickable">Answer one question. <span>Improve our website.</span></div>
<div class="survey">
<p>Today, I&rsquo;m visiting the <?php echo $site_name;?> website:</p>
<ul>
<li><a class="recharger" href="#">For inspiration.</a></li>
<li><a class="explorer" href="#">To learn something new.</a></li>
<li><a class="facilitator" href="#">To plan an activity for my family/friends.</a></li>
<li><a class="seeker" href="#">Because the <?php echo $site_name;?> was recommended to me.</a></li>
<li><a class="professional" href="#">For professional reasons.</a></li>
</ul>
<p class="done">Done. Thank you!</p>
<p class="infobutton clickable">What is this?</p>
<p class="infotext">We&rsquo;re always looking for ways to improve our site, so we want to know why you&rsquo;re here and how we can help you find the information you need. For specific questions or comments about our website or this survey, please <a href="[contact]">contact us</a>. Thanks for your help!</p>
</div>
</div>
</div>
<div class="mquery"></div>
</div>
208 changes: 170 additions & 38 deletions visitor_motivation_survey/vms.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,54 +1,186 @@
.vms { background: gray; color: black; margin: 0; padding: .5em 1em; border-top: 2px solid black; font-size: 16px; line-height: 1.1; font-weight: bold; position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; -webkit-text-size-adjust: 100% }
.vms.open { top: 0; border-top: none; overflow: scroll; -webkit-overflow-scrolling: touch; }

.vms .margin {margin: auto; max-width: 924px; }
.vms a {color: white; text-decoration: none; !important}
.vms a:hover {color: #ccc; text-decoration: none; !important}
.vms a.active {color: #fff;}
.vms p {margin: 0; font-size: 1em !important;}
.vms ul {list-style: none; margin: 1em 0 0 0; padding: 0; }
.vms li { margin: 0 0 .5em 0; padding: none; }

.vms .clickable {cursor: pointer;}

.vms .xbutton { color: #fff; font-size: .66em; float: right; margin: .4em 0 0 0; cursor: pointer; line-height: 1; text-transform: uppercase;}
.vms .xbutton:hover { color: black; }
.vms .xbutton span { font-size: 1.25em; line-height: 0; margin-left: .25em; }
.vms .xbutton.shrink {display: none; }
.vms .xbutton.finish {display: none; }

.vms .prompt { color: black;}
.vms .prompt span { color: white; display: block; }

.vms .survey { display: none; overflow: hidden;}
.vms .survey p { margin-top: 1em; font-size: 1em}
.vms {
background: gray;
color: black;
margin: 0;
padding: .5em 1em;
border-top: 2px solid black;
font-size: 16px;
line-height: 1.1;
font-weight: bold;
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
-webkit-text-size-adjust: 100%;
}
.vms.open {
top: 0;
border-top: none;
overflow: scroll;
-webkit-overflow-scrolling: touch;
}

.vms .margin {
margin: auto;
max-width: 924px;
}

.vms a {
color: white;
text-decoration: none !important;
}

.vms a:hover {
color: #ccc;
text-decoration: none !important;
}

.vms a.active {
color: #fff;
}

.vms p {
margin: 0;
font-size: 1em !important;
}

.vms ul {
list-style: none;
margin: 1em 0 0 0;
padding: 0;

}

.vms li {
margin: 0 0 .5em 0;
padding: 0;
}

.vms .clickable {
cursor: pointer;
}

.vms .xbutton {
color: #fff;
font-size: .66em;
float: right;
margin: .4em 0 0 0;
cursor: pointer;
line-height: 1;
text-transform: uppercase;
}

.vms .xbutton:hover {
color: black;
}

.vms .xbutton span {
font-size: 1.25em;
line-height: 0;
margin-left: .25em;
}

.vms .xbutton.shrink {
display: none;
}

.vms .xbutton.finish {
display: none;
}

.vms .prompt {
color: black;
}

.vms .prompt span {
color: white; display: block;
}

.vms .survey {
display: none;
overflow: hidden;
}

.vms .survey p {
margin-top: 1em;
font-size: 1em;
}

.vms .survey li a { color: #ccc !important }
.vms .survey li a:hover { color: #BBC428 !important }
.vms .survey li a {
color: #ccc !important;
}

.vms .survey li a:hover {
color: #BBC428 !important;
}

.vms .survey .done {color: transparent; margin: 1em 0; }
.vms .survey .done.clickable {color: white; }
.vms .survey .done {
color: transparent;
margin: 1em 0;
}

.vms .survey .done.clickable {
color: white;
}

.vms .survey p.infobutton {
font-size: .9em;
margin-bottom: 0;
}

.vms .survey p.infobutton {font-size: .9em; margin-bottom: 0; }
.vms .survey p.infotext {display: none; font-size: .8em !important; margin: 0; }
.vms .survey p.infotext a { color: #ccc; }
.vms .survey p.infotext {
display: none;
font-size: .8em !important;
margin: 0;
}

.vms .survey p.infotext a {
color: #ccc;
}

.vms .mquery { float: right; }
.vms .mquery {
float: right;
}

@media screen and (min-width: 500px) {
.vms .prompt span { display: inline; }

.vms .prompt span {
display: inline;
}

}

@media screen and (min-width: 570px) {
.vms, .vms p { font-size: 18px; }

.vms, .vms p {
font-size: 18px;
}

}

@media screen and (min-width: 700px) {
.vms.open { top: auto; border-top: 2px solid black; overflow: auto; }
.vms li { margin-bottom: 0; }
.vms .mquery { float: left; }
.vms.open {
top: auto;
border-top: 2px solid black;
overflow: auto;
}

.vms li {
margin-bottom: 0;
}

.vms .mquery {
float: left;
}

}

@media screen and (min-width: 800px) {
.vms, .vms p { font-size: 20px; }

.vms,
.vms p {
font-size: 20px;
}

}