571e5800fc93a9a9fcf84a9451cf6d8b85ff55dd
[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 #app-content .actions {
58     float: right;
59 }
60 .app-grauphel #app-content .actions a {
61     color: #555;
62     padding: 14px 10px;
63     position: relative;
64     top: 7px;
65     min-width: 25px;
66     padding: 5px;
67     background-color: rgba(240,240,240,.9);
68 }
69
70 .app-grauphel .oauth-authorize {
71     margin: 2ex;
72     text-align: center;
73 }
74 .app-grauphel .msg {
75     padding: 2ex;
76 }
77 .app-grauphel .buttons {
78     margin-top: 2ex;
79     text-align: center;
80 }
81
82
83 /* table style */
84
85 table.table {
86     position: relative;
87     width: 100%;
88 }
89
90 /* make sure there's enough room for the file actions */
91 #body-user table.table {
92         min-width: 688px; /* 768 (mobile break) - 80 (nav width) */
93 }
94
95 table.table tbody tr { background-color:#fff; height:51px; }
96
97 /* fit app list view heights */
98 /*
99 .app-files #app-content>.viewcontainer {
100         min-height: 100%;
101 }*/
102
103 table.table tbody tr { background-color:#fff; height:40px; }
104 table.table tbody tr:hover, tbody tr:active {
105         background-color: rgb(240,240,240);
106 }
107 table.table tbody tr.selected {
108         background-color: rgb(230,230,230);
109 }
110 table.table tbody tr.searchresult {
111         background-color: rgb(240,240,240);
112 }
113 table.table tbody a { color:#000; }
114
115 table.table tr.mouseOver td {
116         background-color: #eee;
117 }
118 table.table th, table th a {
119         color: #999;
120 }
121 table.table thead th {
122     background-color: white;
123     padding: 15px;
124     height: 50px;
125     box-sizing: border-box;
126     vertical-align: middle;
127 }
128
129 table.table th, table.table td {
130     border-bottom:1px solid #ddd;
131     text-align:left;
132     font-weight:normal;
133 }
134 table.table td {
135     padding: 0 15px;
136     border-bottom: 1px solid #eee;
137     font-style: normal;
138     background-position: 8px center;
139     background-repeat: no-repeat;
140 }
141
142 a.action.delete, table.table form button.action.delete {
143     position: absolute;
144     right: 0px;
145     padding: 17px 14px;
146     padding: 3px 14px;
147 }
148 a.action {
149     line-height: 30px;
150 }
151 a.cellclick {
152     display: block;
153 }
154 table.table form {
155     display: inline;
156 }
157 table.table form button.action {
158     border: none;
159     background-color: transparent;
160 }
161
162 .muted {
163     color: #999;
164 }
165
166 .note-content {
167     padding-top: 2ex;
168 }
169
170 .note-content .strikethrough {
171     text-decoration: line-through;
172 }
173 .note-content .highlight {
174     background-color: yellow;
175 }
176 .note-content .small {
177     font-size: 80%;
178 }
179 .note-content .large {
180     font-size: 150%;
181 }
182 .note-content .huge {
183     font-size: 200%;
184 }
185 .note-content a {
186     text-decoration: underline;
187 }