Skip to content

Q
question2answer
Commit 8505f9ba by Scott
Options

SnowFlat: remove server-side browser detection 

Sidebar now toggled based on media queries only.
parent 8bcdb763
Showing with 73 additions and 77 deletions
qa-theme/SnowFlat/qa-styles.css
...@@ -2749,48 +2749,65 @@ input[type="submit"], button { ...@@ -2749,48 +2749,65 @@ input[type="submit"], button {
} }
#qam-sidepanel-toggle { #qam-sidepanel-toggle {
position: fixed; display: none;
bottom: 10px;
right: 0;
text-align: center;
font-size: 24px;
background: #9b59b6;
cursor: pointer;
transition: all 0.15s ease;
color: #95a5a6;
opacity: 0.5;
z-index: 999;
}
#qam-sidepanel-toggle.active {
opacity: 1;
color: #34495e;
right: 250px;
box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.5);
}
#qam-sidepanel-toggle [class^="icon-"]:before, #qam-sidepanel-toggle [class*=" icon-"]:before {
line-height: 40px;
width: 30px;
height: 40px;
text-align: center;
color: #fff;
} }
#qam-sidepanel-mobile { @media (min-width: 980px) {
background: #fff; .qa-sidepanel {
position: fixed; width: 25%;
right: -250px; padding: 0px;
top: 0; float: right;
height: 100%; overflow: hidden;
width: 250px; *zoom: 1;
overflow-y: auto; }
z-index: 99999;
transition: all 0.15s ease;
box-shadow: 0 0 0 0 transparent;
} }
#qam-sidepanel-mobile.open {
right: 0 !important; @media (max-width: 979px) {
transition: all 0.15s ease; #qam-sidepanel-toggle {
box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.5); display: block;
position: fixed;
bottom: 10px;
right: 0;
text-align: center;
font-size: 24px;
background: #9b59b6;
cursor: pointer;
transition: all 0.15s ease;
color: #95a5a6;
opacity: 0.5;
z-index: 999;
}
#qam-sidepanel-toggle.active {
opacity: 1;
color: #34495e;
right: 280px;
box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.5);
}
#qam-sidepanel-toggle [class^="icon-"]:before, #qam-sidepanel-toggle [class*=" icon-"]:before {
line-height: 40px;
width: 30px;
height: 40px;
text-align: center;
color: #fff;
}
.qa-sidepanel {
width: 280px;
height: 100%;
position: fixed;
right: -280px;
top: 0;
overflow-y: auto;
z-index: 99999;
background: #fff;
transition: all 0.15s ease;
box-shadow: 0 0 0 0 transparent;
}
.qa-sidepanel.open {
right: 0 !important;
transition: all 0.15s ease;
box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.5);
}
} }
......
qa-theme/SnowFlat/qa-theme.php
...@@ -107,22 +107,6 @@ class qa_html_theme extends qa_html_theme_base ...@@ -107,22 +107,6 @@ class qa_html_theme extends qa_html_theme_base
} }
/** /**
* Adding sidebar for mobile device
*
* @since Snow 1.4
*/
public function body()
{
if (qa_is_mobile_probably()) {
$this->output('<div id="qam-sidepanel-toggle"><i class="icon-left-open-big"></i></div>');
$this->output('<div id="qam-sidepanel-mobile">');
parent::sidepanel();
$this->output('</div>');
}
parent::body();
}
/**
* Adding body class dynamically. Override needed to add class on admin/approve-users page * Adding body class dynamically. Override needed to add class on admin/approve-users page
* *
* @since Snow 1.4 * @since Snow 1.4
...@@ -291,21 +275,23 @@ class qa_html_theme extends qa_html_theme_base ...@@ -291,21 +275,23 @@ class qa_html_theme extends qa_html_theme_base
*/ */
public function sidepanel() public function sidepanel()
{ {
// removes sidebar for user profile pages // remove sidebar for user profile pages
if ($this->template != 'user' && !qa_is_mobile_probably()) { if ($this->template == 'user')
$this->output('<div class="qa-sidepanel">'); return;
$this->qam_search();
$this->widgets('side', 'top'); $this->output('<div id="qam-sidepanel-toggle"><i class="icon-left-open-big"></i></div>');
$this->sidebar(); $this->output('<div class="qa-sidepanel" id="qam-sidepanel-mobile">');
$this->widgets('side', 'high'); $this->qam_search();
$this->nav('cat', 1); $this->widgets('side', 'top');
$this->widgets('side', 'low'); $this->sidebar();
if (isset($this->content['sidepanel'])) $this->widgets('side', 'high');
$this->output_raw($this->content['sidepanel']); $this->nav('cat', 1);
$this->feed(); $this->widgets('side', 'low');
$this->widgets('side', 'bottom'); if (isset($this->content['sidepanel']))
$this->output('</div>', ''); $this->output_raw($this->content['sidepanel']);
} $this->feed();
$this->widgets('side', 'bottom');
$this->output('</div>', '');
} }
/** /**
...@@ -636,13 +622,6 @@ class qa_html_theme extends qa_html_theme_base ...@@ -636,13 +622,6 @@ class qa_html_theme extends qa_html_theme_base
$css[] = '}'; $css[] = '}';
} }
// sidebar styles for desktop (must use server-side UA detection, not media queries)
if (!qa_is_mobile_probably()) {
$css[] = '@media (min-width: 980px) {';
$css[] = ' .qa-sidepanel { width: 25%; padding: 0px; float: right; overflow: hidden; *zoom: 1; }';
$css[] = '}';
}
$css[] = '</style>'; $css[] = '</style>';
$this->output_array($css); $this->output_array($css);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment