cms/app-client/app/styles/tabs/langues.scss
author ymh <ymh.work@gmail.com>
Tue, 15 Nov 2016 17:42:57 +0100
changeset 424 feb0d3e0fef9
parent 359 6274a5fdd348
child 427 695111d1eec9
permissions -rw-r--r--
add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     1
#tabs-langues .ember-view {
188
d2cb39155997 /langue endpoint ID querystring parameter
Chloe Laisne <chloe.laisne@gmail.com>
parents: 95
diff changeset
     2
    width: 100%;
349
74bbf705a5ca Quickfix css
Chloe Laisne <chloe.laisne@gmail.com>
parents: 313
diff changeset
     3
    height: $content-height;
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     4
}
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     5
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     6
#tabs-langues .breadcrumbs,
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     7
#tabs-langues .node {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
     8
	cursor: pointer;
68
69977e2aa39e improve general design of components
nowmad@23.1.168.192.in-addr.arpa
parents:
diff changeset
     9
}
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    10
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    11
#tabs-langues .breadcrumbs:hover,
313
706f10bcdc3c Treemap shades to node count
Chloe Laisne <chloe.laisne@gmail.com>
parents: 295
diff changeset
    12
#tabs-langues .node:hover,
706f10bcdc3c Treemap shades to node count
Chloe Laisne <chloe.laisne@gmail.com>
parents: 295
diff changeset
    13
#tabs-langues .node.selected {
359
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    14
	background-color: $corpus-blue!important;
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    15
	color: $corpus-white!important;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    16
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    17
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    18
#tabs-langues .breadcrumbs {
359
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    19
	background-color: $corpus-white;
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    20
    color: $corpus-black;
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    21
    position: relative;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    22
	line-height: 30px;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    23
	padding: 0 10px;
359
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    24
	border-bottom: 1px solid $corpus-white;
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    25
	box-sizing: border-box;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    26
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    27
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    28
#tabs-langues .breadcrumbs .root:only-child {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    29
	font-weight: bold;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    30
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    31
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    32
#tabs-langues .breadcrumbs .level::before {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    33
	content: '>';
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    34
	margin: 0 10px;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    35
	font-weight: normal;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    36
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    37
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    38
#tabs-langues .breadcrumbs .level:last-child {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    39
	font-weight: bold;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    40
}
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    41
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    42
#tabs-langues .nodes {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    43
	width: inherit;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    44
	height: inherit;
287
4e199fd29689 Fix treemap transition
Chloe Laisne <chloe.laisne@gmail.com>
parents: 286
diff changeset
    45
	position: absolute;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    46
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    47
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    48
#tabs-langues .node {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    49
	position: absolute;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    50
	margin: 0;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    51
	padding: 0;
359
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    52
	border-left: 1px solid $corpus-white;
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    53
	border-bottom: 1px solid $corpus-white;
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    54
	padding: 10px;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    55
	box-sizing: border-box;
359
6274a5fdd348 Treemap colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 349
diff changeset
    56
	color: $corpus-white;
84
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    57
}
36f84e8f1ad5 add d3js for langue visu
nowmad@nowmads-macbook-pro.local
parents: 68
diff changeset
    58
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    59
#tabs-langues .node:hover {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    60
	border-right: none;
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    61
}
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    62
294
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    63
#tabs-langues .node .fa {
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    64
    margin-right: 5px;
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    65
}
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    66
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    67
#tabs-langues .node .fa::before {
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    68
	font-size: 14px;
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    69
	line-height: 12px;
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    70
}
f3dae62a0d8a Add folder icon to treemap
Chloe Laisne <chloe.laisne@gmail.com>
parents: 287
diff changeset
    71
286
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    72
#tabs-langues .node .count {
57762c0b601e Treemap layout: Resize node values to get bigger rect when value is smal + Create and display count + Node colors
Chloe Laisne <chloe.laisne@gmail.com>
parents: 225
diff changeset
    73
	font-weight: bold;
424
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    74
}
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    75
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    76
#tabs-langues .light-color {
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    77
    color: $corpus-white;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    78
}
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    79
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    80
#tabs-langues .dark-color {
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    81
    color: $corpus-black;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    82
}
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    83
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    84
#tabs-langues .color-gradient-wrapper {
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    85
    position: absolute;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    86
    width: 100px;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    87
    top: 1px;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    88
    right: 5px;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    89
}
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    90
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    91
#tabs-langues .color-gradient-wrapper .color-gradient {
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    92
    position: relative;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    93
    width: 100%;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    94
    height: 1.75em;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    95
    font-size: 0.75em;
feb0d3e0fef9 add dynamic date range calculation for dates, and add color gradient component, add color gradient for language and chrono
ymh <ymh.work@gmail.com>
parents: 359
diff changeset
    96
}