MuseScore.svg.css

/*
Muse Score SVG sheet music styles, by element type: text, polyline, path, font.
*/

/* All the visually animated elements are <text>. It seems that if I set a
   fill attribute value for an animated SVG <text> in CSS, I cannot set
   the fill value from code during the animation.  So animated elements
   do not have a fill value defined here in CSS. This forces me to add fill
   attribute values for each <text> class explicitly. Oh well. */
/* Is it more efficient to declare: text.Note or .Note? */

/* One place to set music font from javascript */
text {
    font-family:MScore;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

/** Animated text styles **/
.Accidental, .Articulation, .Clef, .Harmony, .Hook, .KeySig, .Note, .NoteDot,
.Rest, .TimeSig           {    font-size:20px;    }

.Note, .NoteDot, .Rest,
.Harmony, .RehearsalMark  {       cursor:crosshair;} /* clickable elements */

.ClefCourtesy             {    font-size:15px;    }

.Harmony, .SystemText     {  font-family:sans-serif;
                               font-size:12px;
                             font-weight:bold;    }
.Harmony                  {         } /* ??? Will this animate? NO, it requires alt code and/or alt class */
.SystemText               {         fill:#A0A0A0; } /* not animated at this time */

/** Inanimate text that uses alphanumeric characters/fonts **/
/* Biolinum 12 */
.InstrumentName           {  font-family:"White Rabbit", monospace;
                               font-size:12px;    }

.Tempo                    {  font-family:'Biolinum';
                               font-size:12px;    }

.InstrumentName           {         fill:#303000;
                             font-weight:bold;    }
/* Biolinum 11 */
.Lyrics                   {  font-family:'Biolinum';
                               font-size:10.5px;    }

text.RehearsalMark,
.StaffText                {  font-family:'Biolinum';
                               font-size:11px;    }

text.RehearsalMark        {         fill:#400070;
                             text-anchor:middle;
                             font-weight:bold;    }

.StaffText                {         fill:#606060;
                              font-style:italic   }
/* Biolinum 10 */
.MeasureNumber,
text.Tuplet               {  font-family:'Biolinum';
                               font-size:10px;    }
/* Biolinum  8 */
text.GlissandoSegment     {  font-family:'Biolinum'; /* the wavy line is text too, thus it is outside my feature set at this time - straight line gliss only */
                               font-size:8px;
                              font-style:italic   }

/** Rect element **/
rect.RehearsalMark        {         fill:none;
                                  stroke:#300060; }

/** Polyline elements **/
polyline                {stroke-linejoin:bevel;   } /* AFAIK all MuseScore polylines = bevel, but TBD */

.BarLine                  {       stroke:black;
                            stroke-width:0.80px;  }
.System                   {       stroke:black;
                            stroke-width:0.80px;  }

.LedgerLine               {       stroke:black;
                            stroke-width:0.60px;
                          stroke-linecap:square;  }

.LyricsLineSegment        {       stroke:black;
                            stroke-width:0.75px;
                          stroke-linecap:square;  }

.StaffLines               {       stroke:black;
                            stroke-width:0.40px;  }

.FrozenLines              { stroke-width:0.40px;  }

.Stem                     {       stroke:black;
                            stroke-width:0.65px;
                          stroke-linecap:round;   }

polyline.GlissandoSegment {       stroke:black;
                            stroke-width:0.75;
                          stroke-linecap:round;   }

polyline.Tuplet           {       stroke:black;
                            stroke-width:0.50px;
                                    fill:none;    }

/** Path elements **/
path                      {}

.Beam, .Bracket, .Tremolo {    fill-rule:evenodd; }

.SlurSegment              {    fill-rule:evenodd;
                                  stroke:black;
                            stroke-width:0.33;
                          stroke-linecap:round;
                         stroke-linejoin:round;   }

/** Tablature styles **/
text.tabNote              {  font-family:'Biolinum';
                               font-size:11px;
                             text-anchor:start;}
path.tabNote              {         fill:white;} /* the rectangle that covers the staff line behind a tab number, text.tabNote */
.tabBeam                  {         fill:black;}
.tabStem                  {       stroke:black;}

/** Music Fonts **/
/* MuseScore */
@font-face { font-family:'MScore';
                     src:url('fonts/mscore-web.ttf'),
                         url('fonts/mscore-web.eot') format('eot');      }
@font-face { font-family:'MScore Text';
                     src:url('fonts/mscoretext-web.ttf'),
                         url('fonts/mscoretext-web.eot') format('eot');      }

/* Bravura */
@font-face { font-family:'Bravura';
                     src:url('fonts/Bravura.ttf'),
                         url('fonts/Bravura.eot') format('eot');      }

/* Gootville */
@font-face { font-family:'Gootville';
                     src:url('fonts/Gootville.ttf'),
                         url('fonts/Gootville.eot') format('eot');      }

/** Text Fonts **/
/* Linux Biolinum */
@font-face { font-family:'Biolinum';
                     src:url('fonts/LinBiolinum_R.otf') format('opentype');/*,
                         url('fonts/LinBiolinum_R.eot') format('eot');    */
             font-weight:normal;
              font-style:normal; }

@font-face { font-family:'Biolinum';
                     src:url('fonts/LinBiolinum_RB.otf') format('opentype'),
                         url('fonts/LinBiolinum_RB.eot') format('eot');
             font-weight:bold;
              font-style:normal; }

@font-face { font-family:'Biolinum';
                     src:url('fonts/LinBiolinum_RI.otf') format('opentype'),
                         url('fonts/LinBiolinum_RI.eot') format('eot');
             font-weight:normal;
              font-style:italic; }
/* White Rabbit */
@font-face { font-family:'White Rabbit';
                     src:url('fonts/WhiteRabbit.ttf') format('truetype'),
                         url('fonts/WhiteRabbit.eot') format('eot');
}