Commit e23c9996 by Brian Talbot

studio - page headers: completed basic styling and simple page set-ups

parent 8ec4c096
......@@ -70,9 +70,12 @@ h1 {
.title-sub {
@include font-size(14);
position: relative;
top: ($baseline/4);
display: block;
margin: 0;
color: $gray-l2;
font-weight: 400;
}
.title, .title-1 {
......@@ -82,6 +85,50 @@ h1 {
font-weight: 600;
color: $gray-d3;
}
// layout with actions
.title {
width: flex-grid(12);
}
// layout with actions
&.has-actions {
@include clearfix();
.title {
float: left;
width: flex-grid(5,12);
margin-right: flex-gutter();
}
.nav-actions {
position: relative;
bottom: -($baseline*1.5);
float: right;
width: flex-grid(4,12);
text-align: right;
.nav-item {
display: inline-block;
vertical-align: top;
margin-right: ($baseline/2);
&:last-child {
margin-right: 0;
}
}
// buttons
.button {
padding: ($baseline/4) ($baseline/2) ($baseline/3) ($baseline/2);
}
.upload-button .icon-create {
@include font-size(18);
margin-top: ($baseline/4);
}
}
}
}
}
......@@ -531,22 +578,30 @@ hr.divide {
.new-button {
@include green-button;
font-size: 13px;
@include font-size(13);
padding: 8px 20px 10px;
text-align: center;
&.big {
display: block;
}
.icon-create {
display: inline-block;
vertical-align: middle;
margin-right: ($baseline/4);
margin-top: ($baseline/10);
line-height: 0;
}
}
.edit-button.standard,
.delete-button.standard {
float: left;
@include font-size(12);
@include white-button;
float: left;
padding: 3px 10px 4px;
margin-left: 7px;
font-size: 12px;
font-weight: 400;
.edit-icon,
......
......@@ -37,6 +37,11 @@
padding: 34px 0 42px;
border-top: 1px solid #cbd1db;
&:first-child {
padding-top: 0;
border: none;
}
&.editing {
position: relative;
z-index: 1001;
......
......@@ -44,7 +44,7 @@
<h3 class="sr">Page Actions</h3>
<ul>
<li class="nav-item">
<a href="#" class="upload-button new-button"><span class="upload-icon"></span>Upload New File</a>
<a href="#" class="button upload-button new-button"><i class="ss-icon ss-symbolicons-standard icon icon-create">&#xEB40;</i> Upload New File</a>
</li>
</ul>
</nav>
......@@ -54,9 +54,6 @@
<div class="main-wrapper">
<div class="inner-wrapper">
<div class="page-actions">
<a href="#" class="upload-button new-button">
<span class="upload-icon"></span>Upload New Asset
</a>
<input type="text" class="asset-search-input search wip-box" placeholder="search assets" style="display:none"/>
</div>
<article class="asset-library">
......
......@@ -53,7 +53,7 @@
<h3 class="sr">Page Actions</h3>
<ul>
<li class="nav-item">
<a href="#" class="new-update-button">New Update</a>
<a href="#" class=" button new-button new-update-button"><i class="ss-icon ss-symbolicons-standard icon-create">&#x002B;</i> New Update</a>
</li>
</ul>
</nav>
......
......@@ -26,24 +26,25 @@
<h3 class="sr">Page Actions</h3>
<ul>
<li class="nav-item">
<a href="#" class="toggle-button toggle-button-sections"><i class="ss-icon ss-symbolicons-block">up</i> <span class="label">Collapse All Sections</span></a>
</li>
<li class="nav-item">
<a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
<a href="#" class="button new-button new-tab"><i class="ss-icon ss-symbolicons-standard icon-create">&#x002B;</i> New Page</a>
</li>
</ul>
</nav>
</header>
</div>
<div class="wrapper-content wrapper">
<section class="content">
<div class="introduction">
<p>On this page, you can add and manage additional pages for your course. These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
</div>
</section>
</div>
<div class="main-wrapper">
<div class="inner-wrapper">
<article class="unit-body">
<div class="details">
<h2>Here you can add and manage additional pages for your course</h2>
<p>These pages will be added to the primary navigation menu alongside Courseware, Course Info, Discussion, etc.</p>
</div>
<div class="tab-list">
<ol class='components'>
% for id in components:
......
......@@ -7,8 +7,8 @@
<div class="wrapper-mast wrapper">
<header class="mast has-actions">
<div class="title">
<span class="title-sub">Tools</span>
<h1 class="title-1">Course Export</h1>
<span class="title-sub">Course Settings</span>
<h1 class="title-1">Course Team</h1>
</div>
<nav class="nav-actions">
......@@ -16,7 +16,7 @@
<ul>
%if allow_actions:
<li class="nav-item">
<a href="#" class="new-button new-user-button"><span class="plus-icon white"></span>New User</a>
<a href="#" class="button new-button new-user-button"><i class="ss-icon ss-symbolicons-standard icon icon-create">&#x002B;</i> New User</a>
</li>
%endif
</ul>
......
......@@ -134,7 +134,7 @@
<a href="#" class="toggle-button toggle-button-sections"><i class="ss-icon ss-symbolicons-block">up</i> <span class="label">Collapse All Sections</span></a>
</li>
<li class="nav-item">
<a href="#" class="new-button new-courseware-section-button"><span class="plus-icon white"></span> New Section</a>
<a href="#" class="button new-button new-courseware-section-button"><i class="ss-icon ss-symbolicons-standard icon icon-create">&#x002B;</i> New Section</a>
</li>
</ul>
</nav>
......
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