padding-top: 46px;
}
+#course_header
+{
+ padding-bottom: 20px;
+ margin-bottom: 20px;
+}
+
#course_subhead
{
font-family: "MuseoSans-900";
.activity_details_context, .activity_details_context a
{
- font-size: 12px;
- line-height: 1em;
+ font-family: "MuseoSlab-900";
+ font-size: 11px;
+ text-transform: uppercase;
+ line-height: 200%;
}
.activity_details_callout
.inline-form {
border-bottom: 1px dashed #666;
}
-
-/* Social buttons */
-.social-button {
- margin: 10px 5px 10px 5px;
- float: right;
-}
\ No newline at end of file
/* NOTE PAGE */
+#note_header
+{
+ margin-bottom: 20px;
+}
+
#note_content, #course_content, #school_content
{
padding-top: 46px;
padding-bottom: 45px;
}
+#social-buttons {
+ padding-bottom: 10px;
+}
+
/* COURSES */
#course_meta, #school_meta
{% block pagestyle %}
<link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/note_course_pages.css">
+ <link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/course.css">
{% endblock %}
{% block content %}
<section id="course_content">
- <div id="course_header">
-
+ <div id="course_header" class="hero_gradient_bar">
<div class="row">
- <div id="breadcrumbs" class="small-12 hide-for-small columns">
- <ul class="breadcrumbs">
- <li><a href="/">Home</a></li>
- <li class="unavailable"><a href="#">{{ course.school.name }}</a></li>
- <li class="current"><a href="{{ course.get_absolute_url }}">{{ course.name }}</a></li>
- </ul>
+ <div id="course_subhead" class="twelve columns">
+ course
</div><!-- /course_subhead -->
</div>
<div class="row">
- <div id="course_name" class="small-12 columns">
+ <div id="note_name" class="small-12 columns">
{% if course.url %}
<a rel="nofollow" href="{{ course.url }}">
{{ course.name }}
</div>
<div class="row">
- <div id="course_meta" class="small-12 columns">
- <div class="course_details">
- {{ course.instructor_name }} | {{ course.school.name }}
+ <div id="course_meta" class="twelve columns">
+ <div class="activity_details_context">
+ {{ course.instructor_name }} // {{ course.school.name }}
</div><!-- /activity_details_context -->
</div><!-- /course_meta -->
</div>
+ </div><!-- /course_header -->
- <div class="row">
- <div class="small-10 columns small-offset-1"> <hr/> </div>
- </div>
- {% include 'partial/filepicker.html' %}
+ <div class="row">
+ <div class="small-10 columns small-offset-1"> <hr/> </div>
+ </div>
- {% if request.GET.thankyou == '' %}
- <div id=thankyou-wrapper class="row">
- <div class="small-8 columns small-offset-2">
- <div id="thankyou">
- <p>
- Thank you for uploading
- <a href="{{ request.GET.url }}">{{ request.GET.name }}</a>.
- Share another or take a
- <a href="https://docs.google.com/a/finalsclub.org/spreadsheet/viewform?usp=sharing&formkey=dFg1WnI2cUVfckZyYnJpZ0ExQmUxSnc6MQ#gid=0" target="_blank">quick survey</a> to help us make KarmaNotes even better.
- </p>
- <script>
- // when showing the thankyou button, flash it orangered first
- $(function() {
- $("#thankyou").effect("highlight", {'color': '#f05a28'}, 3000);
- });
- </script>
+ {% include 'partial/filepicker.html' %}
- </div><!-- /thankyou -->
- </div>
- </div> <!-- .row -->
- {% endif %}
+ {% if request.GET.thankyou == '' %}
+ <div id=thankyou-wrapper class="row">
+ <div class="small-8 columns small-offset-2">
+ <div id="thankyou">
+ <p>
+ Thank you for uploading
+ <a href="{{ request.GET.url }}">{{ request.GET.name }}</a>.
+ Share another or take a
+ <a href="https://docs.google.com/a/finalsclub.org/spreadsheet/viewform?usp=sharing&formkey=dFg1WnI2cUVfckZyYnJpZ0ExQmUxSnc6MQ#gid=0" target="_blank">quick survey</a> to help us make KarmaNotes even better.
+ </p>
+ <script>
+ // when showing the thankyou button, flash it orangered first
+ $(function() {
+ $("#thankyou").effect("highlight", {'color': '#f05a28'}, 3000);
+ });
+ </script>
- <div class="row">
- <div class="small-10 columns small-offset-1"> <hr/> </div>
+ </div><!-- /thankyou -->
</div>
+ </div> <!-- .row -->
+ {% endif %}
- </div><!-- /course_header -->
+ <div class="row">
+ <div class="small-10 columns small-offset-1"> <hr/> </div>
+ </div>
+
<div id="course_container">
{% endfor %}
</div>
</div>
-
</div><!-- /course_container -->
{% comment %}
{% extends "base.html" %}
{% load url from future %}
+{% block title %}
+ {{ note.name }}
+{% endblock %}
+
{% block pagestyle %}
<link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/note_course_pages.css">
{% endblock %}
{% block content %}
<section id="note_content">
- <div id="course_header">
+ <div id="note_header" class="hero_gradient_bar">
<div class="row">
- <div id="breadcrumbs" class="small-12 hide-for-small columns ">
- <ul class="breadcrumbs">
- <li><a href="/">Home</a></li>
- <li class="unavailable"><a>{{ note.course.school.name }}</a></li>
- <li><a href="{{ note.course.get_absolute_url }}">{{ note.course.name }}</a></li>
- <li class="current"><a href="{{ note.get_absolute_url }}">{{ note.name }}</a></li>
- </ul>
-
- </div><!-- /course_subhead -->
+ <div id="note_back_to_course" class="twelve columns">
+ <a href="{{note.course.get_absolute_url}}">
+ <i class="fa fa-arrow-left"></i> back to {{ note.course.name }}
+ </a>
+ </div>
</div>
<div class="row">
- <div id="course_name" class="small-12 columns">
+ <div id="note_name" class="twelve columns">
{{ note.name }}
+ <hr/>
</div><!-- /note_name -->
</div>
- <div class="row">
- <div class="small-10 small-centered columns small-offset-1 center" style="padding-bottom: 20px;">
- <hr/>
+ <div id="social-buttons" class="row">
+ <div class="small-4 columns small-centered show-for-medium-up">
+ <div class="row">
+ <div class="small-4 columns center">
+ <script type="text/javascript" src="http://www.reddit.com/static/button/button2.js"></script>
+ </div>
+ <div class="small-4 columns center">
+ <div class="g-plusone"
+ data-href="https://karmanotes.org{% url 'note_detail' note.course.school.slug note.course.slug note.slug %}"
+ data-size="tall"
+ data-annotation="bubble"
+ data-width="25"></div>
+ </div>
+ <div class="small-4 columns center">
+ <div class="fb-like"
+ data-href="https://karmanotes.org{% url 'note_detail' note.course.school.slug note.course.slug note.slug %}"
+ data-width="12"
+ data-layout="box_count"
+ data-action="recommend"
+ data-show-faces="false"
+ data-share="true"></div>
+ </div>
+ </div>
+ </div>
+ </div><!-- /note_actions -->
+ </div>
+
+ <div class="row zoom-buttons">
+ <div class="small-2 small-centered columns center" style="padding-bottom: 20px;">
<i id="minus-btn" class="fa fa-search-minus fa-2x" style="margin-right: 10px; cursor: pointer"></i>
<i id="plus-btn" class="fa fa-search-plus fa-2x" style="cursor: pointer"></i>
</div>
<div class="small-12 small-centered columns medium-12 large-12 body_copy">
{% if note.html %}
<div class="note-text">
- <iframe style="border:none; width:100%; min-height: 700px;" id="noteframe" src="/raw/{{ note.id }}" onload="autoResize('noteframe')"> </iframe>
+ <iframe style="border:none; width:100%; min-height: 1000px;" id="noteframe" src="/raw/{{ note.id }}" onload="autoResize('noteframe')"> </iframe>
</div> <!-- .note-text -->
{% else %} {# note.html #}
</section><!--/note_content-->
- <div id="social-buttons" class="show-for-medium-up" style="position: fixed; right: 0px; bottom: 0px;">
- <div class="social-button">
- <script type="text/javascript" src="http://www.reddit.com/static/button/button2.js"></script>
- </div>
- <div class="social-button">
- <div class="g-plusone"
- data-href="https://karmanotes.org{% url 'note_detail' note.course.school.slug note.course.slug note.slug %}"
- data-size="tall"
- data-annotation="bubble"
- data-width="25"
- data-align="left"
- expandTo="left"></div>
- </div>
- <div class="social-button">
- <div class="fb-like"
- data-href="https://karmanotes.org{% url 'note_detail' note.course.school.slug note.course.slug note.slug %}"
- data-width="12"
- data-layout="box_count"
- data-action="recommend"
- data-show-faces="false"
- data-share="true"></div>
- </div>
- </div>
{% endblock %}