diff --git a/7th Sea/7th Sea.css b/7th Sea/7th Sea.css index 13615246d2..4c1c4634da 100644 --- a/7th Sea/7th Sea.css +++ b/7th Sea/7th Sea.css @@ -175,8 +175,12 @@ div.sheet-tab2 text-shadow: 0px 0px 0.2em red; text-align:center; } - -.sheet-skillselect { +.sheet-center { + margin-left:auto; + margin-right:auto; + text-align:center; +} +.sheet-select { margin:0; background:transparent; font-family:GreatVibesRegular; @@ -253,14 +257,14 @@ input.sheet-arrow[type="checkbox"] + span::before float: left; width: 14px; height: 14px; - content: "?"; + content: "▼"; transform: rotate(-90deg); } input.sheet-arrow[type="checkbox"]:checked + span::before { width: 14px; height: 14px; - content: "?"; + content: "▼"; transform: rotate(0deg); } @@ -325,7 +329,7 @@ input.sheet-defense-toggle[type="radio"] + span::before { } input.sheet-defense-toggle[type="radio"]:checked + span::before { - content: "•"; + content: "•"; } /*-----radio boxes-----*/ @@ -368,7 +372,7 @@ input.sheet-normal[type="radio"] + span::before background: radial-gradient(#f6f6f6, #dfdfdf); color:black; - content: "•"; + content: "•"; width: 12px; height: 12px; font-size: 1em; @@ -405,9 +409,10 @@ input.sheet-zero[type="radio"]:hover + span::before input.sheet-zero[type="radio"] + span::before { font-size: 12px; - content: "?"; + content: "✖"; opacity: 0.25; } + /*========Melee toggle Checkbox========*/ /* Hide actual radio/checkbox */ input.sheet-meleecheck[type="checkbox"] @@ -460,10 +465,9 @@ input.sheet-meleecheck[type="checkbox"] + span::before input.sheet-meleecheck[type="checkbox"]:checked + span::before { color:red; - content: "?"; + content: "✓"; } - @font-face { font-family: 'GreatVibesRegular'; src: url('http://openfontlibrary.org/assets/fonts/rebecca/d32a4d9e4887fccf9ce200538290cd10/53e7427de4aaa693950c7a9c35de80e2/GreatVibesRegular.otf'); @@ -703,6 +707,54 @@ input.sheet-tendie:checked ~ span.sheet-tendie, background-size: 100%; } +/*=====Tooltips =====*/ +.sheet-tooltips { + position: relative; + display: inline; +} +.sheet-tooltips span { + position: absolute; + width:140px; + color: #000000; + background: #FFFFFF; + border: 2px solid #FF0800; + height: 30px; + line-height: 30px; + text-align: center; + visibility: hidden; + border-radius: 6px; + box-shadow: -5px 5px 5px #000000; +} +.sheet-tooltips span:before { + content: ''; + position: absolute; + top: 100%; + left: 50%; + margin-left: -12px; + width: 0; height: 0; + border-top: 12px solid #FF0800; + border-right: 12px solid transparent; + border-left: 12px solid transparent; +} +.sheet-tooltips span:after { + content: ''; + position: absolute; + top: 100%; + left: 50%; + margin-left: -8px; + width: 0; height: 0; + border-top: 8px solid #FFFFFF; + border-right: 8px solid transparent; + border-left: 8px solid transparent; +} +.sheet-tooltips:hover.sheet-tooltips span { + visibility: visible; + opacity: 0.8; + bottom: 30px; + left: 50%; + margin-left: -76px; + z-index: 999; +} /*================================*/ /*========Roll templates==========*/ @@ -711,7 +763,7 @@ input.sheet-tendie:checked ~ span.sheet-tendie, border: 1px solid; color: black; font-size: 1em; - font-family: "Helvetica Neue", Helvetica, sans-serif; + font-family: "Helvetica Neue", Helvetica, sans-serif; background: url('http://www.stbernardakron.org/wp-content/uploads/2013/03/Parchment-42.jpg'); }