1ad5a2d4c0d4ad07cf30adb0942f6d47ad480bfa
[grauphel.git] / grauphel.css
1 .app-grauphel #app-content {
2     box-sizing: border-box;
3 }
4 .app-grauphel #app-content.content {
5     padding: 2ex;
6 }
7
8 .app-grauphel #app-content h1 {
9     font-weight: bold;
10     font-size: 2em;
11     margin-bottom: 1ex;
12 }
13 .app-grauphel #app-content.list h1 {
14     padding: 1ex;
15 }
16 .app-grauphel #app-content.list > p {
17     margin: 2ex;
18 }
19
20 .app-grauphel #app-content h2 {
21     font-weight: bold;
22     font-size: 150%;
23     margin-bottom: 1ex;
24     margin-top: 2ex;
25 }
26 .app-grauphel #app-content dt {
27     font-weight: bold;
28 }
29 .app-grauphel #app-content dd {
30     margin-left: 3ex;
31 }
32 .app-grauphel #app-content pre {
33     margin: 1em;
34     background-color: #DDD;
35     padding: 1ex;
36     font-family: monospace;
37 }
38
39 .app-grauphel #app-content ul {
40     list-style-type: disc;
41     margin-bottom: 1ex;
42 }
43 .app-grauphel #app-content li {
44     margin-left: 4ex;
45 }
46 .app-grauphel #app-content a.lined {
47     text-decoration: underline;
48 }
49
50 .app-grauphel #app-content .error {
51     color: red;
52 }
53 .app-grauphel #app-content .success {
54     color: green;
55 }
56
57 .app-grauphel .oauth-authorize {
58     margin: 2ex;
59     text-align: center;
60 }
61 .app-grauphel .msg {
62     padding: 2ex;
63 }
64 .app-grauphel .buttons {
65     margin-top: 2ex;
66     text-align: center;
67 }
68
69
70 /* table style */
71
72 table.table {
73     position: relative;
74     width: 100%;
75 }
76
77 /* make sure there's enough room for the file actions */
78 #body-user table.table {
79         min-width: 688px; /* 768 (mobile break) - 80 (nav width) */
80 }
81
82 table.table tbody tr { background-color:#fff; height:51px; }
83
84 /* fit app list view heights */
85 /*
86 .app-files #app-content>.viewcontainer {
87         min-height: 100%;
88 }*/
89
90 table.table tbody tr { background-color:#fff; height:40px; }
91 table.table tbody tr:hover, tbody tr:active {
92         background-color: rgb(240,240,240);
93 }
94 table.table tbody tr.selected {
95         background-color: rgb(230,230,230);
96 }
97 table.table tbody tr.searchresult {
98         background-color: rgb(240,240,240);
99 }
100 table.table tbody a { color:#000; }
101
102 table.table tr.mouseOver td {
103         background-color: #eee;
104 }
105 table.table th, table th a {
106         color: #999;
107 }
108 table.table thead th {
109     background-color: white;
110     padding: 15px;
111     height: 50px;
112     box-sizing: border-box;
113     vertical-align: middle;
114 }
115
116 table.table th, table.table td {
117     border-bottom:1px solid #ddd;
118     text-align:left;
119     font-weight:normal;
120 }
121 table.table td {
122     padding: 0 15px;
123     border-bottom: 1px solid #eee;
124     font-style: normal;
125     background-position: 8px center;
126     background-repeat: no-repeat;
127 }
128
129 a.action.delete, table.table form button.action.delete {
130     position: absolute;
131     right: 0px;
132     padding: 17px 14px;
133     padding: 3px 14px;
134 }
135 a.action {
136     line-height: 30px;
137 }
138 a.cellclick {
139     display: block;
140 }
141 table.table form {
142     display: inline;
143 }
144 table.table form button.action {
145     border: none;
146     background-color: transparent;
147 }
148
149 .muted {
150     color: #999;
151 }
152
153 .note-content {
154     padding-top: 2ex;
155 }
156
157 .note-content .strikethrough {
158     text-decoration: line-through;
159 }
160 .note-content .highlight {
161     background-color: yellow;
162 }
163 .note-content .small {
164     font-size: 80%;
165 }
166 .note-content .large {
167     font-size: 150%;
168 }
169 .note-content .huge {
170     font-size: 200%;
171 }
172 .note-content a {
173     text-decoration: underline;
174 }