Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /* Set the min-width so that when the window is resized the look will stay consistant */
- .charsheet {
- background-color: #FFF;
- min-width: 850px;
- max-width: 850px;
- }
- /* Universal styling applied to all elements of these types */
- h2 {
- font-size: 2em;
- margin-bottom: 10px;
- text-align: center;
- }
- label {
- display: inline-block;
- width: 41%;
- }
- input {
- display: inline-block;
- width: 55%;
- }
- img {
- max-height: 106px;
- }
- textarea {
- resize: vertical;
- }
- /* Targetted styling that only effects elements with these classes */
- input.sheet-short {
- width: 17%;
- }
- select.sheet-dtype {
- vertical-align: top;
- width: 60px;
- }
- span.sheet-dee {
- font-size: 1.4em;
- font-weight: bold;
- left: -36%;
- padding-right: 4px;
- position: relative;
- top: 3px;
- }
- /* Targetted styling that only effects elements contained within the stated class */
- .sheet-stats h3 {
- display: inline-block;
- text-align: left;
- }
- .sheet-stats h3:first-child {
- margin-left: 35%;
- margin-right: 15%;
- }
- .sheet-stats input {
- margin-right: 8%;
- width: 17%;
- }
- .sheet-rolltemplate-wod table {
- width: 189px;
- height: 65px;
- padding: 0px;
- background: url(https://i.imgur.com/UXV3B7X.jpg) top left;
- background-size: 189px 65px;
- background-repeat: no-repeat;
- font-family: "Courier New", Courier, monospace;
- font-weight: bold;
- border-spacing: 0;
- }
- .sheet-rolltemplate-wod th {
- color: #000000;
- padding: 4px 0px 0px 10px;
- line-height: 1.0em;
- font-size: 1.2em;
- text-align: left;
- }
- .sheet-rolltemplate-wod td {
- padding-left: 120px;
- font-size: 1.0em;
- vertical-align: top;
- }
- .sheet-rolltemplate-wod .sheet-result {
- font-size: 1.5em;
- text-align: center;
- vertical-align: top;
- color: rgb(112, 0, 0);
- }
- .sheet-rolltemplate-wod .inlinerollresult {
- background-color: transparent;
- color: rgb(112, 0, 0);
- border: none;
- }
- .sheet-rolltemplate-wod .inlinerollresult.fullcrit {
- color: #3FB315;
- border: none;
- }
- .sheet-rolltemplate-wod .inlinerollresult.fullfail {
- color: #ff0000;
- border: none;
- }
- .sheet-rolltemplate-wod .inlinerollresult.importantroll {
- color: #3FB315;
- border: none;
- }
- /* Hide actual radio */
- input[type="radio"] {
- opacity: 0;
- width: 16px;
- height: 16px;
- position: relative;
- top: 5px;
- left: 6px;
- margin: -10px;
- cursor: pointer;
- z-index: 1;
- }
- /* Fake radio */
- input[type="radio"] + span::before {
- margin-right: 4px;
- border: solid 1px #a8a8a8;
- line-height: 14px;
- text-align: center;
- display: inline-block;
- vertical-align: middle;
- box-shadow: 0 0 2px #ccc;
- background: #f6f6f6;
- background: radial-gradient(#f6f6f6, #dfdfdf);
- content: "•";
- width: 12px;
- height: 12px;
- font-size: 24px;
- border-radius: 50%;
- }
- /* Remove dot from all radios _after_ selected one */
- input[type="radio"]:checked ~ input[type="radio"] + span::before {
- content: "";
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement