status-im
/
re-frame-10x
mirror of https://github.com/status-im/re-frame-10x.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Use slurp macro to read styles from .css file 

closes #24
This commit is contained in:
chris (daiyi) 2017-08-25 16:34:10 +02:00 committed by Daniel Compton
parent 91d4ac57f7
commit 483d1f5a16
3 changed files with 110 additions and 105 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
src/day8/re_frame/css/main.css Normal file
View File

@ -0,0 +1,100 @@
#--re-frame-trace-- {
background: white;
color: black;
font-family: 'courier new', monospace;
}
#--re-frame-trace-- tbody {
color: #aaa;
}
#--re-frame-trace-- tr:hover {
transition: all 0.1s ease-out;
background: aliceblue;
filter: brightness(90%);
}
#--re-frame-trace-- tr:nth-child(even) {
background: aliceblue;
}
#--re-frame-trace-- .button {
padding: 5px 5px 3px;
margin: 5px;
border-radius: 2px;
cursor: pointer;
}
#--re-frame-trace-- .text-button {
border-bottom: 1px dotted #888;
font-weight: normal;
}
#--re-frame-trace-- .button:focus,
#--re-frame-trace-- .text-button:focus {
border-radius: 2px 2px 0 0;
-webkit-box-shadow: inset 0px -5px 0px 0px rgba(0, 0, 0, 0.3);
-moz-box-shadow: inset 0px -5px 0px 0px rgba(0, 0, 0, 0.3);
box-shadow: inset 0px -5px 0px 0px rgba(0, 0, 0, 0.3);
}
#--re-frame-trace-- .icon-button {
font-size: 10px;
}
#--re-frame-trace-- .tab {
background: transparent;
border-radius: 0;
text-transform: uppercase;
font-family: monospace;
letter-spacing: 2px;
margin-bottom: 0;
padding-bottom: 4px;
vertical-align: bottom;
}
#--re-frame-trace-- .tab.active {
background: transparent;
border-bottom: 3px solid lightblue;
border-radius: 0;
padding-bottom: 1px;
}
#--re-frame-trace-- ul.filter-items {
list-style-type: none;
padding: 0;
margin: 0 -5px;
margin-top: 10px;
}
#--re-frame-trace-- .filter-items li {
color: #333;
background: #efefef;
display: inline-block;
font-size: 0.9em;
margin: 5px;
}
#--re-frame-trace-- .filter-items li .filter-item-string {
color: #616cdb;
}
#--re-frame-trace-- .icon {
display: inline-block;
width: 1em;
height: 1em;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
#--re-frame-trace-- .icon-remove {
margin-left: 10px;
}
#--re-frame-trace-- select {
background: white;
font-family: 'courier new', monospace;
font-size: 1em;
}
#--re-frame-trace-- .nav {
background: #efeef1;
color: #222;
}
#--re-frame-trace-- .panel-content-top {
flex: 1;
}
#--re-frame-trace-- .panel-content-scrollable {
margin: 10px 0 0 10px;
flex: 1 0 auto;
height: 100%;
overflow: auto;
}
#--re-frame-trace-- .filter-control {
margin: 10px 0 0 10px;
}

7
src/day8/re_frame/trace/macros.clj Normal file
View File

@ -0,0 +1,7 @@
(ns day8.re-frame.trace.macros
(:require [clojure.java.io :as io]))
(defmacro slurp-macro
"Reads a file as a string. Slurp is wrapped in a macro so it can interact with local files before clojurescript compilation."
[path]
(slurp (io/resource path)))

108
src/day8/re_frame/trace/styles.cljs
View File

@ -1,106 +1,4 @@
(ns day8.re-frame.trace.styles)
(ns day8.re-frame.trace.styles
(:require-macros [day8.re-frame.trace.macros :as macros]))
(defonce panel-styles "
#--re-frame-trace-- {
background: white;
color: black;
font-family: 'courier new', monospace;
}
#--re-frame-trace-- tbody {
color: #aaa;
}
#--re-frame-trace-- tr:hover {
transition: all 0.1s ease-out;
background: aliceblue;
filter: brightness(90%);
}
#--re-frame-trace-- tr:nth-child(even) {
background: aliceblue;
}
#--re-frame-trace-- .button {
padding: 5px 5px 3px;
margin: 5px;
border-radius: 2px;
cursor: pointer;
}
#--re-frame-trace-- .text-button {
border-bottom: 1px dotted #888;
font-weight: normal;
}
#--re-frame-trace-- .button:focus, .text-button:focus {
border-radius: 2px 2px 0 0;
-webkit-box-shadow: inset 0px -5px 0px 0px rgba(0,0,0,0.3);
-moz-box-shadow: inset 0px -5px 0px 0px rgba(0,0,0,0.3);
box-shadow: inset 0px -5px 0px 0px rgba(0,0,0,0.3);
}
#--re-frame-trace-- .icon-button {
font-size: 10px;
}
#--re-frame-trace-- button.tab {
}
#--re-frame-trace-- .tab {
background: transparent;
border-radius: 0;
text-transform: uppercase;
font-family: monospace;
letter-spacing: 2px;
margin-bottom: 0;
padding-bottom: 4px;
vertical-align: bottom;
}
#--re-frame-trace-- .tab.active {
background: transparent;
border-bottom: 3px solid lightblue;
border-radius: 0;
padding-bottom: 1px;
}
#--re-frame-trace-- ul.filter-items {
list-style-type: none;
padding: 0;
margin: 0 -5px;
margin-top: 10px;
}
#--re-frame-trace-- .filter-items li {
color: #333;
background: #efefef;
display: inline-block;
font-size: 0.9em;
margin: 5px;
}
#--re-frame-trace-- .filter-items li .filter-item-string {
color: #616cdb;
}
#--re-frame-trace-- .icon {
display: inline-block;
width: 1em;
height: 1em;
stroke-width: 0;
stroke: currentColor;
fill: currentColor;
}
#--re-frame-trace-- .icon-remove {
margin-left: 10px;
}
#--re-frame-trace-- select {
background: white;
font-family: 'courier new', monospace;
font-size: 1em;
}
#--re-frame-trace-- .nav {
background: #efeef1;
color: #222;
}
#--re-frame-trace-- .panel-content-top {
flex: 1;
}
#--re-frame-trace-- .panel-content-scrollable {
margin: 0 0 10px 5px;
overflow: auto;
flex: 1 1 auto;
}
#--re-frame-trace-- .filter-control {
margin: 10px 0 0 10px;
flex: none;
}
")
(def panel-styles (macros/slurp-macro "day8/re_frame/css/main.css"))