mmoser/skill-assessment-app
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

css: starting quiz styles

Browse Source
This commit is contained in:
Mark Moser 2017-05-03 13:22:22 -05:00
parent 9f3e90386e
commit 0f0e7ae75e
6 changed files with 33 additions and 39 deletions

2
app/assets/stylesheets/application.scss

@ -14,6 +14,7 @@
@import 'settings/variables';
@import 'settings/fonts';
@import 'settings/mixins';
/*= require normalize-css/normalize */
@import 'settings/reset';
@ -23,5 +24,6 @@
@import 'elements/body';
@import 'elements/progressbar';
@import 'elements/header';
@import 'elements/form-question';
// @import 'objects/';

18
app/assets/stylesheets/elements/_form-question.scss Normal file

@ -0,0 +1,18 @@
.form-question {
textarea {
display: block;
margin-top: 1em;
border: 0;
border-bottom: 1px solid;
padding: 1em 0.5em;
width: 100%;
line-height: 1.5;
font-size: 1em;
box-sizing: border-box;
}
div {
margin: $gutter 0;
}
}

5
app/assets/stylesheets/generic/_typography.scss

@ -1,5 +1,5 @@
body {
font-family: $primary-font-face;
@include primary-font;
font-size: 1em;
}
@ -9,7 +9,6 @@ h3,
h4,
h5,
h6 {
@include heading-font;
margin: 0 0 $gutter;
font-family: $heading-font-face;
font-weight: 100;
}

9
app/assets/stylesheets/settings/_mixins.scss Normal file

@ -0,0 +1,9 @@
@mixin primary-font {
font-family: $primary-font-face;
font-weight: 300;
}
@mixin heading-font {
font-family: $heading-font-face;
font-weight: 100;
}

7
app/views/quiz/question.html.erb

@ -5,14 +5,11 @@
content_for :progress, @status.progress.to_s
%>
<%= form_for(@answer, url: post_answer_path(@answer.id), html:{method: :post, id: 'answer-form', data: {qid: @question.question_id}}) do |form| %>
<%= form_for(@answer, url: post_answer_path(@answer.id), html:{method: :post, class: 'form-question', data: {qid: @question.question_id}}) do |form| %>
<h1><%= @question.question %></h1>
<% if @question.attachment.present? %>
<figure>
<%= image_tag @question.attachment%>
</figure>
<figure><%= image_tag @question.attachment%></figure>
<% end %>
<%= render partial: @question.input_type, locals: {question: @question, form: form, answer: @answer } %>

31
app/views/styleguide.html.erb

@ -23,37 +23,6 @@
<hr>
<h1>Font Families</h1>
<h2>HalisR</h2>
<div id="halisr">
<p id="primary-100">HalisR-100</p>
<p id="primary-200">HalisR-200</p>
<p id="primary-300">HalisR-300</p>
<p id="primary-400">HalisR-400</p>
<p id="primary-500">HalisR-500</p>
<p id="primary-600">HalisR-600</p>
<p id="primary-700">HalisR-700</p>
<p id="primary-800">HalisR-800</p>
<p id="primary-900">HalisR-900</p>
</div>
<h2>Lato</h2>
<div id="lato">
<p id="secondary-100">Lato-100</p>
<p id="secondary-300">Lato-300</p>
<p id="secondary-500">Lato-500</p>
<p id="secondary-700">Lato-700</p>
<p id="secondary-900">Lato-900</p>
<p id="secondary-100-i">Lato-Italic-100</p>
<p id="secondary-300-i">Lato-Italic-300</p>
<p id="secondary-500-i">Lato-Italic-500</p>
<p id="secondary-700-i">Lato-Italic-700</p>
<p id="secondary-900-i">Lato-Italic-900</p>
</div>
<hr>
<h1>Paragraph</h1>
<p>Lorem ipsum dolor sit amet, <a href="#" title="test link">test link</a> adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus. Maecenas ornare tortor. Donec sed tellus eget sapien fringilla nonummy. Mauris a ante. Suspendisse quam sem, consequat at, commodo vitae, feugiat in, nunc. Morbi imperdiet augue quis tellus.</p>