Create FAE_No_Approaches.css

CSS for the FAE_No_Approaches html.
2026-08-30 03:40:32 +00:00 · 2016-05-12 11:24:14 -06:00
parent dfeee46eb5
commit 9379b2a4ff
1 changed files with 191 additions and 0 deletions
@@ -0,0 +1,191 @@
+/* === GENERAL === */
+.charsheet {
+    min-width: 800px;
+}
+
+.sheet-row .sheet-col {
+	width: 100%;
+}
+
+.sheet-header {
+	margin-bottom: 4px;
+	padding: 2px 4px;
+
+	background: black;
+	color: white;
+	font-weight: bold;
+}
+
+.sheet-section {
+	float: left;
+	width: 100%;
+
+	margin: 4px 0;
+	padding: 1px;
+	box-sizing: border-box;
+}
+
+.sheet-break {
+	clear: both;
+}
+
+label,
+select {
+	margin: 0;
+}
+
+.sheet-repitem,
+.repitem {
+	margin-bottom: 2px;
+}
+
+input, textarea, select, .uneditable-input {
+    display: inline-block;
+    width: 100%;
+    padding: 2px;
+    margin-bottom: 4px;
+    font-size: 13px;
+    line-height: 18px;
+    color: #555;
+    border: 1px solid #ccc;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    border-radius: 3px;
+}
+
+input, select, .uneditable-input {
+    height: 20px;
+}
+
+textarea {
+    margin: 0;
+    height: 120px;
+    resize: vertical;
+    box-sizing: border-box;
+}
+
+/* === LOGO === */
+.sheet-logo {
+	width: 300px;
+	margin: 0 5px;
+	float: left;
+}
+
+/* === ASPECT === */
+.sheet-col-aspects input {
+	width: 100%;
+}
+
+/* === APPROACHES === */
+table.sheet-approaches {
+    width:  100%;
+    position: relative;
+}
+
+/* === STRESS === */
+.sheet-section {
+    width:  100%;
+    border: 1px solid black;
+    position: relative;
+    border-radius: 10px;
+    margin-bottom: 10px;
+    padding: 5px;
+}
+
+table.sheet-stress {
+    width:  100%;
+    position: relative;
+}
+
+table.sheet-stress td {
+    position: relative;
+}
+
+table.sheet-stress td div.sheet-checkbox-label-div {
+    width: 50px;
+    height: 50px;
+    position: relative;
+    border: 1px solid black;
+    left: calc(50% - 25px) !important;
+}
+
+table.sheet-stress td div.sheet-checkbox-label-div label {
+    position: relative;
+    top:-50px;
+    background: #ddd;
+    height: 50px;
+    width: 50px;
+    display: block;
+    padding-right: 0px;
+    /* Note: This gradient may render differently in browsers that don't support the unprefixed gradient syntax */
+
+    /* IE10 Consumer Preview */
+    background-image: -ms-linear-gradient(bottom right, #FFFFFF 0%, #C7C7C7 100%);
+
+    /* Mozilla Firefox */
+    background-image: -moz-linear-gradient(bottom right, #FFFFFF 0%, #C7C7C7 100%);
+
+    /* Opera */
+    background-image: -o-linear-gradient(bottom right, #FFFFFF 0%, #C7C7C7 100%);
+
+    /* Webkit (Safari/Chrome 10) */
+    background-image: -webkit-gradient(linear, right bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #C7C7C7));
+
+    /* Webkit (Chrome 11+) */
+    background-image: -webkit-linear-gradient(bottom right, #FFFFFF 0%, #C7C7C7 100%);
+
+    /* W3C Markup, IE10 Release Preview */
+    background-image: linear-gradient(to top left, #FFFFFF 0%, #C7C7C7 100%);
+
+}
+table.sheet-stress td div.sheet-checkbox-label-div label:hover {/* Note: This gradient may render differently in browsers that don't support the unprefixed gradient syntax */
+
+    /* IE10 Consumer Preview */
+    background-image: -ms-linear-gradient(bottom right, #FFFFFF 0%, #8FECFF 100%);
+
+    /* Mozilla Firefox */
+    background-image: -moz-linear-gradient(bottom right, #FFFFFF 0%, #8FECFF 100%);
+
+    /* Opera */
+    background-image: -o-linear-gradient(bottom right, #FFFFFF 0%, #8FECFF 100%);
+
+    /* Webkit (Safari/Chrome 10) */
+    background-image: -webkit-gradient(linear, right bottom, left top, color-stop(0, #FFFFFF), color-stop(1, #8FECFF));
+
+    /* Webkit (Chrome 11+) */
+    background-image: -webkit-linear-gradient(bottom right, #FFFFFF 0%, #8FECFF 100%);
+
+    /* W3C Markup, IE10 Release Preview */
+    background-image: linear-gradient(to top left, #FFFFFF 0%, #8FECFF 100%);}
+
+
+input[type=checkbox].sheet-stress-check {
+    margin: 0px;
+    width: 50px;
+    height: 50px;
+    opacity: 0;
+    z-index: 1;
+    position: relative;
+    left: calc(50% - 27px) !important;
+    top: -2px;
+}
+
+input[type=checkbox].sheet-stress-check:checked ~ label {
+    background: url(http://ramyasspace.files.wordpress.com/2011/06/tick.jpg);
+    background-size: 100%;
+}
+
+/* === CONSEQUENCES === */
+.sheet-col-consequences {
+    position: relative;
+}
+
+.sheet-col-consequences select {
+	width: 100px;
+	float: left;
+}
+
+.sheet-col-consequences input {
+	margin-left: 2px;
+	width: calc(100% - 102px);
+}