Make Snipt full-width.

master
Nick Sergeant 2015-10-05 10:14:03 -04:00
parent 2c7644c121
commit 55babd51d2
7 changed files with 52 additions and 52 deletions

View File

@ -12,7 +12,6 @@
{% endblock %} {% endblock %}
{% block page-description %}{% endblock %} {% block page-description %}{% endblock %}
{% block rochester-made %}{% endblock %}
{% block keyboard-shortcuts %}{% endblock %} {% block keyboard-shortcuts %}{% endblock %}
{% block olark %}{% endblock %} {% block olark %}{% endblock %}
{% block js %} {% block js %}

File diff suppressed because one or more lines are too long

View File

@ -119,7 +119,7 @@ header.main {
height: 65px; height: 65px;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
width: 939px; width: 95%;
div.shadey { div.shadey {
background: transparent url('../img/header-inner-bg.png') top left no-repeat; background: transparent url('../img/header-inner-bg.png') top left no-repeat;
@ -135,6 +135,7 @@ header.main {
padding: 17px 0 0 20px; padding: 17px 0 0 20px;
position: relative; position: relative;
z-index: 50; z-index: 50;
width: 25%;
input { input {
background: #17484F url('../img/search-icon.png') top left no-repeat; background: #17484F url('../img/search-icon.png') top left no-repeat;
@ -145,7 +146,7 @@ header.main {
height: auto; height: auto;
margin: 0; margin: 0;
padding: 7px 7px 7px 28px; padding: 7px 7px 7px 28px;
width: 154px; width: 86%;
@include border-radius(3px); @include border-radius(3px);
@include inset-box-shadow(0, 1px, 0px, #1D4249); @include inset-box-shadow(0, 1px, 0px, #1D4249);
@ -212,7 +213,6 @@ header.main {
} }
} }
aside.nav { aside.nav {
border-left: 1px solid rgba(229, 229, 229, .25);
float: right; float: right;
height: 65px; height: 65px;
margin: 0; margin: 0;
@ -220,7 +220,6 @@ header.main {
width: 189px; width: 189px;
a.mini-profile { a.mini-profile {
border-right: 1px solid rgba(#4D6768, .25);
display: block; display: block;
padding: 14px 13px 8px 13px; padding: 14px 13px 8px 13px;
@ -367,15 +366,14 @@ header.sub {
border-left: 1px solid #d0d0d0; border-left: 1px solid #d0d0d0;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
width: 939px; width: 95%;
z-index: 49; z-index: 49;
ul.bcrumb { ul.bcrumb {
border-right: 1px solid #d0d0d0;
float: left; float: left;
margin: 0; margin: 0;
padding-left: 16px; padding-left: 16px;
width: 733px; width: 82%;
li { li {
display: inline-block; display: inline-block;
@ -453,7 +451,7 @@ section.main {
height: 100%; height: 100%;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
width: 940px; width: 95%;
.site-notice { .site-notice {
border-left: 1px solid #DDDDDD; border-left: 1px solid #DDDDDD;
@ -484,17 +482,18 @@ section.main {
margin-left: 0; margin-left: 0;
} }
div.right-y { div.right-y {
margin-left: 750px; margin-left: 77%;
} }
div.inner { div.inner {
box-sizing: border-box;
float: left; float: left;
margin-left: 1px; padding-left: 1px;
width: 749px; width: 81%;
} }
aside.main { aside.main {
float: right; float: right;
padding-top: 30px; padding-top: 30px;
width: 190px; width: 18%;
div.save-nate { div.save-nate {
a { a {
@ -649,7 +648,7 @@ section.main {
margin: 0; margin: 0;
li { li {
background: transparent url('../img/api-icon.png') center left no-repeat; background: transparent url('../img/api-icon.png') top left no-repeat;
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding-left: 22px; padding-left: 22px;
@ -657,7 +656,7 @@ section.main {
a { a {
color: #999; color: #999;
display: block; display: block;
font: bold 12px $Helvetica; font: bold 12px/18px $Helvetica;
padding: 3px 0; padding: 3px 0;
text-decoration: none; text-decoration: none;
@ -681,13 +680,13 @@ section.main {
padding-top: 1px; padding-top: 1px;
} }
&.twitter { &.twitter {
background: transparent url('../img/twitter-icon.png') 4px center no-repeat; background: transparent url('../img/twitter-icon.png') 4px 7px no-repeat;
} }
&.pro { &.pro {
background: transparent url('../img/upgrade-icon.png') 2px center no-repeat; background: transparent url('../img/upgrade-icon.png') 2px 7px no-repeat;
} }
&.groups { &.groups {
background: transparent url('../img/groups-icon.png') 2px center no-repeat; background: transparent url('../img/groups-icon.png') 2px 7px no-repeat;
} }
&:first-of-type { &:first-of-type {
a { a {
@ -695,10 +694,10 @@ section.main {
} }
} }
&.blog { &.blog {
background: transparent url('../img/blog-icon.png') 3px center no-repeat; background: transparent url('../img/blog-icon.png') 3px 7px no-repeat;
} }
&.roadmap { &.roadmap {
background: transparent url('../img/roadmap-icon.png') 2px center no-repeat; background: transparent url('../img/roadmap-icon.png') 2px 7px no-repeat;
} }
} }
} }
@ -781,7 +780,7 @@ article.snipt {
border-left: 0; border-left: 0;
float: left; float: left;
position: relative; position: relative;
width: 618px; width: 85%;
div.ruler { div.ruler {
background: #DDD; background: #DDD;
@ -1061,9 +1060,9 @@ article.snipt {
} }
} }
aside { aside {
float: right; float: left;
margin: 23px 30px 0 0; margin: 23px 0 0 0;
width: 100px; width: 14%;
ul.options { ul.options {
margin: 0; margin: 0;
@ -1236,7 +1235,7 @@ article.snipt {
&.raw { &.raw {
background-image: none; background-image: none;
float: right; float: right;
margin-right: 130px; margin-right: 15%;
} }
&.tweet { &.tweet {
background: none; background: none;
@ -1514,7 +1513,7 @@ div.modal {
div#disqus_thread { div#disqus_thread {
margin-bottom: 0; margin-bottom: 0;
margin-left: 15px; margin-left: 15px;
width: 719px; width: 97%;
#dsq-content { #dsq-content {
margin-top: -44px; margin-top: -44px;
@ -1660,6 +1659,7 @@ div.dmca {
border-top: 1px solid #DDDDDD; border-top: 1px solid #DDDDDD;
font-size: 18px; font-size: 18px;
line-height: 26px; line-height: 26px;
margin-top: 50px;
padding: 40px; padding: 40px;
position: relative; position: relative;
text-align: center; text-align: center;
@ -1672,7 +1672,7 @@ body.account {
aside { aside {
float: left; float: left;
padding-top: 35px; padding-top: 35px;
width: 190px; width: 16%;
ul { ul {
li { li {
@ -1693,9 +1693,10 @@ body.account {
background: white; background: white;
border-bottom: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD;
border-left: 4px solid #DDDDDD; border-left: 4px solid #DDDDDD;
box-sizing: border-box;
float: right; float: right;
min-height: 272px; min-height: 272px;
width: 555px; width: 84%;
@include multi-border-radius(0, 0, 0, 10px); @include multi-border-radius(0, 0, 0, 10px);
div.def { div.def {
@ -1993,7 +1994,7 @@ body.search {
margin-bottom: 0; margin-bottom: 0;
input.search-query { input.search-query {
width: 460px; width: 73%;
} }
label.mine-only { label.mine-only {
margin: -7px 10px 0 10px; margin: -7px 10px 0 10px;
@ -2078,7 +2079,7 @@ body.snipt-page {
} }
} }
div#disqus_thread { div#disqus_thread {
width: 719px; width: 97%;
} }
} }
body.signup { body.signup {
@ -2179,7 +2180,7 @@ body.static {
} }
div#disqus_thread { div#disqus_thread {
margin-left: 20px; margin-left: 20px;
width: 709px; width: 96%;
div#dsq-content { div#dsq-content {
margin-top: 23px; margin-top: 23px;
@ -2300,15 +2301,12 @@ body.editing {
float: none; float: none;
margin: 0 auto; margin: 0 auto;
padding-top: 6px; padding-top: 6px;
width: 940px; width: 95%;
.cancel, .save, .save-and-close { .cancel, .save, .save-and-close {
float: right; float: right;
margin-left: 10px; margin-left: 10px;
} }
.save-and-close {
margin-right: 242px;
}
} }
} }
section.main { section.main {
@ -2319,7 +2317,8 @@ body.editing {
margin-top: 15px; margin-top: 15px;
div.container { div.container {
width: 839px; box-sizing: border-box;
width: 78%;
header { header {
h1 { h1 {
@ -2363,7 +2362,7 @@ body.editing {
margin-top: 50px; margin-top: 50px;
} }
div.container { div.container {
width: 696px; width: 78%;
section.code { section.code {
padding: 0; padding: 0;
@ -2395,8 +2394,7 @@ body.editing {
color: #666; color: #666;
font: bold 16px/20px $Helvetica; font: bold 16px/20px $Helvetica;
margin: 0; margin: 0;
width: 811px; width: 97%;
width: 666px;
} }
} }
h2 { h2 {
@ -2406,7 +2404,7 @@ body.editing {
} }
aside { aside {
margin-top: 0; margin-top: 0;
width: 243px; width: 22%;
div.type-lexer { div.type-lexer {
padding-right: 10px; padding-right: 10px;
@ -2432,10 +2430,11 @@ body.editing {
margin-top: 6px; margin-top: 6px;
} }
textarea { textarea {
box-sizing: border-box;
height: 100px; height: 100px;
font: normal 12px $Helvetica; font: normal 12px $Helvetica;
padding: 7px 9px; padding: 7px 9px;
width: 202px; width: 96%;
} }
label.public, label.blog-post { label.public, label.blog-post {
background: #EFEEEF; background: #EFEEEF;

View File

@ -74,7 +74,7 @@
</label> </label>
</div> </div>
<div class="editor-settings"> <div class="editor-settings">
<h2>Editor settings <a href="/account/" target="blank">change defaults</a></h2> <h2>Editor settings <a href="/account/" target="blank">change &raquo;</a></h2>
<h4>F11 or Cmd+Enter toggles fullscreen mode</h4> <h4>F11 or Cmd+Enter toggles fullscreen mode</h4>
<label class="lexer"><span>Editor<span></label> <label class="lexer"><span>Editor<span></label>
<select name="editor" id="id_editor"> <select name="editor" id="id_editor">

View File

@ -2,7 +2,7 @@
<h1>Popular public tags</h1> <h1>Popular public tags</h1>
<ul> <ul>
<li> <li>
<a href="/public/tag/as3/" {% if tag.name == 'as3' %}class="active"{% endif %}><span>as3</span></a> <a href="/public/tag/angular/" {% if tag.name == 'angular' %}class="active"{% endif %}><span>angular</span></a>
</li> </li>
<li> <li>
<a href="/public/tag/bash/" {% if tag.name == 'bash' %}class="active"{% endif %}><span>bash</span></a> <a href="/public/tag/bash/" {% if tag.name == 'bash' %}class="active"{% endif %}><span>bash</span></a>
@ -19,6 +19,9 @@
<li> <li>
<a href="/public/tag/drupal/" {% if tag.name == 'drupal' %}class="active"{% endif %}><span>drupal</span></a> <a href="/public/tag/drupal/" {% if tag.name == 'drupal' %}class="active"{% endif %}><span>drupal</span></a>
</li> </li>
<li>
<a href="/public/tag/ember/" {% if tag.name == 'ember' %}class="active"{% endif %}><span>ember</span></a>
</li>
<li> <li>
<a href="/public/tag/git/" {% if tag.name == 'git' %}class="active"{% endif %}><span>git</span></a> <a href="/public/tag/git/" {% if tag.name == 'git' %}class="active"{% endif %}><span>git</span></a>
</li> </li>
@ -49,6 +52,12 @@
<li> <li>
<a href="/public/tag/python/" {% if tag.name == 'python' %}class="active"{% endif %}><span>python</span></a> <a href="/public/tag/python/" {% if tag.name == 'python' %}class="active"{% endif %}><span>python</span></a>
</li> </li>
<li>
<a href="/public/tag/rails/" {% if tag.name == 'rails' %}class="active"{% endif %}><span>rails</span></a>
</li>
<li>
<a href="/public/tag/react/" {% if tag.name == 'react' %}class="active"{% endif %}><span>react</span></a>
</li>
<li> <li>
<a href="/public/tag/ruby/" {% if tag.name == 'ruby' %}class="active"{% endif %}><span>ruby</span></a> <a href="/public/tag/ruby/" {% if tag.name == 'ruby' %}class="active"{% endif %}><span>ruby</span></a>
</li> </li>

View File

@ -249,13 +249,6 @@
{% endblock %} {% endblock %}
<div class="inner"> <div class="inner">
{% block content %}{% endblock %} {% block content %}{% endblock %}
{% block rochester-made %}
<div class="rochester-made">
<a href="http://rochestermade.com/" title="Proudly made in Rochester, NY, USA">
<img src="{{ STATIC_URL }}img/rochester-made.png" alt="" />
</a>
</div>
{% endblock %}
</div> </div>
<div class="left-y ruler"></div> <div class="left-y ruler"></div>
<div class="right-y ruler"></div> <div class="right-y ruler"></div>

View File

@ -2,7 +2,7 @@
<div class="profile group"> <div class="profile group">
<a href="/{{ user.username }}/"> <a href="/{{ user.username }}/">
<img src="https://secure.gravatar.com/avatar/{{ user.email|md5 }}?s=175" alt="{{ user.username }}" title="{{ user.username }}" /> <img src="https://secure.gravatar.com/avatar/{{ user.email|md5 }}?s=300" alt="{{ user.username }}" title="{{ user.username }}" />
</a> </a>
<div class="meta"> <div class="meta">
<div class="username" title="{{ user.username }}"> <div class="username" title="{{ user.username }}">