Skip to content

Instantly share code, notes, and snippets.

@irmaus
Last active April 26, 2017 04:01
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Embed
What would you like to do?
You can also add some default styling for the shareprice table and share price chart by including the following styles
.irmau-small-chart .quoteapi-chart {
width: 200px;
height: 100px;
padding: 7px 13px 13px 32px;
font-size: 11px;
color: #2e2e2e;
}
.irmau-small-chart .quoteapi-chart-panel {
height: 80px;
background: #ccc;
}
.irmau-small-chart .quoteapi-chart-panel-plot-area {
padding: 0;
}
.irmau-small-chart .quoteapi-chart-xaxis-spacing {
width: 24px;
}
.irmau-small-chart .quoteapi-chart-yaxis-spacing {
height: 24px;
}
.irmau-small-chart .quoteapi-chart-xaxis-label {
margin-top: -3px;
}
.irmau-small-chart .quoteapi-chart-panel-border {
stroke: #2e2e2e;
}
.irmau-small-chart .quoteapi-chart-gridline {
stroke: #fff;
}
.irmau-small-chart .quoteapi-chart-minor-gridline {
stroke: none;
}
.irmau-small-chart .quoteapi-chart-tick {
stroke: none;
}
.irmau-small-chart .quoteapi-chart-price {
stroke: #009fd9;
stroke-width: 1px;
}
.irmau-small-chart .quoteapi-chart-price-fill {
fill: #9fcee0;
fill-opacity: 0.3;
}
/* main chart (and nav chart) */
.irmau-main-chart .quoteapi-chart {
width: 100%;
padding: 8px 50px 50px 50px;
font-size: 10px;
color: #2e2e2e;
}
.irmau-main-chart .quoteapi-chart-panel {
height: 250px;
background: #f2f2f2;
background: linear-gradient(0deg, #f2f2f2, #fff);
}
.irmau-main-chart .quoteapi-chart-panel-plot-area {
padding: 0;
}
.irmau-main-chart .quoteapi-chart-panel-border {
stroke: #858688;
stroke-opacity: 0.5;
}
.irmau-main-chart .quoteapi-chart-price {
stroke: #00429d;
stroke-width: 1px;
}
.irmau-main-chart .quoteapi-chart-price-fill {
fill: #00429d;
fill-opacity: 0.05;
}
.irmau-main-chart .quoteapi-chart-volume {
stroke: #496396;
stroke-opacity: 0.4;
}
.irmau-main-chart .quoteapi-chart-announcement-marker {
fill: #496396;
}
.irmau-main-chart .quoteapi-chart-price-sensitive-announcement-marker {
fill: #496396;
}
.irmau-nav-chart .quoteapi-chart-panel {
height: 90px;
}
.irmau-nav-chart .quoteapi-chart-price {
stroke-width: 1.5px;
}
.irmau-nav-chart .quoteapi-nav-chart-outside-range {
fill: #fff;
fill-opacity: 0.666;
}
.irmau-nav-chart .quoteapi-nav-chart-gadget {
stroke: #9b9c9d;
}
.sptable{
margin: 0 auto !important;
}
.sptable .columns {
width:8.3%;
padding: 0;
}
.sptable .column:last-child:not(:first-child), .sptable .columns:last-child:not(:first-child){
float: left;
}
.sptable h4 {
font-size: 14px;
text-align: center;
margin: 0;
min-height: 60px;
background: #CCC;
color: #444;
padding: 10px 0;
}
.sptable p {
margin: 0;
text-align: center;
background: #EEE;
padding: 10px 0;
min-height: 50px;
}
.chart-button button:hover {
background:#063669;
border: 3px solid #063669;
color:#FFF;
box-shadow:0px 0px 5px rgba(0,0,0,0.5);
}
.chart-button button {
border: 3px solid #CCC;
padding:10px 20px;
border-radius: 3px;
}
.chart-buttons {
text-align: center;
margin-bottom:20px;
}
.chart-tabs {
display:flex;
}
.chart-tab:hover {
background:rgba(0,0,0,0.10);
}
.chart-tab {
display:inline-block;
padding:5px 10px;
margin:0;
border:1px solid #CCC;
border-width: 1px 1px 0px 1px;
cursor:pointer;
}
.chart-tab-current {
background:rgba(0,0,0,0.05);
}
.chart-tab-content {
display:flex;
padding:20px 0;
border:1px solid #CCC;
}
.chart-buttons li:hover {
background:#063669;
color:#FFF;
text-shadow:1px 1px 2px #000;
border:1px solid #063669;
}
.chart-buttons li {
color:#444;
background:#FFF;
display: inline-block;
cursor: pointer;
padding: 4px 8px;
font-size:14px;
border-radius: 3px;
border:1px solid #CCC;
}
.centered {
text-align: center;
}
.irmau-from-to {
margin-bottom:20px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment