diff options
Diffstat (limited to 'app/assets/stylesheets')
| -rw-r--r-- | app/assets/stylesheets/app.scss | 5 | ||||
| -rw-r--r-- | app/assets/stylesheets/application.css | 3 | ||||
| -rw-r--r-- | app/assets/stylesheets/application.scss | 5 | ||||
| -rw-r--r-- | app/assets/stylesheets/components/type.scss | 8 | ||||
| -rw-r--r-- | app/assets/stylesheets/home.scss | 3 | ||||
| -rw-r--r-- | app/assets/stylesheets/layouts/_global.scss | 142 | ||||
| -rw-r--r-- | app/assets/stylesheets/layouts/reset.scss | 1 |
7 files changed, 166 insertions, 1 deletions
diff --git a/app/assets/stylesheets/app.scss b/app/assets/stylesheets/app.scss new file mode 100644 index 0000000..47695ad --- /dev/null +++ b/app/assets/stylesheets/app.scss @@ -0,0 +1,5 @@ +@import "layouts/reset"; + +@import "components/type"; + +@import "layouts/global"; diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index f9cd5b3..b1bc0e8 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -10,6 +10,7 @@ * defined in the other CSS/SCSS files in this directory. It is generally better to create a new * file per style scope. * - *= require_tree . + *= require app *= require_self + * */ diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/application.scss new file mode 100644 index 0000000..47695ad --- /dev/null +++ b/app/assets/stylesheets/application.scss @@ -0,0 +1,5 @@ +@import "layouts/reset"; + +@import "components/type"; + +@import "layouts/global"; diff --git a/app/assets/stylesheets/components/type.scss b/app/assets/stylesheets/components/type.scss new file mode 100644 index 0000000..7e8fc05 --- /dev/null +++ b/app/assets/stylesheets/components/type.scss @@ -0,0 +1,8 @@ +.font-weight-semibold { + font-weight: 600; +} + + +.font-size-28 { + font-size: 28px; +} diff --git a/app/assets/stylesheets/home.scss b/app/assets/stylesheets/home.scss new file mode 100644 index 0000000..f0ddc68 --- /dev/null +++ b/app/assets/stylesheets/home.scss @@ -0,0 +1,3 @@ +// Place all the styles related to the home controller here. +// They will automatically be included in application.css. +// You can use Sass (SCSS) here: http://sass-lang.com/ diff --git a/app/assets/stylesheets/layouts/_global.scss b/app/assets/stylesheets/layouts/_global.scss new file mode 100644 index 0000000..5113083 --- /dev/null +++ b/app/assets/stylesheets/layouts/_global.scss @@ -0,0 +1,142 @@ +body { + font-family: Avenir, Verdana, Helvetica, sans-serif; + color: #170e0b; +} + + +.display-block { + display: block; +} + +.display-none { + display: none !important; +} + + +.margin-top-70 { + margin-top: 70px; +} + + +.padding-13 { + padding: 13px; +} + + +.position-relative { + position: relative; +} + +.position-fixed { + position: fixed; +} + + +.top-0 { + top: 0; +} + + +.min-height-100\% { + min-height: 100%; +} + + +.header { + background-color: rgb(229, 226, 216); + width: 100%; + height: 30px; + padding: 20px; + + .right-button { + position: absolute; + right: 40px; + top: -33px; + } +} + + +$sidebar-width: 250px; + +.sidebar { + background-color: rgb(242, 239, 239); + width: $sidebar-width; + height: 100%; + border-right: 2px solid rgb(234, 224, 224); + overflow: auto; + + .sidebar-link { + border-bottom: 1px solid rgb(213, 202, 202); + color: rgb(18, 113, 18); + text-decoration: none; + } + + .sidebar-link:hover, + .active { + background: #249124; /* Old browsers */ + background: -moz-linear-gradient(top, #249124 0%, #127112 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#249124), color-stop(100%,#127112)); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, #249124 0%,#127112 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, #249124 0%,#127112 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, #249124 0%,#127112 100%); /* IE10+ */ + background: linear-gradient(to bottom, #249124 0%,#127112 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#249124', endColorstr='#127112',GradientType=0 ); /* IE6-9 */ + + color: #ddd; + } + + .delete-link { + position: absolute; + display: block; + margin-left: 220px; + margin-top: -34px; + height: 24px; + width: 24px; + background-color: #E75F5F; + border-radius: 50%; + color: #FFFCFC; + font-size: 25px; + text-decoration: none; + + span { + position: relative; + left: 3px; + } + + &:hover { + background-color: #E54343; + } + + &:active { + background-color: #D22121; + } + } +} + + +.note-editor { + margin-left: $sidebar-width; + padding: 12px 15px; + font: 18px/1.7 Georgia, Times, serif; + outline: none; +} + + +.button { + padding: 12px 15px; + background-color: rgb(18, 113, 18); + color: #ddd; + text-decoration: none; + border-radius: 6px; +} + +.button:hover { + background-color: #178E17; + color: #eee; +} + +.button:active { + color: #ddd; + -webkit-box-shadow:inset 0 2px 4px 0 #0D4F0D; + box-shadow:inset 0 2px 4px 0 #0D4F0D; +} diff --git a/app/assets/stylesheets/layouts/reset.scss b/app/assets/stylesheets/layouts/reset.scss new file mode 100644 index 0000000..685c00a --- /dev/null +++ b/app/assets/stylesheets/layouts/reset.scss @@ -0,0 +1 @@ +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0} |