aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/sass/primeng-custom.scss
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-12-18 11:32:37 +0100
committerChocobozzz <me@florianbigard.com>2018-12-18 11:35:51 +0100
commit276d96529529621d5f70473990095495f2743c29 (patch)
tree9fc62fc44dce05302215b10da13789ce89c9ee04 /client/src/sass/primeng-custom.scss
parent80bfd33c0bf910e2cfdd3270b14ba9eddd90e2e8 (diff)
downloadPeerTube-276d96529529621d5f70473990095495f2743c29.tar.gz
PeerTube-276d96529529621d5f70473990095495f2743c29.tar.zst
PeerTube-276d96529529621d5f70473990095495f2743c29.zip
Add ability to disable and clear history
Diffstat (limited to 'client/src/sass/primeng-custom.scss')
-rw-r--r--client/src/sass/primeng-custom.scss68
1 files changed, 54 insertions, 14 deletions
diff --git a/client/src/sass/primeng-custom.scss b/client/src/sass/primeng-custom.scss
index 0568de4e2..1d6eebcfa 100644
--- a/client/src/sass/primeng-custom.scss
+++ b/client/src/sass/primeng-custom.scss
@@ -2,7 +2,7 @@
2@import '_mixins'; 2@import '_mixins';
3 3
4@import '~primeng/resources/primeng.css'; 4@import '~primeng/resources/primeng.css';
5@import '~primeng/resources/themes/bootstrap/theme.css'; 5@import '~primeng/resources/themes/nova-light/theme.css';
6 6
7@mixin glyphicon-light { 7@mixin glyphicon-light {
8 font-family: 'Glyphicons Halflings'; 8 font-family: 'Glyphicons Halflings';
@@ -12,10 +12,9 @@
12 12
13// data table customizations 13// data table customizations
14p-table { 14p-table {
15 font-size: 15px !important;
16
17 .ui-table-caption { 15 .ui-table-caption {
18 border: none; 16 border: none !important;
17 background-color: #fff !important;
19 18
20 .caption { 19 .caption {
21 height: 40px; 20 height: 40px;
@@ -24,6 +23,17 @@ p-table {
24 } 23 }
25 } 24 }
26 25
26 th {
27 background-color: #fff !important;
28 outline: 0;
29 }
30
31 td, th {
32 font-family: $main-fonts;
33 font-size: 15px !important;
34 color: var(--mainForegroundColor) !important;
35 }
36
27 td { 37 td {
28 padding-left: 15px !important; 38 padding-left: 15px !important;
29 39
@@ -35,12 +45,16 @@ p-table {
35 } 45 }
36 46
37 tr { 47 tr {
48 outline: 0;
38 background-color: var(--mainBackgroundColor) !important; 49 background-color: var(--mainBackgroundColor) !important;
39 height: 46px; 50 height: 46px;
40 51
41 &.ui-state-highlight { 52 &.ui-state-highlight {
42 background-color:var(--submenuColor) !important; 53 background-color: var(--submenuColor) !important;
43 color:var(--mainForegroundColor) !important; 54
55 td, td > a {
56 color: var(--mainForegroundColor) !important;
57 }
44 } 58 }
45 } 59 }
46 60
@@ -56,6 +70,10 @@ p-table {
56 } 70 }
57 } 71 }
58 72
73 td {
74 border: none !important;
75 }
76
59 &:first-child td { 77 &:first-child td {
60 border-top: none !important; 78 border-top: none !important;
61 } 79 }
@@ -93,14 +111,14 @@ p-table {
93 } 111 }
94 112
95 &.ui-state-highlight { 113 &.ui-state-highlight {
96 background-color:var(--submenuColor) !important; 114 background-color: var(--submenuColor) !important;
97 115
98 .pi { 116 .pi {
99 @extend .glyphicon; 117 @extend .glyphicon;
100 118
101 color: #000; 119 color: #000 !important;
102 font-size: 11px; 120 font-size: 11px !important;
103 top: 0; 121 top: 0 !important;
104 122
105 &.pi-sort-up { 123 &.pi-sort-up {
106 @extend .glyphicon-triangle-top; 124 @extend .glyphicon-triangle-top;
@@ -177,11 +195,12 @@ p-table {
177 a { 195 a {
178 color: #000 !important; 196 color: #000 !important;
179 font-weight: $font-semibold !important; 197 font-weight: $font-semibold !important;
180 margin: 0 10px !important; 198 margin: 0 5px !important;
181 outline: 0 !important; 199 outline: 0 !important;
182 border-radius: 3px !important; 200 border-radius: 3px !important;
183 padding: 5px 2px !important; 201 padding: 5px 2px !important;
184 height: auto !important; 202 height: auto !important;
203 line-height: initial !important;
185 204
186 &.ui-state-active { 205 &.ui-state-active {
187 &, &:hover, &:active, &:focus { 206 &, &:hover, &:active, &:focus {
@@ -210,11 +229,23 @@ p-calendar .ui-datepicker {
210 .ui-datepicker-next { 229 .ui-datepicker-next {
211 @extend .glyphicon-chevron-right; 230 @extend .glyphicon-chevron-right;
212 @include glyphicon-light; 231 @include glyphicon-light;
232
233 text-align: right;
234
235 .pi.pi-chevron-right {
236 display: none !important;
237 }
213 } 238 }
214 239
215 .ui-datepicker-prev { 240 .ui-datepicker-prev {
216 @extend .glyphicon-chevron-left; 241 @extend .glyphicon-chevron-left;
217 @include glyphicon-light; 242 @include glyphicon-light;
243
244 text-align: left;
245
246 .pi.pi-chevron-left {
247 display: none !important;
248 }
218 } 249 }
219 } 250 }
220 251
@@ -232,6 +263,7 @@ p-calendar .ui-datepicker {
232 } 263 }
233} 264}
234 265
266
235.ui-chkbox-box { 267.ui-chkbox-box {
236 &.ui-state-active { 268 &.ui-state-active {
237 border-color: var(--mainColor) !important; 269 border-color: var(--mainColor) !important;
@@ -240,13 +272,15 @@ p-calendar .ui-datepicker {
240 272
241 .ui-chkbox-icon { 273 .ui-chkbox-icon {
242 position: relative; 274 position: relative;
275 overflow: visible !important;
243 276
244 &:after { 277 &:after {
245 content: ''; 278 content: '';
246 position: absolute; 279 position: absolute;
247 left: 5px; 280 top: 1px;
281 left: 7px;
248 width: 5px; 282 width: 5px;
249 height: 12px; 283 height: 13px;
250 opacity: 0; 284 opacity: 0;
251 transform: rotate(45deg) scale(0); 285 transform: rotate(45deg) scale(0);
252 border-right: 2px solid var(--mainBackgroundColor); 286 border-right: 2px solid var(--mainBackgroundColor);
@@ -258,4 +292,10 @@ p-calendar .ui-datepicker {
258 transform: rotate(45deg) scale(1); 292 transform: rotate(45deg) scale(1);
259 } 293 }
260 } 294 }
261} \ No newline at end of file 295}
296
297p-inputswitch {
298 .ui-inputswitch-checked .ui-inputswitch-slider {
299 background-color: var(--mainColor) !important;
300 }
301}