##// END OF EJS Templates
notifications: use rhodecode-toast for notifications instead of toastr jquery plugin
ergo -
r699:49c50282 default
parent child Browse files
Show More
@@ -0,0 +1,33 b''
1 //Primary CSS
2 //--- IMPORTS ------------------//
3 @import 'helpers';
4 @import 'mixins';
5 @import 'rcicons';
6 @import 'fonts';
7 @import 'variables';
8 @import 'legacy_code_styles';
9 @import 'type';
10 @import 'alerts';
11 @import 'buttons';
12 @import 'tags';
13 @import 'examples';
14 @import 'login';
15 @import 'comments';
16
17
18 .toast-level {
19 display: inline-block;
20 min-width: 100px;
21 font-weight: bold;
22 text-transform: uppercase;
23 &.info, &.success {
24 color: #0ac878;
25 }
26 &.error, &.danger {
27 color: #e85e4d;
28 }
29 &.warning {
30 color: #ffc854;
31 }
32 }
33
@@ -0,0 +1,79 b''
1 <link rel="import" href="../../../../../bower_components/paper-button/paper-button.html">
2 <link rel="import" href="rhodecode-unsafe-html.html">
3 <dom-module id="rhodecode-toast">
4 <template>
5 <style include="shared-styles"></style>
6
7 <style>
8 paper-toast{
9 width: 100%;
10 min-width: 400px;
11 --paper-toast-background-color: #ffffff;
12 --paper-toast-color: #000000;
13 }
14 paper-toast a{
15 font-weight: bold
16 }
17
18 .toast-message-holder {
19 width: calc(100% - 150px);
20 display: inline-block;
21 }
22 .toast-close {
23 display: inline-block;
24 width: 145px;
25 text-align: right;
26 float: right;
27 }
28 .toast-notification {
29 padding: 10px 0 10px 0;
30 }
31
32 </style>
33 <paper-toast id="p-toast" duration="0" horizontal-offset="100" horizontal-align="auto" vertical-align="top" always-on-top>
34 <div class="toast-message-holder">
35 <template is="dom-repeat" items="{{toasts}}">
36 <div class="toast-notification">
37 <span class$="toast-level {{item.level}}">{{item.level}}</span>
38 <rhodecode-unsafe-html text="{{item.message}}"></rhodecode-unsafe-html>
39 </div>
40 </template>
41 </div>
42 <div class="toast-close">
43 <paper-button on-tap="dismissNotifications" class="btn btn-info">{{_gettext('Close now')}}</paper-button>
44 </div>
45 </paper-toast>
46 </template>
47
48 <script>
49 Polymer({
50 is: 'rhodecode-toast',
51 properties: {
52 toasts: {
53 type: Array,
54 value: function(){
55 return []
56 }
57 }
58 },
59 observers: [
60 '_changedToasts(toasts.splices)'
61 ],
62 ready: function(){
63
64 },
65
66 _changedToasts: function(newValue, oldValue){
67 this.$['p-toast'].notifyResize();
68 },
69 dismissNotifications: function(){
70 this.$['p-toast'].close();
71 this.splice('toasts', 0);
72 },
73 open: function(){
74 this.$['p-toast'].open();
75 },
76 _gettext: _gettext
77 });
78 </script>
79 </dom-module>
@@ -0,0 +1,22 b''
1 <link rel="import" href="../../../../../bower_components/polymer/polymer.html">
2
3 <dom-module id="rhodecode-unsafe-html">
4 <template>
5 <style include="shared-styles"></style>
6 <content></content>
7 </template>
8 <script>
9 Polymer({
10 is: 'rhodecode-unsafe-html',
11 properties: {
12 text: {
13 type: String,
14 observer: '_handleText'
15 }
16 },
17 _handleText: function(newVal, oldVal){
18 this.innerHTML = this.text;
19 }
20 })
21 </script>
22 </dom-module>
@@ -0,0 +1,3 b''
1 <dom-module id="shared-styles">
2 <template>
3 <style>
@@ -0,0 +1,3 b''
1 </style>
2 </template>
3 </dom-module>
@@ -1,60 +1,63 b''
1 syntax: glob
1 syntax: glob
2 *.egg
2 *.egg
3 *.egg-info
3 *.egg-info
4 *.idea
4 *.idea
5 *.orig
5 *.orig
6 *.pyc
6 *.pyc
7 *.sqlite-journal
7 *.sqlite-journal
8 *.swp
8 *.swp
9 *.tox
9 *.tox
10 *.DS_Store*
10 *.DS_Store*
11
11
12 syntax: regexp
12 syntax: regexp
13
13
14 #.filename
14 #.filename
15 ^\.settings$
15 ^\.settings$
16 ^\.project$
16 ^\.project$
17 ^\.pydevproject$
17 ^\.pydevproject$
18 ^\.coverage$
18 ^\.coverage$
19 ^\.cache.*$
19 ^\.cache.*$
20 ^\.rhodecode$
20 ^\.rhodecode$
21
21
22 ^rcextensions
22 ^rcextensions
23 ^_dev
23 ^_dev
24 ^._dev
24 ^._dev
25 ^build/
25 ^build/
26 ^bower_components/
26 ^bower_components/
27 ^coverage\.xml$
27 ^coverage\.xml$
28 ^data$
28 ^data$
29 ^\.eggs/
29 ^\.eggs/
30 ^configs/data$
30 ^configs/data$
31 ^dev.ini$
31 ^dev.ini$
32 ^acceptance_tests/dev.*\.ini$
32 ^acceptance_tests/dev.*\.ini$
33 ^dist/
33 ^dist/
34 ^fabfile.py
34 ^fabfile.py
35 ^htmlcov
35 ^htmlcov
36 ^junit\.xml$
36 ^junit\.xml$
37 ^node_modules/
37 ^node_modules/
38 ^pylint.log$
38 ^pylint.log$
39 ^rcextensions/
39 ^rcextensions/
40 ^result$
40 ^result$
41 ^rhodecode/public/css/style.css$
41 ^rhodecode/public/css/style.css$
42 ^rhodecode/public/css/style-polymer.css$
42 ^rhodecode/public/js/scripts.js$
43 ^rhodecode/public/js/scripts.js$
44 ^rhodecode/public/js/rhodecode-components.html$
45 ^rhodecode/public/js/src/components/shared-styles.html$
43 ^rhodecode\.db$
46 ^rhodecode\.db$
44 ^rhodecode\.log$
47 ^rhodecode\.log$
45 ^rhodecode_dev\.log$
48 ^rhodecode_dev\.log$
46 ^test\.db$
49 ^test\.db$
47
50
48 # ac-tests
51 # ac-tests
49 ^acceptance_tests/\.cache.*$
52 ^acceptance_tests/\.cache.*$
50 ^acceptance_tests/externals
53 ^acceptance_tests/externals
51 ^acceptance_tests/ghostdriver.log$
54 ^acceptance_tests/ghostdriver.log$
52 ^acceptance_tests/local(_.+)?\.ini$
55 ^acceptance_tests/local(_.+)?\.ini$
53
56
54 # docs
57 # docs
55 ^docs/_build$
58 ^docs/_build$
56 ^docs/result$
59 ^docs/result$
57 ^docs-internal/_build$
60 ^docs-internal/_build$
58
61
59 # Cythonized things
62 # Cythonized things
60 ^rhodecode/.*\.(c|so)$
63 ^rhodecode/.*\.(c|so)$
@@ -1,167 +1,178 b''
1 module.exports = function(grunt) {
1 module.exports = function(grunt) {
2 grunt.initConfig({
2 grunt.initConfig({
3
3
4 dirs: {
4 dirs: {
5 css: "rhodecode/public/css",
5 css: "rhodecode/public/css",
6 js: {
6 js: {
7 "src": "rhodecode/public/js/src",
7 "src": "rhodecode/public/js/src",
8 "dest": "rhodecode/public/js"
8 "dest": "rhodecode/public/js"
9 }
9 }
10 },
10 },
11 copy: {
11 copy: {
12 main: {
12 main: {
13 expand: true,
13 expand: true,
14 cwd: 'bower_components',
14 cwd: 'bower_components',
15 src: 'webcomponentsjs/**',
15 src: 'webcomponentsjs/**',
16 dest: '<%= dirs.js.dest %>/vendors',
16 dest: '<%= dirs.js.dest %>/vendors',
17 },
17 },
18 },
18 },
19 concat: {
19 concat: {
20 polymercss:{
21 src: [
22 // Base libraries
23 '<%= dirs.js.src %>/components/shared-styles-prefix.html',
24 '<%= dirs.css %>/style-polymer.css',
25 '<%= dirs.js.src %>/components/shared-styles-suffix.html'
26 ],
27 dest: '<%= dirs.js.dest %>/src/components/shared-styles.html',
28 nonull: true
29 },
20 dist: {
30 dist: {
21 src: [
31 src: [
22 // Base libraries
32 // Base libraries
23 '<%= dirs.js.src %>/jquery-1.11.1.min.js',
33 '<%= dirs.js.src %>/jquery-1.11.1.min.js',
24 '<%= dirs.js.src %>/logging.js',
34 '<%= dirs.js.src %>/logging.js',
25 '<%= dirs.js.src %>/bootstrap.js',
35 '<%= dirs.js.src %>/bootstrap.js',
26 '<%= dirs.js.src %>/mousetrap.js',
36 '<%= dirs.js.src %>/mousetrap.js',
27 '<%= dirs.js.src %>/moment.js',
37 '<%= dirs.js.src %>/moment.js',
28 '<%= dirs.js.src %>/appenlight-client-0.4.1.min.js',
38 '<%= dirs.js.src %>/appenlight-client-0.4.1.min.js',
29 '<%= dirs.js.src %>/i18n_utils.js',
39 '<%= dirs.js.src %>/i18n_utils.js',
30 '<%= dirs.js.src %>/deform.js',
40 '<%= dirs.js.src %>/deform.js',
31
41
32 // Plugins
42 // Plugins
33 '<%= dirs.js.src %>/plugins/jquery.pjax.js',
43 '<%= dirs.js.src %>/plugins/jquery.pjax.js',
34 '<%= dirs.js.src %>/plugins/jquery.dataTables.js',
44 '<%= dirs.js.src %>/plugins/jquery.dataTables.js',
35 '<%= dirs.js.src %>/plugins/flavoured_checkbox.js',
45 '<%= dirs.js.src %>/plugins/flavoured_checkbox.js',
36 '<%= dirs.js.src %>/plugins/jquery.auto-grow-input.js',
46 '<%= dirs.js.src %>/plugins/jquery.auto-grow-input.js',
37 '<%= dirs.js.src %>/plugins/jquery.autocomplete.js',
47 '<%= dirs.js.src %>/plugins/jquery.autocomplete.js',
38 '<%= dirs.js.src %>/plugins/jquery.debounce.js',
48 '<%= dirs.js.src %>/plugins/jquery.debounce.js',
39 '<%= dirs.js.src %>/plugins/jquery.mark.js',
49 '<%= dirs.js.src %>/plugins/jquery.mark.js',
40 '<%= dirs.js.src %>/plugins/jquery.timeago.js',
50 '<%= dirs.js.src %>/plugins/jquery.timeago.js',
41 '<%= dirs.js.src %>/plugins/jquery.timeago-extension.js',
51 '<%= dirs.js.src %>/plugins/jquery.timeago-extension.js',
42 '<%= dirs.js.src %>/plugins/toastr.js',
43
52
44 // Select2
53 // Select2
45 '<%= dirs.js.src %>/select2/select2.js',
54 '<%= dirs.js.src %>/select2/select2.js',
46
55
47 // Code-mirror
56 // Code-mirror
48 '<%= dirs.js.src %>/codemirror/codemirror.js',
57 '<%= dirs.js.src %>/codemirror/codemirror.js',
49 '<%= dirs.js.src %>/codemirror/codemirror_loadmode.js',
58 '<%= dirs.js.src %>/codemirror/codemirror_loadmode.js',
50 '<%= dirs.js.src %>/codemirror/codemirror_hint.js',
59 '<%= dirs.js.src %>/codemirror/codemirror_hint.js',
51 '<%= dirs.js.src %>/codemirror/codemirror_overlay.js',
60 '<%= dirs.js.src %>/codemirror/codemirror_overlay.js',
52 '<%= dirs.js.src %>/codemirror/codemirror_placeholder.js',
61 '<%= dirs.js.src %>/codemirror/codemirror_placeholder.js',
53 // TODO: mikhail: this is an exception. Since the code mirror modes
62 // TODO: mikhail: this is an exception. Since the code mirror modes
54 // are loaded "on the fly", we need to keep them in a public folder
63 // are loaded "on the fly", we need to keep them in a public folder
55 '<%= dirs.js.dest %>/mode/meta.js',
64 '<%= dirs.js.dest %>/mode/meta.js',
56 '<%= dirs.js.dest %>/mode/meta_ext.js',
65 '<%= dirs.js.dest %>/mode/meta_ext.js',
57 '<%= dirs.js.dest %>/rhodecode/i18n/select2/translations.js',
66 '<%= dirs.js.dest %>/rhodecode/i18n/select2/translations.js',
58
67
59 // Rhodecode utilities
68 // Rhodecode utilities
60 '<%= dirs.js.src %>/rhodecode/utils/array.js',
69 '<%= dirs.js.src %>/rhodecode/utils/array.js',
61 '<%= dirs.js.src %>/rhodecode/utils/string.js',
70 '<%= dirs.js.src %>/rhodecode/utils/string.js',
62 '<%= dirs.js.src %>/rhodecode/utils/pyroutes.js',
71 '<%= dirs.js.src %>/rhodecode/utils/pyroutes.js',
63 '<%= dirs.js.src %>/rhodecode/utils/ajax.js',
72 '<%= dirs.js.src %>/rhodecode/utils/ajax.js',
64 '<%= dirs.js.src %>/rhodecode/utils/autocomplete.js',
73 '<%= dirs.js.src %>/rhodecode/utils/autocomplete.js',
65 '<%= dirs.js.src %>/rhodecode/utils/colorgenerator.js',
74 '<%= dirs.js.src %>/rhodecode/utils/colorgenerator.js',
66 '<%= dirs.js.src %>/rhodecode/utils/ie.js',
75 '<%= dirs.js.src %>/rhodecode/utils/ie.js',
67 '<%= dirs.js.src %>/rhodecode/utils/os.js',
76 '<%= dirs.js.src %>/rhodecode/utils/os.js',
68 '<%= dirs.js.src %>/rhodecode/utils/topics.js',
77 '<%= dirs.js.src %>/rhodecode/utils/topics.js',
69
78
70 // Rhodecode widgets
79 // Rhodecode widgets
71 '<%= dirs.js.src %>/rhodecode/widgets/multiselect.js',
80 '<%= dirs.js.src %>/rhodecode/widgets/multiselect.js',
72
81
73 // Rhodecode components
82 // Rhodecode components
74 '<%= dirs.js.src %>/rhodecode/init.js',
83 '<%= dirs.js.src %>/rhodecode/init.js',
75 '<%= dirs.js.src %>/rhodecode/connection_controller.js',
84 '<%= dirs.js.src %>/rhodecode/connection_controller.js',
76 '<%= dirs.js.src %>/rhodecode/codemirror.js',
85 '<%= dirs.js.src %>/rhodecode/codemirror.js',
77 '<%= dirs.js.src %>/rhodecode/comments.js',
86 '<%= dirs.js.src %>/rhodecode/comments.js',
78 '<%= dirs.js.src %>/rhodecode/constants.js',
87 '<%= dirs.js.src %>/rhodecode/constants.js',
79 '<%= dirs.js.src %>/rhodecode/files.js',
88 '<%= dirs.js.src %>/rhodecode/files.js',
80 '<%= dirs.js.src %>/rhodecode/followers.js',
89 '<%= dirs.js.src %>/rhodecode/followers.js',
81 '<%= dirs.js.src %>/rhodecode/menus.js',
90 '<%= dirs.js.src %>/rhodecode/menus.js',
82 '<%= dirs.js.src %>/rhodecode/notifications.js',
91 '<%= dirs.js.src %>/rhodecode/notifications.js',
83 '<%= dirs.js.src %>/rhodecode/permissions.js',
92 '<%= dirs.js.src %>/rhodecode/permissions.js',
84 '<%= dirs.js.src %>/rhodecode/pjax.js',
93 '<%= dirs.js.src %>/rhodecode/pjax.js',
85 '<%= dirs.js.src %>/rhodecode/pullrequests.js',
94 '<%= dirs.js.src %>/rhodecode/pullrequests.js',
86 '<%= dirs.js.src %>/rhodecode/settings.js',
95 '<%= dirs.js.src %>/rhodecode/settings.js',
87 '<%= dirs.js.src %>/rhodecode/select2_widgets.js',
96 '<%= dirs.js.src %>/rhodecode/select2_widgets.js',
88 '<%= dirs.js.src %>/rhodecode/tooltips.js',
97 '<%= dirs.js.src %>/rhodecode/tooltips.js',
89 '<%= dirs.js.src %>/rhodecode/users.js',
98 '<%= dirs.js.src %>/rhodecode/users.js',
90 '<%= dirs.js.src %>/rhodecode/utils/notifications.js',
99 '<%= dirs.js.src %>/rhodecode/utils/notifications.js',
91 '<%= dirs.js.src %>/rhodecode/appenlight.js',
100 '<%= dirs.js.src %>/rhodecode/appenlight.js',
92
101
93 // Rhodecode main module
102 // Rhodecode main module
94 '<%= dirs.js.src %>/rhodecode.js'
103 '<%= dirs.js.src %>/rhodecode.js'
95 ],
104 ],
96 dest: '<%= dirs.js.dest %>/scripts.js',
105 dest: '<%= dirs.js.dest %>/scripts.js',
97 nonull: true
106 nonull: true
98 }
107 }
99 },
108 },
100
109
101 less: {
110 less: {
102 development: {
111 development: {
103 options: {
112 options: {
104 compress: false,
113 compress: false,
105 yuicompress: false,
114 yuicompress: false,
106 optimization: 0
115 optimization: 0
107 },
116 },
108 files: {
117 files: {
109 "<%= dirs.css %>/style.css": "<%= dirs.css %>/main.less"
118 "<%= dirs.css %>/style.css": "<%= dirs.css %>/main.less",
119 "<%= dirs.css %>/style-polymer.css": "<%= dirs.css %>/polymer.less"
110 }
120 }
111 },
121 },
112 production: {
122 production: {
113 options: {
123 options: {
114 compress: true,
124 compress: true,
115 yuicompress: true,
125 yuicompress: true,
116 optimization: 2
126 optimization: 2
117 },
127 },
118 files: {
128 files: {
119 "<%= dirs.css %>/style.css": "<%= dirs.css %>/main.less"
129 "<%= dirs.css %>/style.css": "<%= dirs.css %>/main.less",
130 "<%= dirs.css %>/style-polymer.css": "<%= dirs.css %>/polymer.less"
120 }
131 }
121 }
132 }
122 },
133 },
123
134
124 watch: {
135 watch: {
125 less: {
136 less: {
126 files: ["<%= dirs.css %>/*.less"],
137 files: ["<%= dirs.css %>/*.less"],
127 tasks: ["less:production"]
138 tasks: ["less:development", 'concat:polymercss', "vulcanize"]
128 },
139 },
129 js: {
140 js: {
130 files: ["<%= dirs.js.src %>/**/*.js", "<%= dirs.js.src %>/components/*.*"],
141 files: ["<%= dirs.js.src %>/**/*.js", "<%= dirs.js.src %>/components/*.*"],
131 tasks: ["concat:dist"]
142 tasks: ["vulcanize", "concat:dist"]
132 }
143 }
133 },
144 },
134
145
135 jshint: {
146 jshint: {
136 rhodecode: {
147 rhodecode: {
137 src: '<%= dirs.js.src %>/rhodecode/**/*.js',
148 src: '<%= dirs.js.src %>/rhodecode/**/*.js',
138 options: {
149 options: {
139 jshintrc: '.jshintrc'
150 jshintrc: '.jshintrc'
140 }
151 }
141 }
152 }
142 },
153 },
143 vulcanize: {
154 vulcanize: {
144 default: {
155 default: {
145 options: {
156 options: {
146 abspath: '',
157 abspath: '',
147 inlineScripts: true,
158 inlineScripts: true,
148 inlineCss: true,
159 inlineCss: true,
149 stripComments: true
160 stripComments: true
150 },
161 },
151 files: {
162 files: {
152 '<%= dirs.js.dest %>/rhodecode-components.html': '<%= dirs.js.src %>/components/shared-components.html'
163 '<%= dirs.js.dest %>/rhodecode-components.html': '<%= dirs.js.src %>/components/shared-components.html'
153 }
164 }
154 }
165 }
155 }
166 }
156 });
167 });
157
168
158 grunt.loadNpmTasks('grunt-contrib-less');
169 grunt.loadNpmTasks('grunt-contrib-less');
159 grunt.loadNpmTasks('grunt-contrib-concat');
170 grunt.loadNpmTasks('grunt-contrib-concat');
160 grunt.loadNpmTasks('grunt-contrib-watch');
171 grunt.loadNpmTasks('grunt-contrib-watch');
161 grunt.loadNpmTasks('grunt-contrib-jshint');
172 grunt.loadNpmTasks('grunt-contrib-jshint');
162 grunt.loadNpmTasks('grunt-vulcanize');
173 grunt.loadNpmTasks('grunt-vulcanize');
163 grunt.loadNpmTasks('grunt-crisper');
174 grunt.loadNpmTasks('grunt-crisper');
164 grunt.loadNpmTasks('grunt-contrib-copy');
175 grunt.loadNpmTasks('grunt-contrib-copy');
165
176
166 grunt.registerTask('default', ['copy','vulcanize', 'less:production', 'concat:dist']);
177 grunt.registerTask('default', ['less:production', 'concat:polymercss', 'copy','vulcanize', 'concat:dist']);
167 };
178 };
@@ -1,2105 +1,2109 b''
1 //Primary CSS
1 //Primary CSS
2
2
3 //--- IMPORTS ------------------//
3 //--- IMPORTS ------------------//
4
4
5 @import 'helpers';
5 @import 'helpers';
6 @import 'mixins';
6 @import 'mixins';
7 @import 'rcicons';
7 @import 'rcicons';
8 @import 'fonts';
8 @import 'fonts';
9 @import 'variables';
9 @import 'variables';
10 @import 'bootstrap-variables';
10 @import 'bootstrap-variables';
11 @import 'form-bootstrap';
11 @import 'form-bootstrap';
12 @import 'codemirror';
12 @import 'codemirror';
13 @import 'legacy_code_styles';
13 @import 'legacy_code_styles';
14 @import 'progress-bar';
14 @import 'progress-bar';
15
15
16 @import 'type';
16 @import 'type';
17 @import 'alerts';
17 @import 'alerts';
18 @import 'buttons';
18 @import 'buttons';
19 @import 'tags';
19 @import 'tags';
20 @import 'code-block';
20 @import 'code-block';
21 @import 'examples';
21 @import 'examples';
22 @import 'login';
22 @import 'login';
23 @import 'main-content';
23 @import 'main-content';
24 @import 'select2';
24 @import 'select2';
25 @import 'comments';
25 @import 'comments';
26 @import 'panels-bootstrap';
26 @import 'panels-bootstrap';
27 @import 'panels';
27 @import 'panels';
28 @import 'toastr';
29 @import 'deform';
28 @import 'deform';
30
29
31
30
32 //--- BASE ------------------//
31 //--- BASE ------------------//
33 .noscript-error {
32 .noscript-error {
34 top: 0;
33 top: 0;
35 left: 0;
34 left: 0;
36 width: 100%;
35 width: 100%;
37 z-index: 101;
36 z-index: 101;
38 text-align: center;
37 text-align: center;
39 font-family: @text-semibold;
38 font-family: @text-semibold;
40 font-size: 120%;
39 font-size: 120%;
41 color: white;
40 color: white;
42 background-color: @alert2;
41 background-color: @alert2;
43 padding: 5px 0 5px 0;
42 padding: 5px 0 5px 0;
44 }
43 }
45
44
46 html {
45 html {
47 display: table;
46 display: table;
48 height: 100%;
47 height: 100%;
49 width: 100%;
48 width: 100%;
50 }
49 }
51
50
52 body {
51 body {
53 display: table-cell;
52 display: table-cell;
54 width: 100%;
53 width: 100%;
55 }
54 }
56
55
57 //--- LAYOUT ------------------//
56 //--- LAYOUT ------------------//
58
57
59 .hidden{
58 .hidden{
60 display: none !important;
59 display: none !important;
61 }
60 }
62
61
63 .box{
62 .box{
64 float: left;
63 float: left;
65 width: 100%;
64 width: 100%;
66 }
65 }
67
66
68 .browser-header {
67 .browser-header {
69 clear: both;
68 clear: both;
70 }
69 }
71 .main {
70 .main {
72 clear: both;
71 clear: both;
73 padding:0 0 @pagepadding;
72 padding:0 0 @pagepadding;
74 height: auto;
73 height: auto;
75
74
76 &:after { //clearfix
75 &:after { //clearfix
77 content:"";
76 content:"";
78 clear:both;
77 clear:both;
79 width:100%;
78 width:100%;
80 display:block;
79 display:block;
81 }
80 }
82 }
81 }
83
82
84 .action-link{
83 .action-link{
85 margin-left: @padding;
84 margin-left: @padding;
86 padding-left: @padding;
85 padding-left: @padding;
87 border-left: @border-thickness solid @border-default-color;
86 border-left: @border-thickness solid @border-default-color;
88 }
87 }
89
88
90 input + .action-link, .action-link.first{
89 input + .action-link, .action-link.first{
91 border-left: none;
90 border-left: none;
92 }
91 }
93
92
94 .action-link.last{
93 .action-link.last{
95 margin-right: @padding;
94 margin-right: @padding;
96 padding-right: @padding;
95 padding-right: @padding;
97 }
96 }
98
97
99 .action-link.active,
98 .action-link.active,
100 .action-link.active a{
99 .action-link.active a{
101 color: @grey4;
100 color: @grey4;
102 }
101 }
103
102
104 ul.simple-list{
103 ul.simple-list{
105 list-style: none;
104 list-style: none;
106 margin: 0;
105 margin: 0;
107 padding: 0;
106 padding: 0;
108 }
107 }
109
108
110 .main-content {
109 .main-content {
111 padding-bottom: @pagepadding;
110 padding-bottom: @pagepadding;
112 }
111 }
113
112
114 .wrapper {
113 .wrapper {
115 position: relative;
114 position: relative;
116 max-width: @wrapper-maxwidth;
115 max-width: @wrapper-maxwidth;
117 margin: 0 auto;
116 margin: 0 auto;
118 }
117 }
119
118
120 #content {
119 #content {
121 clear: both;
120 clear: both;
122 padding: 0 @contentpadding;
121 padding: 0 @contentpadding;
123 }
122 }
124
123
125 .advanced-settings-fields{
124 .advanced-settings-fields{
126 input{
125 input{
127 margin-left: @textmargin;
126 margin-left: @textmargin;
128 margin-right: @padding/2;
127 margin-right: @padding/2;
129 }
128 }
130 }
129 }
131
130
132 .cs_files_title {
131 .cs_files_title {
133 margin: @pagepadding 0 0;
132 margin: @pagepadding 0 0;
134 }
133 }
135
134
136 input.inline[type="file"] {
135 input.inline[type="file"] {
137 display: inline;
136 display: inline;
138 }
137 }
139
138
140 .error_page {
139 .error_page {
141 margin: 10% auto;
140 margin: 10% auto;
142
141
143 h1 {
142 h1 {
144 color: @grey2;
143 color: @grey2;
145 }
144 }
146
145
147 .error-branding {
146 .error-branding {
148 font-family: @text-semibold;
147 font-family: @text-semibold;
149 color: @grey4;
148 color: @grey4;
150 }
149 }
151
150
152 .error_message {
151 .error_message {
153 font-family: @text-regular;
152 font-family: @text-regular;
154 }
153 }
155
154
156 .sidebar {
155 .sidebar {
157 min-height: 275px;
156 min-height: 275px;
158 margin: 0;
157 margin: 0;
159 padding: 0 0 @sidebarpadding @sidebarpadding;
158 padding: 0 0 @sidebarpadding @sidebarpadding;
160 border: none;
159 border: none;
161 }
160 }
162
161
163 .main-content {
162 .main-content {
164 position: relative;
163 position: relative;
165 margin: 0 @sidebarpadding @sidebarpadding;
164 margin: 0 @sidebarpadding @sidebarpadding;
166 padding: 0 0 0 @sidebarpadding;
165 padding: 0 0 0 @sidebarpadding;
167 border-left: @border-thickness solid @grey5;
166 border-left: @border-thickness solid @grey5;
168
167
169 @media (max-width:767px) {
168 @media (max-width:767px) {
170 clear: both;
169 clear: both;
171 width: 100%;
170 width: 100%;
172 margin: 0;
171 margin: 0;
173 border: none;
172 border: none;
174 }
173 }
175 }
174 }
176
175
177 .inner-column {
176 .inner-column {
178 float: left;
177 float: left;
179 width: 29.75%;
178 width: 29.75%;
180 min-height: 150px;
179 min-height: 150px;
181 margin: @sidebarpadding 2% 0 0;
180 margin: @sidebarpadding 2% 0 0;
182 padding: 0 2% 0 0;
181 padding: 0 2% 0 0;
183 border-right: @border-thickness solid @grey5;
182 border-right: @border-thickness solid @grey5;
184
183
185 @media (max-width:767px) {
184 @media (max-width:767px) {
186 clear: both;
185 clear: both;
187 width: 100%;
186 width: 100%;
188 border: none;
187 border: none;
189 }
188 }
190
189
191 ul {
190 ul {
192 padding-left: 1.25em;
191 padding-left: 1.25em;
193 }
192 }
194
193
195 &:last-child {
194 &:last-child {
196 margin: @sidebarpadding 0 0;
195 margin: @sidebarpadding 0 0;
197 border: none;
196 border: none;
198 }
197 }
199
198
200 h4 {
199 h4 {
201 margin: 0 0 @padding;
200 margin: 0 0 @padding;
202 font-family: @text-semibold;
201 font-family: @text-semibold;
203 }
202 }
204 }
203 }
205 }
204 }
206 .error-page-logo {
205 .error-page-logo {
207 width: 130px;
206 width: 130px;
208 height: 160px;
207 height: 160px;
209 }
208 }
210
209
211 // HEADER
210 // HEADER
212 .header {
211 .header {
213
212
214 // TODO: johbo: Fix login pages, so that they work without a min-height
213 // TODO: johbo: Fix login pages, so that they work without a min-height
215 // for the header and then remove the min-height. I chose a smaller value
214 // for the header and then remove the min-height. I chose a smaller value
216 // intentionally here to avoid rendering issues in the main navigation.
215 // intentionally here to avoid rendering issues in the main navigation.
217 min-height: 49px;
216 min-height: 49px;
218
217
219 position: relative;
218 position: relative;
220 vertical-align: bottom;
219 vertical-align: bottom;
221 padding: 0 @header-padding;
220 padding: 0 @header-padding;
222 background-color: @grey2;
221 background-color: @grey2;
223 color: @grey5;
222 color: @grey5;
224
223
225 .title {
224 .title {
226 overflow: visible;
225 overflow: visible;
227 }
226 }
228
227
229 &:before,
228 &:before,
230 &:after {
229 &:after {
231 content: "";
230 content: "";
232 clear: both;
231 clear: both;
233 width: 100%;
232 width: 100%;
234 }
233 }
235
234
236 // TODO: johbo: Avoids breaking "Repositories" chooser
235 // TODO: johbo: Avoids breaking "Repositories" chooser
237 .select2-container .select2-choice .select2-arrow {
236 .select2-container .select2-choice .select2-arrow {
238 display: none;
237 display: none;
239 }
238 }
240 }
239 }
241
240
242 #header-inner {
241 #header-inner {
243 &.title {
242 &.title {
244 margin: 0;
243 margin: 0;
245 }
244 }
246 &:before,
245 &:before,
247 &:after {
246 &:after {
248 content: "";
247 content: "";
249 clear: both;
248 clear: both;
250 }
249 }
251 }
250 }
252
251
253 // Gists
252 // Gists
254 #files_data {
253 #files_data {
255 clear: both; //for firefox
254 clear: both; //for firefox
256 }
255 }
257 #gistid {
256 #gistid {
258 margin-right: @padding;
257 margin-right: @padding;
259 }
258 }
260
259
261 // Global Settings Editor
260 // Global Settings Editor
262 .textarea.editor {
261 .textarea.editor {
263 float: left;
262 float: left;
264 position: relative;
263 position: relative;
265 max-width: @texteditor-width;
264 max-width: @texteditor-width;
266
265
267 select {
266 select {
268 position: absolute;
267 position: absolute;
269 top:10px;
268 top:10px;
270 right:0;
269 right:0;
271 }
270 }
272
271
273 .CodeMirror {
272 .CodeMirror {
274 margin: 0;
273 margin: 0;
275 }
274 }
276
275
277 .help-block {
276 .help-block {
278 margin: 0 0 @padding;
277 margin: 0 0 @padding;
279 padding:.5em;
278 padding:.5em;
280 background-color: @grey6;
279 background-color: @grey6;
281 }
280 }
282 }
281 }
283
282
284 ul.auth_plugins {
283 ul.auth_plugins {
285 margin: @padding 0 @padding @legend-width;
284 margin: @padding 0 @padding @legend-width;
286 padding: 0;
285 padding: 0;
287
286
288 li {
287 li {
289 margin-bottom: @padding;
288 margin-bottom: @padding;
290 line-height: 1em;
289 line-height: 1em;
291 list-style-type: none;
290 list-style-type: none;
292
291
293 .auth_buttons .btn {
292 .auth_buttons .btn {
294 margin-right: @padding;
293 margin-right: @padding;
295 }
294 }
296
295
297 &:before { content: none; }
296 &:before { content: none; }
298 }
297 }
299 }
298 }
300
299
301
300
302 // My Account PR list
301 // My Account PR list
303
302
304 #show_closed {
303 #show_closed {
305 margin: 0 1em 0 0;
304 margin: 0 1em 0 0;
306 }
305 }
307
306
308 .pullrequestlist {
307 .pullrequestlist {
309 .closed {
308 .closed {
310 background-color: @grey6;
309 background-color: @grey6;
311 }
310 }
312 .td-status {
311 .td-status {
313 padding-left: .5em;
312 padding-left: .5em;
314 }
313 }
315 .log-container .truncate {
314 .log-container .truncate {
316 height: 2.75em;
315 height: 2.75em;
317 white-space: pre-line;
316 white-space: pre-line;
318 }
317 }
319 table.rctable .user {
318 table.rctable .user {
320 padding-left: 0;
319 padding-left: 0;
321 }
320 }
322 table.rctable {
321 table.rctable {
323 td.td-description,
322 td.td-description,
324 .rc-user {
323 .rc-user {
325 min-width: auto;
324 min-width: auto;
326 }
325 }
327 }
326 }
328 }
327 }
329
328
330 // Pull Requests
329 // Pull Requests
331
330
332 .pullrequests_section_head {
331 .pullrequests_section_head {
333 display: block;
332 display: block;
334 clear: both;
333 clear: both;
335 margin: @padding 0;
334 margin: @padding 0;
336 font-family: @text-bold;
335 font-family: @text-bold;
337 }
336 }
338
337
339 .pr-origininfo, .pr-targetinfo {
338 .pr-origininfo, .pr-targetinfo {
340 position: relative;
339 position: relative;
341
340
342 .tag {
341 .tag {
343 display: inline-block;
342 display: inline-block;
344 margin: 0 1em .5em 0;
343 margin: 0 1em .5em 0;
345 }
344 }
346
345
347 .clone-url {
346 .clone-url {
348 display: inline-block;
347 display: inline-block;
349 margin: 0 0 .5em 0;
348 margin: 0 0 .5em 0;
350 padding: 0;
349 padding: 0;
351 line-height: 1.2em;
350 line-height: 1.2em;
352 }
351 }
353 }
352 }
354
353
355 .pr-pullinfo {
354 .pr-pullinfo {
356 clear: both;
355 clear: both;
357 margin: .5em 0;
356 margin: .5em 0;
358 }
357 }
359
358
360 #pr-title-input {
359 #pr-title-input {
361 width: 72%;
360 width: 72%;
362 font-size: 1em;
361 font-size: 1em;
363 font-family: @text-bold;
362 font-family: @text-bold;
364 margin: 0;
363 margin: 0;
365 padding: 0 0 0 @padding/4;
364 padding: 0 0 0 @padding/4;
366 line-height: 1.7em;
365 line-height: 1.7em;
367 color: @text-color;
366 color: @text-color;
368 letter-spacing: .02em;
367 letter-spacing: .02em;
369 }
368 }
370
369
371 #pullrequest_title {
370 #pullrequest_title {
372 width: 100%;
371 width: 100%;
373 box-sizing: border-box;
372 box-sizing: border-box;
374 }
373 }
375
374
376 #pr_open_message {
375 #pr_open_message {
377 border: @border-thickness solid #fff;
376 border: @border-thickness solid #fff;
378 border-radius: @border-radius;
377 border-radius: @border-radius;
379 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
378 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
380 text-align: right;
379 text-align: right;
381 overflow: hidden;
380 overflow: hidden;
382 }
381 }
383
382
384 .pr-submit-button {
383 .pr-submit-button {
385 float: right;
384 float: right;
386 margin: 0 0 0 5px;
385 margin: 0 0 0 5px;
387 }
386 }
388
387
389 .pr-spacing-container {
388 .pr-spacing-container {
390 padding: 20px;
389 padding: 20px;
391 clear: both
390 clear: both
392 }
391 }
393
392
394 #pr-description-input {
393 #pr-description-input {
395 margin-bottom: 0;
394 margin-bottom: 0;
396 }
395 }
397
396
398 .pr-description-label {
397 .pr-description-label {
399 vertical-align: top;
398 vertical-align: top;
400 }
399 }
401
400
402 .perms_section_head {
401 .perms_section_head {
403 min-width: 625px;
402 min-width: 625px;
404
403
405 h2 {
404 h2 {
406 margin-bottom: 0;
405 margin-bottom: 0;
407 }
406 }
408
407
409 .label-checkbox {
408 .label-checkbox {
410 float: left;
409 float: left;
411 }
410 }
412
411
413 &.field {
412 &.field {
414 margin: @space 0 @padding;
413 margin: @space 0 @padding;
415 }
414 }
416
415
417 &:first-child.field {
416 &:first-child.field {
418 margin-top: 0;
417 margin-top: 0;
419
418
420 .label {
419 .label {
421 margin-top: 0;
420 margin-top: 0;
422 padding-top: 0;
421 padding-top: 0;
423 }
422 }
424
423
425 .radios {
424 .radios {
426 padding-top: 0;
425 padding-top: 0;
427 }
426 }
428 }
427 }
429
428
430 .radios {
429 .radios {
431 float: right;
430 float: right;
432 position: relative;
431 position: relative;
433 width: 405px;
432 width: 405px;
434 }
433 }
435 }
434 }
436
435
437 //--- MODULES ------------------//
436 //--- MODULES ------------------//
438
437
439
438
440 // Fixed Sidebar Column
439 // Fixed Sidebar Column
441 .sidebar-col-wrapper {
440 .sidebar-col-wrapper {
442 padding-left: @sidebar-all-width;
441 padding-left: @sidebar-all-width;
443
442
444 .sidebar {
443 .sidebar {
445 width: @sidebar-width;
444 width: @sidebar-width;
446 margin-left: -@sidebar-all-width;
445 margin-left: -@sidebar-all-width;
447 }
446 }
448 }
447 }
449
448
450 .sidebar-col-wrapper.scw-small {
449 .sidebar-col-wrapper.scw-small {
451 padding-left: @sidebar-small-all-width;
450 padding-left: @sidebar-small-all-width;
452
451
453 .sidebar {
452 .sidebar {
454 width: @sidebar-small-width;
453 width: @sidebar-small-width;
455 margin-left: -@sidebar-small-all-width;
454 margin-left: -@sidebar-small-all-width;
456 }
455 }
457 }
456 }
458
457
459
458
460 // FOOTER
459 // FOOTER
461 #footer {
460 #footer {
462 padding: 0;
461 padding: 0;
463 text-align: center;
462 text-align: center;
464 vertical-align: middle;
463 vertical-align: middle;
465 color: @grey2;
464 color: @grey2;
466 background-color: @grey6;
465 background-color: @grey6;
467
466
468 p {
467 p {
469 margin: 0;
468 margin: 0;
470 padding: 1em;
469 padding: 1em;
471 line-height: 1em;
470 line-height: 1em;
472 }
471 }
473
472
474 .server-instance { //server instance
473 .server-instance { //server instance
475 display: none;
474 display: none;
476 }
475 }
477
476
478 .title {
477 .title {
479 float: none;
478 float: none;
480 margin: 0 auto;
479 margin: 0 auto;
481 }
480 }
482 }
481 }
483
482
484 button.close {
483 button.close {
485 padding: 0;
484 padding: 0;
486 cursor: pointer;
485 cursor: pointer;
487 background: transparent;
486 background: transparent;
488 border: 0;
487 border: 0;
489 .box-shadow(none);
488 .box-shadow(none);
490 -webkit-appearance: none;
489 -webkit-appearance: none;
491 }
490 }
492
491
493 .close {
492 .close {
494 float: right;
493 float: right;
495 font-size: 21px;
494 font-size: 21px;
496 font-family: @text-bootstrap;
495 font-family: @text-bootstrap;
497 line-height: 1em;
496 line-height: 1em;
498 font-weight: bold;
497 font-weight: bold;
499 color: @grey2;
498 color: @grey2;
500
499
501 &:hover,
500 &:hover,
502 &:focus {
501 &:focus {
503 color: @grey1;
502 color: @grey1;
504 text-decoration: none;
503 text-decoration: none;
505 cursor: pointer;
504 cursor: pointer;
506 }
505 }
507 }
506 }
508
507
509 // GRID
508 // GRID
510 .sorting,
509 .sorting,
511 .sorting_desc,
510 .sorting_desc,
512 .sorting_asc {
511 .sorting_asc {
513 cursor: pointer;
512 cursor: pointer;
514 }
513 }
515 .sorting_desc:after {
514 .sorting_desc:after {
516 content: "\00A0\25B2";
515 content: "\00A0\25B2";
517 font-size: .75em;
516 font-size: .75em;
518 }
517 }
519 .sorting_asc:after {
518 .sorting_asc:after {
520 content: "\00A0\25BC";
519 content: "\00A0\25BC";
521 font-size: .68em;
520 font-size: .68em;
522 }
521 }
523
522
524
523
525 .user_auth_tokens {
524 .user_auth_tokens {
526
525
527 &.truncate {
526 &.truncate {
528 white-space: nowrap;
527 white-space: nowrap;
529 overflow: hidden;
528 overflow: hidden;
530 text-overflow: ellipsis;
529 text-overflow: ellipsis;
531 }
530 }
532
531
533 .fields .field .input {
532 .fields .field .input {
534 margin: 0;
533 margin: 0;
535 }
534 }
536
535
537 input#description {
536 input#description {
538 width: 100px;
537 width: 100px;
539 margin: 0;
538 margin: 0;
540 }
539 }
541
540
542 .drop-menu {
541 .drop-menu {
543 // TODO: johbo: Remove this, should work out of the box when
542 // TODO: johbo: Remove this, should work out of the box when
544 // having multiple inputs inline
543 // having multiple inputs inline
545 margin: 0 0 0 5px;
544 margin: 0 0 0 5px;
546 }
545 }
547 }
546 }
548 #user_list_table {
547 #user_list_table {
549 .closed {
548 .closed {
550 background-color: @grey6;
549 background-color: @grey6;
551 }
550 }
552 }
551 }
553
552
554
553
555 input {
554 input {
556 &.disabled {
555 &.disabled {
557 opacity: .5;
556 opacity: .5;
558 }
557 }
559 }
558 }
560
559
561 // remove extra padding in firefox
560 // remove extra padding in firefox
562 input::-moz-focus-inner { border:0; padding:0 }
561 input::-moz-focus-inner { border:0; padding:0 }
563
562
564 .adjacent input {
563 .adjacent input {
565 margin-bottom: @padding;
564 margin-bottom: @padding;
566 }
565 }
567
566
568 .permissions_boxes {
567 .permissions_boxes {
569 display: block;
568 display: block;
570 }
569 }
571
570
572 //TODO: lisa: this should be in tables
571 //TODO: lisa: this should be in tables
573 .show_more_col {
572 .show_more_col {
574 width: 20px;
573 width: 20px;
575 }
574 }
576
575
577 //FORMS
576 //FORMS
578
577
579 .medium-inline,
578 .medium-inline,
580 input#description.medium-inline {
579 input#description.medium-inline {
581 display: inline;
580 display: inline;
582 width: @medium-inline-input-width;
581 width: @medium-inline-input-width;
583 min-width: 100px;
582 min-width: 100px;
584 }
583 }
585
584
586 select {
585 select {
587 //reset
586 //reset
588 -webkit-appearance: none;
587 -webkit-appearance: none;
589 -moz-appearance: none;
588 -moz-appearance: none;
590
589
591 display: inline-block;
590 display: inline-block;
592 height: 28px;
591 height: 28px;
593 width: auto;
592 width: auto;
594 margin: 0 @padding @padding 0;
593 margin: 0 @padding @padding 0;
595 padding: 0 18px 0 8px;
594 padding: 0 18px 0 8px;
596 line-height:1em;
595 line-height:1em;
597 font-size: @basefontsize;
596 font-size: @basefontsize;
598 border: @border-thickness solid @rcblue;
597 border: @border-thickness solid @rcblue;
599 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
598 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
600 color: @rcblue;
599 color: @rcblue;
601
600
602 &:after {
601 &:after {
603 content: "\00A0\25BE";
602 content: "\00A0\25BE";
604 }
603 }
605
604
606 &:focus {
605 &:focus {
607 outline: none;
606 outline: none;
608 }
607 }
609 }
608 }
610
609
611 option {
610 option {
612 &:focus {
611 &:focus {
613 outline: none;
612 outline: none;
614 }
613 }
615 }
614 }
616
615
617 input,
616 input,
618 textarea {
617 textarea {
619 padding: @input-padding;
618 padding: @input-padding;
620 border: @input-border-thickness solid @border-highlight-color;
619 border: @input-border-thickness solid @border-highlight-color;
621 .border-radius (@border-radius);
620 .border-radius (@border-radius);
622 font-family: @text-light;
621 font-family: @text-light;
623 font-size: @basefontsize;
622 font-size: @basefontsize;
624
623
625 &.input-sm {
624 &.input-sm {
626 padding: 5px;
625 padding: 5px;
627 }
626 }
628
627
629 &#description {
628 &#description {
630 min-width: @input-description-minwidth;
629 min-width: @input-description-minwidth;
631 min-height: 1em;
630 min-height: 1em;
632 padding: 10px;
631 padding: 10px;
633 }
632 }
634 }
633 }
635
634
636 .field-sm {
635 .field-sm {
637 input,
636 input,
638 textarea {
637 textarea {
639 padding: 5px;
638 padding: 5px;
640 }
639 }
641 }
640 }
642
641
643 textarea {
642 textarea {
644 display: block;
643 display: block;
645 clear: both;
644 clear: both;
646 width: 100%;
645 width: 100%;
647 min-height: 100px;
646 min-height: 100px;
648 margin-bottom: @padding;
647 margin-bottom: @padding;
649 .box-sizing(border-box);
648 .box-sizing(border-box);
650 overflow: auto;
649 overflow: auto;
651 }
650 }
652
651
653 label {
652 label {
654 font-family: @text-light;
653 font-family: @text-light;
655 }
654 }
656
655
657 // GRAVATARS
656 // GRAVATARS
658 // centers gravatar on username to the right
657 // centers gravatar on username to the right
659
658
660 .gravatar {
659 .gravatar {
661 display: inline;
660 display: inline;
662 min-width: 16px;
661 min-width: 16px;
663 min-height: 16px;
662 min-height: 16px;
664 margin: -5px 0;
663 margin: -5px 0;
665 padding: 0;
664 padding: 0;
666 line-height: 1em;
665 line-height: 1em;
667 border: 1px solid @grey4;
666 border: 1px solid @grey4;
668
667
669 &.gravatar-large {
668 &.gravatar-large {
670 margin: -0.5em .25em -0.5em 0;
669 margin: -0.5em .25em -0.5em 0;
671 }
670 }
672
671
673 & + .user {
672 & + .user {
674 display: inline;
673 display: inline;
675 margin: 0;
674 margin: 0;
676 padding: 0 0 0 .17em;
675 padding: 0 0 0 .17em;
677 line-height: 1em;
676 line-height: 1em;
678 }
677 }
679 }
678 }
680
679
681 .user-inline-data {
680 .user-inline-data {
682 display: inline-block;
681 display: inline-block;
683 float: left;
682 float: left;
684 padding-left: .5em;
683 padding-left: .5em;
685 line-height: 1.3em;
684 line-height: 1.3em;
686 }
685 }
687
686
688 .rc-user { // gravatar + user wrapper
687 .rc-user { // gravatar + user wrapper
689 float: left;
688 float: left;
690 position: relative;
689 position: relative;
691 min-width: 100px;
690 min-width: 100px;
692 max-width: 200px;
691 max-width: 200px;
693 min-height: (@gravatar-size + @border-thickness * 2); // account for border
692 min-height: (@gravatar-size + @border-thickness * 2); // account for border
694 display: block;
693 display: block;
695 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
694 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
696
695
697
696
698 .gravatar {
697 .gravatar {
699 display: block;
698 display: block;
700 position: absolute;
699 position: absolute;
701 top: 0;
700 top: 0;
702 left: 0;
701 left: 0;
703 min-width: @gravatar-size;
702 min-width: @gravatar-size;
704 min-height: @gravatar-size;
703 min-height: @gravatar-size;
705 margin: 0;
704 margin: 0;
706 }
705 }
707
706
708 .user {
707 .user {
709 display: block;
708 display: block;
710 max-width: 175px;
709 max-width: 175px;
711 padding-top: 2px;
710 padding-top: 2px;
712 overflow: hidden;
711 overflow: hidden;
713 text-overflow: ellipsis;
712 text-overflow: ellipsis;
714 }
713 }
715 }
714 }
716
715
717 .gist-gravatar,
716 .gist-gravatar,
718 .journal_container {
717 .journal_container {
719 .gravatar-large {
718 .gravatar-large {
720 margin: 0 .5em -10px 0;
719 margin: 0 .5em -10px 0;
721 }
720 }
722 }
721 }
723
722
724
723
725 // ADMIN SETTINGS
724 // ADMIN SETTINGS
726
725
727 // Tag Patterns
726 // Tag Patterns
728 .tag_patterns {
727 .tag_patterns {
729 .tag_input {
728 .tag_input {
730 margin-bottom: @padding;
729 margin-bottom: @padding;
731 }
730 }
732 }
731 }
733
732
734 .locked_input {
733 .locked_input {
735 position: relative;
734 position: relative;
736
735
737 input {
736 input {
738 display: inline;
737 display: inline;
739 margin-top: 3px;
738 margin-top: 3px;
740 }
739 }
741
740
742 br {
741 br {
743 display: none;
742 display: none;
744 }
743 }
745
744
746 .error-message {
745 .error-message {
747 float: left;
746 float: left;
748 width: 100%;
747 width: 100%;
749 }
748 }
750
749
751 .lock_input_button {
750 .lock_input_button {
752 display: inline;
751 display: inline;
753 }
752 }
754
753
755 .help-block {
754 .help-block {
756 clear: both;
755 clear: both;
757 }
756 }
758 }
757 }
759
758
760 // Notifications
759 // Notifications
761
760
762 .notifications_buttons {
761 .notifications_buttons {
763 margin: 0 0 @space 0;
762 margin: 0 0 @space 0;
764 padding: 0;
763 padding: 0;
765
764
766 .btn {
765 .btn {
767 display: inline-block;
766 display: inline-block;
768 }
767 }
769 }
768 }
770
769
771 .notification-list {
770 .notification-list {
772
771
773 div {
772 div {
774 display: inline-block;
773 display: inline-block;
775 vertical-align: middle;
774 vertical-align: middle;
776 }
775 }
777
776
778 .container {
777 .container {
779 display: block;
778 display: block;
780 margin: 0 0 @padding 0;
779 margin: 0 0 @padding 0;
781 }
780 }
782
781
783 .delete-notifications {
782 .delete-notifications {
784 margin-left: @padding;
783 margin-left: @padding;
785 text-align: right;
784 text-align: right;
786 cursor: pointer;
785 cursor: pointer;
787 }
786 }
788
787
789 .read-notifications {
788 .read-notifications {
790 margin-left: @padding/2;
789 margin-left: @padding/2;
791 text-align: right;
790 text-align: right;
792 width: 35px;
791 width: 35px;
793 cursor: pointer;
792 cursor: pointer;
794 }
793 }
795
794
796 .icon-minus-sign {
795 .icon-minus-sign {
797 color: @alert2;
796 color: @alert2;
798 }
797 }
799
798
800 .icon-ok-sign {
799 .icon-ok-sign {
801 color: @alert1;
800 color: @alert1;
802 }
801 }
803 }
802 }
804
803
805 .user_settings {
804 .user_settings {
806 float: left;
805 float: left;
807 clear: both;
806 clear: both;
808 display: block;
807 display: block;
809 width: 100%;
808 width: 100%;
810
809
811 .gravatar_box {
810 .gravatar_box {
812 margin-bottom: @padding;
811 margin-bottom: @padding;
813
812
814 &:after {
813 &:after {
815 content: " ";
814 content: " ";
816 clear: both;
815 clear: both;
817 width: 100%;
816 width: 100%;
818 }
817 }
819 }
818 }
820
819
821 .fields .field {
820 .fields .field {
822 clear: both;
821 clear: both;
823 }
822 }
824 }
823 }
825
824
826 .advanced_settings {
825 .advanced_settings {
827 margin-bottom: @space;
826 margin-bottom: @space;
828
827
829 .help-block {
828 .help-block {
830 margin-left: 0;
829 margin-left: 0;
831 }
830 }
832
831
833 button + .help-block {
832 button + .help-block {
834 margin-top: @padding;
833 margin-top: @padding;
835 }
834 }
836 }
835 }
837
836
838 // admin settings radio buttons and labels
837 // admin settings radio buttons and labels
839 .label-2 {
838 .label-2 {
840 float: left;
839 float: left;
841 width: @label2-width;
840 width: @label2-width;
842
841
843 label {
842 label {
844 color: @grey1;
843 color: @grey1;
845 }
844 }
846 }
845 }
847 .checkboxes {
846 .checkboxes {
848 float: left;
847 float: left;
849 width: @checkboxes-width;
848 width: @checkboxes-width;
850 margin-bottom: @padding;
849 margin-bottom: @padding;
851
850
852 .checkbox {
851 .checkbox {
853 width: 100%;
852 width: 100%;
854
853
855 label {
854 label {
856 margin: 0;
855 margin: 0;
857 padding: 0;
856 padding: 0;
858 }
857 }
859 }
858 }
860
859
861 .checkbox + .checkbox {
860 .checkbox + .checkbox {
862 display: inline-block;
861 display: inline-block;
863 }
862 }
864
863
865 label {
864 label {
866 margin-right: 1em;
865 margin-right: 1em;
867 }
866 }
868 }
867 }
869
868
870 // CHANGELOG
869 // CHANGELOG
871 .container_header {
870 .container_header {
872 float: left;
871 float: left;
873 display: block;
872 display: block;
874 width: 100%;
873 width: 100%;
875 margin: @padding 0 @padding;
874 margin: @padding 0 @padding;
876
875
877 #filter_changelog {
876 #filter_changelog {
878 float: left;
877 float: left;
879 margin-right: @padding;
878 margin-right: @padding;
880 }
879 }
881
880
882 .breadcrumbs_light {
881 .breadcrumbs_light {
883 display: inline-block;
882 display: inline-block;
884 }
883 }
885 }
884 }
886
885
887 .info_box {
886 .info_box {
888 float: right;
887 float: right;
889 }
888 }
890
889
891
890
892 #graph_nodes {
891 #graph_nodes {
893 padding-top: 43px;
892 padding-top: 43px;
894 }
893 }
895
894
896 #graph_content{
895 #graph_content{
897
896
898 // adjust for table headers so that graph renders properly
897 // adjust for table headers so that graph renders properly
899 // #graph_nodes padding - table cell padding
898 // #graph_nodes padding - table cell padding
900 padding-top: (@space - (@basefontsize * 2.4));
899 padding-top: (@space - (@basefontsize * 2.4));
901
900
902 &.graph_full_width {
901 &.graph_full_width {
903 width: 100%;
902 width: 100%;
904 max-width: 100%;
903 max-width: 100%;
905 }
904 }
906 }
905 }
907
906
908 #graph {
907 #graph {
909 .flag_status {
908 .flag_status {
910 margin: 0;
909 margin: 0;
911 }
910 }
912
911
913 .pagination-left {
912 .pagination-left {
914 float: left;
913 float: left;
915 clear: both;
914 clear: both;
916 }
915 }
917
916
918 .log-container {
917 .log-container {
919 max-width: 345px;
918 max-width: 345px;
920
919
921 .message{
920 .message{
922 max-width: 340px;
921 max-width: 340px;
923 }
922 }
924 }
923 }
925
924
926 .graph-col-wrapper {
925 .graph-col-wrapper {
927 padding-left: 110px;
926 padding-left: 110px;
928
927
929 #graph_nodes {
928 #graph_nodes {
930 width: 100px;
929 width: 100px;
931 margin-left: -110px;
930 margin-left: -110px;
932 float: left;
931 float: left;
933 clear: left;
932 clear: left;
934 }
933 }
935 }
934 }
936 }
935 }
937
936
938 #filter_changelog {
937 #filter_changelog {
939 float: left;
938 float: left;
940 }
939 }
941
940
942
941
943 //--- THEME ------------------//
942 //--- THEME ------------------//
944
943
945 #logo {
944 #logo {
946 float: left;
945 float: left;
947 margin: 9px 0 0 0;
946 margin: 9px 0 0 0;
948
947
949 .header {
948 .header {
950 background-color: transparent;
949 background-color: transparent;
951 }
950 }
952
951
953 a {
952 a {
954 display: inline-block;
953 display: inline-block;
955 }
954 }
956
955
957 img {
956 img {
958 height:30px;
957 height:30px;
959 }
958 }
960 }
959 }
961
960
962 .logo-wrapper {
961 .logo-wrapper {
963 float:left;
962 float:left;
964 }
963 }
965
964
966 .branding{
965 .branding{
967 float: left;
966 float: left;
968 padding: 9px 2px;
967 padding: 9px 2px;
969 line-height: 1em;
968 line-height: 1em;
970 font-size: @navigation-fontsize;
969 font-size: @navigation-fontsize;
971 }
970 }
972
971
973 img {
972 img {
974 border: none;
973 border: none;
975 outline: none;
974 outline: none;
976 }
975 }
977 user-profile-header
976 user-profile-header
978 label {
977 label {
979
978
980 input[type="checkbox"] {
979 input[type="checkbox"] {
981 margin-right: 1em;
980 margin-right: 1em;
982 }
981 }
983 input[type="radio"] {
982 input[type="radio"] {
984 margin-right: 1em;
983 margin-right: 1em;
985 }
984 }
986 }
985 }
987
986
988 .flag_status {
987 .flag_status {
989 margin: 2px 8px 6px 2px;
988 margin: 2px 8px 6px 2px;
990 &.under_review {
989 &.under_review {
991 .circle(5px, @alert3);
990 .circle(5px, @alert3);
992 }
991 }
993 &.approved {
992 &.approved {
994 .circle(5px, @alert1);
993 .circle(5px, @alert1);
995 }
994 }
996 &.rejected,
995 &.rejected,
997 &.forced_closed{
996 &.forced_closed{
998 .circle(5px, @alert2);
997 .circle(5px, @alert2);
999 }
998 }
1000 &.not_reviewed {
999 &.not_reviewed {
1001 .circle(5px, @grey5);
1000 .circle(5px, @grey5);
1002 }
1001 }
1003 }
1002 }
1004
1003
1005 .flag_status_comment_box {
1004 .flag_status_comment_box {
1006 margin: 5px 6px 0px 2px;
1005 margin: 5px 6px 0px 2px;
1007 }
1006 }
1008 .test_pattern_preview {
1007 .test_pattern_preview {
1009 margin: @space 0;
1008 margin: @space 0;
1010
1009
1011 p {
1010 p {
1012 margin-bottom: 0;
1011 margin-bottom: 0;
1013 border-bottom: @border-thickness solid @border-default-color;
1012 border-bottom: @border-thickness solid @border-default-color;
1014 color: @grey3;
1013 color: @grey3;
1015 }
1014 }
1016
1015
1017 .btn {
1016 .btn {
1018 margin-bottom: @padding;
1017 margin-bottom: @padding;
1019 }
1018 }
1020 }
1019 }
1021 #test_pattern_result {
1020 #test_pattern_result {
1022 display: none;
1021 display: none;
1023 &:extend(pre);
1022 &:extend(pre);
1024 padding: .9em;
1023 padding: .9em;
1025 color: @grey3;
1024 color: @grey3;
1026 background-color: @grey7;
1025 background-color: @grey7;
1027 border-right: @border-thickness solid @border-default-color;
1026 border-right: @border-thickness solid @border-default-color;
1028 border-bottom: @border-thickness solid @border-default-color;
1027 border-bottom: @border-thickness solid @border-default-color;
1029 border-left: @border-thickness solid @border-default-color;
1028 border-left: @border-thickness solid @border-default-color;
1030 }
1029 }
1031
1030
1032 #repo_vcs_settings {
1031 #repo_vcs_settings {
1033 #inherit_overlay_vcs_default {
1032 #inherit_overlay_vcs_default {
1034 display: none;
1033 display: none;
1035 }
1034 }
1036 #inherit_overlay_vcs_custom {
1035 #inherit_overlay_vcs_custom {
1037 display: custom;
1036 display: custom;
1038 }
1037 }
1039 &.inherited {
1038 &.inherited {
1040 #inherit_overlay_vcs_default {
1039 #inherit_overlay_vcs_default {
1041 display: block;
1040 display: block;
1042 }
1041 }
1043 #inherit_overlay_vcs_custom {
1042 #inherit_overlay_vcs_custom {
1044 display: none;
1043 display: none;
1045 }
1044 }
1046 }
1045 }
1047 }
1046 }
1048
1047
1049 .issue-tracker-link {
1048 .issue-tracker-link {
1050 color: @rcblue;
1049 color: @rcblue;
1051 }
1050 }
1052
1051
1053 // Issue Tracker Table Show/Hide
1052 // Issue Tracker Table Show/Hide
1054 #repo_issue_tracker {
1053 #repo_issue_tracker {
1055 #inherit_overlay {
1054 #inherit_overlay {
1056 display: none;
1055 display: none;
1057 }
1056 }
1058 #custom_overlay {
1057 #custom_overlay {
1059 display: custom;
1058 display: custom;
1060 }
1059 }
1061 &.inherited {
1060 &.inherited {
1062 #inherit_overlay {
1061 #inherit_overlay {
1063 display: block;
1062 display: block;
1064 }
1063 }
1065 #custom_overlay {
1064 #custom_overlay {
1066 display: none;
1065 display: none;
1067 }
1066 }
1068 }
1067 }
1069 }
1068 }
1070 table.issuetracker {
1069 table.issuetracker {
1071 &.readonly {
1070 &.readonly {
1072 tr, td {
1071 tr, td {
1073 color: @grey3;
1072 color: @grey3;
1074 }
1073 }
1075 }
1074 }
1076 .edit {
1075 .edit {
1077 display: none;
1076 display: none;
1078 }
1077 }
1079 .editopen {
1078 .editopen {
1080 .edit {
1079 .edit {
1081 display: inline;
1080 display: inline;
1082 }
1081 }
1083 .entry {
1082 .entry {
1084 display: none;
1083 display: none;
1085 }
1084 }
1086 }
1085 }
1087 tr td.td-action {
1086 tr td.td-action {
1088 min-width: 117px;
1087 min-width: 117px;
1089 }
1088 }
1090 td input {
1089 td input {
1091 max-width: none;
1090 max-width: none;
1092 min-width: 30px;
1091 min-width: 30px;
1093 width: 80%;
1092 width: 80%;
1094 }
1093 }
1095 .issuetracker_pref input {
1094 .issuetracker_pref input {
1096 width: 40%;
1095 width: 40%;
1097 }
1096 }
1098 input.edit_issuetracker_update {
1097 input.edit_issuetracker_update {
1099 margin-right: 0;
1098 margin-right: 0;
1100 width: auto;
1099 width: auto;
1101 }
1100 }
1102 }
1101 }
1103
1102
1104
1103
1105 //Permissions Settings
1104 //Permissions Settings
1106 #add_perm {
1105 #add_perm {
1107 margin: 0 0 @padding;
1106 margin: 0 0 @padding;
1108 cursor: pointer;
1107 cursor: pointer;
1109 }
1108 }
1110
1109
1111 .perm_ac {
1110 .perm_ac {
1112 input {
1111 input {
1113 width: 95%;
1112 width: 95%;
1114 }
1113 }
1115 }
1114 }
1116
1115
1117 .autocomplete-suggestions {
1116 .autocomplete-suggestions {
1118 width: auto !important; // overrides autocomplete.js
1117 width: auto !important; // overrides autocomplete.js
1119 margin: 0;
1118 margin: 0;
1120 border: @border-thickness solid @rcblue;
1119 border: @border-thickness solid @rcblue;
1121 border-radius: @border-radius;
1120 border-radius: @border-radius;
1122 color: @rcblue;
1121 color: @rcblue;
1123 background-color: white;
1122 background-color: white;
1124 }
1123 }
1125 .autocomplete-selected {
1124 .autocomplete-selected {
1126 background: #F0F0F0;
1125 background: #F0F0F0;
1127 }
1126 }
1128 .ac-container-wrap {
1127 .ac-container-wrap {
1129 margin: 0;
1128 margin: 0;
1130 padding: 8px;
1129 padding: 8px;
1131 border-bottom: @border-thickness solid @rclightblue;
1130 border-bottom: @border-thickness solid @rclightblue;
1132 list-style-type: none;
1131 list-style-type: none;
1133 cursor: pointer;
1132 cursor: pointer;
1134
1133
1135 &:hover {
1134 &:hover {
1136 background-color: @rclightblue;
1135 background-color: @rclightblue;
1137 }
1136 }
1138
1137
1139 img {
1138 img {
1140 margin-right: 1em;
1139 margin-right: 1em;
1141 }
1140 }
1142
1141
1143 strong {
1142 strong {
1144 font-weight: normal;
1143 font-weight: normal;
1145 }
1144 }
1146 }
1145 }
1147
1146
1148 // Settings Dropdown
1147 // Settings Dropdown
1149 .user-menu .container {
1148 .user-menu .container {
1150 padding: 0 4px;
1149 padding: 0 4px;
1151 margin: 0;
1150 margin: 0;
1152 }
1151 }
1153
1152
1154 .user-menu .gravatar {
1153 .user-menu .gravatar {
1155 cursor: pointer;
1154 cursor: pointer;
1156 }
1155 }
1157
1156
1158 .codeblock {
1157 .codeblock {
1159 margin-bottom: @padding;
1158 margin-bottom: @padding;
1160 clear: both;
1159 clear: both;
1161
1160
1162 .stats{
1161 .stats{
1163 overflow: hidden;
1162 overflow: hidden;
1164 }
1163 }
1165
1164
1166 .message{
1165 .message{
1167 textarea{
1166 textarea{
1168 margin: 0;
1167 margin: 0;
1169 }
1168 }
1170 }
1169 }
1171
1170
1172 .code-header {
1171 .code-header {
1173 .stats {
1172 .stats {
1174 line-height: 2em;
1173 line-height: 2em;
1175
1174
1176 .revision_id {
1175 .revision_id {
1177 margin-left: 0;
1176 margin-left: 0;
1178 }
1177 }
1179 .buttons {
1178 .buttons {
1180 padding-right: 0;
1179 padding-right: 0;
1181 }
1180 }
1182 }
1181 }
1183
1182
1184 .item{
1183 .item{
1185 margin-right: 0.5em;
1184 margin-right: 0.5em;
1186 }
1185 }
1187 }
1186 }
1188
1187
1189 #editor_container{
1188 #editor_container{
1190 position: relative;
1189 position: relative;
1191 margin: @padding;
1190 margin: @padding;
1192 }
1191 }
1193 }
1192 }
1194
1193
1195 #file_history_container {
1194 #file_history_container {
1196 display: none;
1195 display: none;
1197 }
1196 }
1198
1197
1199 .file-history-inner {
1198 .file-history-inner {
1200 margin-bottom: 10px;
1199 margin-bottom: 10px;
1201 }
1200 }
1202
1201
1203 // Pull Requests
1202 // Pull Requests
1204 .summary-details {
1203 .summary-details {
1205 width: 72%;
1204 width: 72%;
1206 }
1205 }
1207 .pr-summary {
1206 .pr-summary {
1208 border-bottom: @border-thickness solid @grey5;
1207 border-bottom: @border-thickness solid @grey5;
1209 margin-bottom: @space;
1208 margin-bottom: @space;
1210 }
1209 }
1211 .reviewers-title {
1210 .reviewers-title {
1212 width: 25%;
1211 width: 25%;
1213 min-width: 200px;
1212 min-width: 200px;
1214 }
1213 }
1215 .reviewers {
1214 .reviewers {
1216 width: 25%;
1215 width: 25%;
1217 min-width: 200px;
1216 min-width: 200px;
1218 }
1217 }
1219 .reviewers ul li {
1218 .reviewers ul li {
1220 position: relative;
1219 position: relative;
1221 width: 100%;
1220 width: 100%;
1222 margin-bottom: 8px;
1221 margin-bottom: 8px;
1223 }
1222 }
1224 .reviewers_member {
1223 .reviewers_member {
1225 width: 100%;
1224 width: 100%;
1226 overflow: auto;
1225 overflow: auto;
1227 }
1226 }
1228 .reviewer_status {
1227 .reviewer_status {
1229 display: inline-block;
1228 display: inline-block;
1230 vertical-align: top;
1229 vertical-align: top;
1231 width: 7%;
1230 width: 7%;
1232 min-width: 20px;
1231 min-width: 20px;
1233 height: 1.2em;
1232 height: 1.2em;
1234 margin-top: 3px;
1233 margin-top: 3px;
1235 line-height: 1em;
1234 line-height: 1em;
1236 }
1235 }
1237
1236
1238 .reviewer_name {
1237 .reviewer_name {
1239 display: inline-block;
1238 display: inline-block;
1240 max-width: 83%;
1239 max-width: 83%;
1241 padding-right: 20px;
1240 padding-right: 20px;
1242 vertical-align: middle;
1241 vertical-align: middle;
1243 line-height: 1;
1242 line-height: 1;
1244
1243
1245 .rc-user {
1244 .rc-user {
1246 min-width: 0;
1245 min-width: 0;
1247 margin: -2px 1em 0 0;
1246 margin: -2px 1em 0 0;
1248 }
1247 }
1249
1248
1250 .reviewer {
1249 .reviewer {
1251 float: left;
1250 float: left;
1252 }
1251 }
1253
1252
1254 &.to-delete {
1253 &.to-delete {
1255 .user,
1254 .user,
1256 .reviewer {
1255 .reviewer {
1257 text-decoration: line-through;
1256 text-decoration: line-through;
1258 }
1257 }
1259 }
1258 }
1260 }
1259 }
1261
1260
1262 .reviewer_member_remove {
1261 .reviewer_member_remove {
1263 position: absolute;
1262 position: absolute;
1264 right: 0;
1263 right: 0;
1265 top: 0;
1264 top: 0;
1266 width: 16px;
1265 width: 16px;
1267 margin-bottom: 10px;
1266 margin-bottom: 10px;
1268 padding: 0;
1267 padding: 0;
1269 color: black;
1268 color: black;
1270 }
1269 }
1271 .reviewer_member_status {
1270 .reviewer_member_status {
1272 margin-top: 5px;
1271 margin-top: 5px;
1273 }
1272 }
1274 .pr-summary #summary{
1273 .pr-summary #summary{
1275 width: 100%;
1274 width: 100%;
1276 }
1275 }
1277 .pr-summary .action_button:hover {
1276 .pr-summary .action_button:hover {
1278 border: 0;
1277 border: 0;
1279 cursor: pointer;
1278 cursor: pointer;
1280 }
1279 }
1281 .pr-details-title {
1280 .pr-details-title {
1282 padding-bottom: 8px;
1281 padding-bottom: 8px;
1283 border-bottom: @border-thickness solid @grey5;
1282 border-bottom: @border-thickness solid @grey5;
1284 .action_button {
1283 .action_button {
1285 color: @rcblue;
1284 color: @rcblue;
1286 }
1285 }
1287 }
1286 }
1288 .pr-details-content {
1287 .pr-details-content {
1289 margin-top: @textmargin;
1288 margin-top: @textmargin;
1290 margin-bottom: @textmargin;
1289 margin-bottom: @textmargin;
1291 }
1290 }
1292 .pr-description {
1291 .pr-description {
1293 white-space:pre-wrap;
1292 white-space:pre-wrap;
1294 }
1293 }
1295 .group_members {
1294 .group_members {
1296 margin-top: 0;
1295 margin-top: 0;
1297 padding: 0;
1296 padding: 0;
1298 list-style: outside none none;
1297 list-style: outside none none;
1299 }
1298 }
1300 .reviewer_ac .ac-input {
1299 .reviewer_ac .ac-input {
1301 width: 92%;
1300 width: 92%;
1302 margin-bottom: 1em;
1301 margin-bottom: 1em;
1303 }
1302 }
1304 #update_commits {
1303 #update_commits {
1305 float: right;
1304 float: right;
1306 }
1305 }
1307 .compare_view_commits tr{
1306 .compare_view_commits tr{
1308 height: 20px;
1307 height: 20px;
1309 }
1308 }
1310 .compare_view_commits td {
1309 .compare_view_commits td {
1311 vertical-align: top;
1310 vertical-align: top;
1312 padding-top: 10px;
1311 padding-top: 10px;
1313 }
1312 }
1314 .compare_view_commits .author {
1313 .compare_view_commits .author {
1315 margin-left: 5px;
1314 margin-left: 5px;
1316 }
1315 }
1317
1316
1318 .compare_view_files {
1317 .compare_view_files {
1319 width: 100%;
1318 width: 100%;
1320
1319
1321 td {
1320 td {
1322 vertical-align: middle;
1321 vertical-align: middle;
1323 }
1322 }
1324 }
1323 }
1325
1324
1326 .compare_view_filepath {
1325 .compare_view_filepath {
1327 color: @grey1;
1326 color: @grey1;
1328 }
1327 }
1329
1328
1330 .show_more {
1329 .show_more {
1331 display: inline-block;
1330 display: inline-block;
1332 position: relative;
1331 position: relative;
1333 vertical-align: middle;
1332 vertical-align: middle;
1334 width: 4px;
1333 width: 4px;
1335 height: @basefontsize;
1334 height: @basefontsize;
1336
1335
1337 &:after {
1336 &:after {
1338 content: "\00A0\25BE";
1337 content: "\00A0\25BE";
1339 display: inline-block;
1338 display: inline-block;
1340 width:10px;
1339 width:10px;
1341 line-height: 5px;
1340 line-height: 5px;
1342 font-size: 12px;
1341 font-size: 12px;
1343 cursor: pointer;
1342 cursor: pointer;
1344 }
1343 }
1345 }
1344 }
1346
1345
1347 .journal_more .show_more {
1346 .journal_more .show_more {
1348 display: inline;
1347 display: inline;
1349
1348
1350 &:after {
1349 &:after {
1351 content: none;
1350 content: none;
1352 }
1351 }
1353 }
1352 }
1354
1353
1355 .open .show_more:after,
1354 .open .show_more:after,
1356 .select2-dropdown-open .show_more:after {
1355 .select2-dropdown-open .show_more:after {
1357 .rotate(180deg);
1356 .rotate(180deg);
1358 margin-left: 4px;
1357 margin-left: 4px;
1359 }
1358 }
1360
1359
1361
1360
1362 .compare_view_commits .collapse_commit:after {
1361 .compare_view_commits .collapse_commit:after {
1363 cursor: pointer;
1362 cursor: pointer;
1364 content: "\00A0\25B4";
1363 content: "\00A0\25B4";
1365 margin-left: -3px;
1364 margin-left: -3px;
1366 font-size: 17px;
1365 font-size: 17px;
1367 color: @grey4;
1366 color: @grey4;
1368 }
1367 }
1369
1368
1370 .diff_links {
1369 .diff_links {
1371 margin-left: 8px;
1370 margin-left: 8px;
1372 }
1371 }
1373
1372
1374 p.ancestor {
1373 p.ancestor {
1375 margin: @padding 0;
1374 margin: @padding 0;
1376 }
1375 }
1377
1376
1378 .cs_icon_td input[type="checkbox"] {
1377 .cs_icon_td input[type="checkbox"] {
1379 display: none;
1378 display: none;
1380 }
1379 }
1381
1380
1382 .cs_icon_td .expand_file_icon:after {
1381 .cs_icon_td .expand_file_icon:after {
1383 cursor: pointer;
1382 cursor: pointer;
1384 content: "\00A0\25B6";
1383 content: "\00A0\25B6";
1385 font-size: 12px;
1384 font-size: 12px;
1386 color: @grey4;
1385 color: @grey4;
1387 }
1386 }
1388
1387
1389 .cs_icon_td .collapse_file_icon:after {
1388 .cs_icon_td .collapse_file_icon:after {
1390 cursor: pointer;
1389 cursor: pointer;
1391 content: "\00A0\25BC";
1390 content: "\00A0\25BC";
1392 font-size: 12px;
1391 font-size: 12px;
1393 color: @grey4;
1392 color: @grey4;
1394 }
1393 }
1395
1394
1396 /*new binary
1395 /*new binary
1397 NEW_FILENODE = 1
1396 NEW_FILENODE = 1
1398 DEL_FILENODE = 2
1397 DEL_FILENODE = 2
1399 MOD_FILENODE = 3
1398 MOD_FILENODE = 3
1400 RENAMED_FILENODE = 4
1399 RENAMED_FILENODE = 4
1401 COPIED_FILENODE = 5
1400 COPIED_FILENODE = 5
1402 CHMOD_FILENODE = 6
1401 CHMOD_FILENODE = 6
1403 BIN_FILENODE = 7
1402 BIN_FILENODE = 7
1404 */
1403 */
1405 .cs_files_expand {
1404 .cs_files_expand {
1406 font-size: @basefontsize + 5px;
1405 font-size: @basefontsize + 5px;
1407 line-height: 1.8em;
1406 line-height: 1.8em;
1408 float: right;
1407 float: right;
1409 }
1408 }
1410
1409
1411 .cs_files_expand span{
1410 .cs_files_expand span{
1412 color: @rcblue;
1411 color: @rcblue;
1413 cursor: pointer;
1412 cursor: pointer;
1414 }
1413 }
1415 .cs_files {
1414 .cs_files {
1416 clear: both;
1415 clear: both;
1417 padding-bottom: @padding;
1416 padding-bottom: @padding;
1418
1417
1419 .cur_cs {
1418 .cur_cs {
1420 margin: 10px 2px;
1419 margin: 10px 2px;
1421 font-weight: bold;
1420 font-weight: bold;
1422 }
1421 }
1423
1422
1424 .node {
1423 .node {
1425 float: left;
1424 float: left;
1426 }
1425 }
1427
1426
1428 .changes {
1427 .changes {
1429 float: right;
1428 float: right;
1430 color: white;
1429 color: white;
1431 font-size: @basefontsize - 4px;
1430 font-size: @basefontsize - 4px;
1432 margin-top: 4px;
1431 margin-top: 4px;
1433 opacity: 0.6;
1432 opacity: 0.6;
1434 filter: Alpha(opacity=60); /* IE8 and earlier */
1433 filter: Alpha(opacity=60); /* IE8 and earlier */
1435
1434
1436 .added {
1435 .added {
1437 background-color: @alert1;
1436 background-color: @alert1;
1438 float: left;
1437 float: left;
1439 text-align: center;
1438 text-align: center;
1440 }
1439 }
1441
1440
1442 .deleted {
1441 .deleted {
1443 background-color: @alert2;
1442 background-color: @alert2;
1444 float: left;
1443 float: left;
1445 text-align: center;
1444 text-align: center;
1446 }
1445 }
1447
1446
1448 .bin {
1447 .bin {
1449 background-color: @alert1;
1448 background-color: @alert1;
1450 text-align: center;
1449 text-align: center;
1451 }
1450 }
1452
1451
1453 /*new binary*/
1452 /*new binary*/
1454 .bin.bin1 {
1453 .bin.bin1 {
1455 background-color: @alert1;
1454 background-color: @alert1;
1456 text-align: center;
1455 text-align: center;
1457 }
1456 }
1458
1457
1459 /*deleted binary*/
1458 /*deleted binary*/
1460 .bin.bin2 {
1459 .bin.bin2 {
1461 background-color: @alert2;
1460 background-color: @alert2;
1462 text-align: center;
1461 text-align: center;
1463 }
1462 }
1464
1463
1465 /*mod binary*/
1464 /*mod binary*/
1466 .bin.bin3 {
1465 .bin.bin3 {
1467 background-color: @grey2;
1466 background-color: @grey2;
1468 text-align: center;
1467 text-align: center;
1469 }
1468 }
1470
1469
1471 /*rename file*/
1470 /*rename file*/
1472 .bin.bin4 {
1471 .bin.bin4 {
1473 background-color: @alert4;
1472 background-color: @alert4;
1474 text-align: center;
1473 text-align: center;
1475 }
1474 }
1476
1475
1477 /*copied file*/
1476 /*copied file*/
1478 .bin.bin5 {
1477 .bin.bin5 {
1479 background-color: @alert4;
1478 background-color: @alert4;
1480 text-align: center;
1479 text-align: center;
1481 }
1480 }
1482
1481
1483 /*chmod file*/
1482 /*chmod file*/
1484 .bin.bin6 {
1483 .bin.bin6 {
1485 background-color: @grey2;
1484 background-color: @grey2;
1486 text-align: center;
1485 text-align: center;
1487 }
1486 }
1488 }
1487 }
1489 }
1488 }
1490
1489
1491 .cs_files .cs_added, .cs_files .cs_A,
1490 .cs_files .cs_added, .cs_files .cs_A,
1492 .cs_files .cs_added, .cs_files .cs_M,
1491 .cs_files .cs_added, .cs_files .cs_M,
1493 .cs_files .cs_added, .cs_files .cs_D {
1492 .cs_files .cs_added, .cs_files .cs_D {
1494 height: 16px;
1493 height: 16px;
1495 padding-right: 10px;
1494 padding-right: 10px;
1496 margin-top: 7px;
1495 margin-top: 7px;
1497 text-align: left;
1496 text-align: left;
1498 }
1497 }
1499
1498
1500 .cs_icon_td {
1499 .cs_icon_td {
1501 min-width: 16px;
1500 min-width: 16px;
1502 width: 16px;
1501 width: 16px;
1503 }
1502 }
1504
1503
1505 .pull-request-merge {
1504 .pull-request-merge {
1506 padding: 10px 0;
1505 padding: 10px 0;
1507 margin-top: 10px;
1506 margin-top: 10px;
1508 margin-bottom: 20px;
1507 margin-bottom: 20px;
1509 }
1508 }
1510
1509
1511 .pull-request-merge .pull-request-wrap {
1510 .pull-request-merge .pull-request-wrap {
1512 height: 25px;
1511 height: 25px;
1513 padding: 5px 0;
1512 padding: 5px 0;
1514 }
1513 }
1515
1514
1516 .pull-request-merge span {
1515 .pull-request-merge span {
1517 margin-right: 10px;
1516 margin-right: 10px;
1518 }
1517 }
1519 #close_pull_request {
1518 #close_pull_request {
1520 margin-right: 0px;
1519 margin-right: 0px;
1521 }
1520 }
1522
1521
1523 .empty_data {
1522 .empty_data {
1524 color: @grey4;
1523 color: @grey4;
1525 }
1524 }
1526
1525
1527 #changeset_compare_view_content {
1526 #changeset_compare_view_content {
1528 margin-bottom: @space;
1527 margin-bottom: @space;
1529 clear: both;
1528 clear: both;
1530 width: 100%;
1529 width: 100%;
1531 box-sizing: border-box;
1530 box-sizing: border-box;
1532 .border-radius(@border-radius);
1531 .border-radius(@border-radius);
1533
1532
1534 .help-block {
1533 .help-block {
1535 margin: @padding 0;
1534 margin: @padding 0;
1536 color: @text-color;
1535 color: @text-color;
1537 }
1536 }
1538
1537
1539 .empty_data {
1538 .empty_data {
1540 margin: @padding 0;
1539 margin: @padding 0;
1541 }
1540 }
1542
1541
1543 .alert {
1542 .alert {
1544 margin-bottom: @space;
1543 margin-bottom: @space;
1545 }
1544 }
1546 }
1545 }
1547
1546
1548 .table_disp {
1547 .table_disp {
1549 .status {
1548 .status {
1550 width: auto;
1549 width: auto;
1551
1550
1552 .flag_status {
1551 .flag_status {
1553 float: left;
1552 float: left;
1554 }
1553 }
1555 }
1554 }
1556 }
1555 }
1557
1556
1558 .status_box_menu {
1557 .status_box_menu {
1559 margin: 0;
1558 margin: 0;
1560 }
1559 }
1561
1560
1562 .notification-table{
1561 .notification-table{
1563 margin-bottom: @space;
1562 margin-bottom: @space;
1564 display: table;
1563 display: table;
1565 width: 100%;
1564 width: 100%;
1566
1565
1567 .container{
1566 .container{
1568 display: table-row;
1567 display: table-row;
1569
1568
1570 .notification-header{
1569 .notification-header{
1571 border-bottom: @border-thickness solid @border-default-color;
1570 border-bottom: @border-thickness solid @border-default-color;
1572 }
1571 }
1573
1572
1574 .notification-subject{
1573 .notification-subject{
1575 display: table-cell;
1574 display: table-cell;
1576 }
1575 }
1577 }
1576 }
1578 }
1577 }
1579
1578
1580 // Notifications
1579 // Notifications
1581 .notification-header{
1580 .notification-header{
1582 display: table;
1581 display: table;
1583 width: 100%;
1582 width: 100%;
1584 padding: floor(@basefontsize/2) 0;
1583 padding: floor(@basefontsize/2) 0;
1585 line-height: 1em;
1584 line-height: 1em;
1586
1585
1587 .desc, .delete-notifications, .read-notifications{
1586 .desc, .delete-notifications, .read-notifications{
1588 display: table-cell;
1587 display: table-cell;
1589 text-align: left;
1588 text-align: left;
1590 }
1589 }
1591
1590
1592 .desc{
1591 .desc{
1593 width: 1163px;
1592 width: 1163px;
1594 }
1593 }
1595
1594
1596 .delete-notifications, .read-notifications{
1595 .delete-notifications, .read-notifications{
1597 width: 35px;
1596 width: 35px;
1598 min-width: 35px; //fixes when only one button is displayed
1597 min-width: 35px; //fixes when only one button is displayed
1599 }
1598 }
1600 }
1599 }
1601
1600
1602 .notification-body {
1601 .notification-body {
1603 .markdown-block,
1602 .markdown-block,
1604 .rst-block {
1603 .rst-block {
1605 padding: @padding 0;
1604 padding: @padding 0;
1606 }
1605 }
1607
1606
1608 .notification-subject {
1607 .notification-subject {
1609 padding: @textmargin 0;
1608 padding: @textmargin 0;
1610 border-bottom: @border-thickness solid @border-default-color;
1609 border-bottom: @border-thickness solid @border-default-color;
1611 }
1610 }
1612 }
1611 }
1613
1612
1614
1613
1615 .notifications_buttons{
1614 .notifications_buttons{
1616 float: right;
1615 float: right;
1617 }
1616 }
1618
1617
1619 #notification-status{
1618 #notification-status{
1620 display: inline;
1619 display: inline;
1621 }
1620 }
1622
1621
1623 // Repositories
1622 // Repositories
1624
1623
1625 #summary.fields{
1624 #summary.fields{
1626 display: table;
1625 display: table;
1627
1626
1628 .field{
1627 .field{
1629 display: table-row;
1628 display: table-row;
1630
1629
1631 .label-summary{
1630 .label-summary{
1632 display: table-cell;
1631 display: table-cell;
1633 min-width: @label-summary-minwidth;
1632 min-width: @label-summary-minwidth;
1634 padding-top: @padding/2;
1633 padding-top: @padding/2;
1635 padding-bottom: @padding/2;
1634 padding-bottom: @padding/2;
1636 padding-right: @padding/2;
1635 padding-right: @padding/2;
1637 }
1636 }
1638
1637
1639 .input{
1638 .input{
1640 display: table-cell;
1639 display: table-cell;
1641 padding: @padding/2;
1640 padding: @padding/2;
1642
1641
1643 input{
1642 input{
1644 min-width: 29em;
1643 min-width: 29em;
1645 padding: @padding/4;
1644 padding: @padding/4;
1646 }
1645 }
1647 }
1646 }
1648 .statistics, .downloads{
1647 .statistics, .downloads{
1649 .disabled{
1648 .disabled{
1650 color: @grey4;
1649 color: @grey4;
1651 }
1650 }
1652 }
1651 }
1653 }
1652 }
1654 }
1653 }
1655
1654
1656 #summary{
1655 #summary{
1657 width: 70%;
1656 width: 70%;
1658 }
1657 }
1659
1658
1660
1659
1661 // Journal
1660 // Journal
1662 .journal.title {
1661 .journal.title {
1663 h5 {
1662 h5 {
1664 float: left;
1663 float: left;
1665 margin: 0;
1664 margin: 0;
1666 width: 70%;
1665 width: 70%;
1667 }
1666 }
1668
1667
1669 ul {
1668 ul {
1670 float: right;
1669 float: right;
1671 display: inline-block;
1670 display: inline-block;
1672 margin: 0;
1671 margin: 0;
1673 width: 30%;
1672 width: 30%;
1674 text-align: right;
1673 text-align: right;
1675
1674
1676 li {
1675 li {
1677 display: inline;
1676 display: inline;
1678 font-size: @journal-fontsize;
1677 font-size: @journal-fontsize;
1679 line-height: 1em;
1678 line-height: 1em;
1680
1679
1681 &:before { content: none; }
1680 &:before { content: none; }
1682 }
1681 }
1683 }
1682 }
1684 }
1683 }
1685
1684
1686 .filterexample {
1685 .filterexample {
1687 position: absolute;
1686 position: absolute;
1688 top: 95px;
1687 top: 95px;
1689 left: @contentpadding;
1688 left: @contentpadding;
1690 color: @rcblue;
1689 color: @rcblue;
1691 font-size: 11px;
1690 font-size: 11px;
1692 font-family: @text-regular;
1691 font-family: @text-regular;
1693 cursor: help;
1692 cursor: help;
1694
1693
1695 &:hover {
1694 &:hover {
1696 color: @rcdarkblue;
1695 color: @rcdarkblue;
1697 }
1696 }
1698
1697
1699 @media (max-width:768px) {
1698 @media (max-width:768px) {
1700 position: relative;
1699 position: relative;
1701 top: auto;
1700 top: auto;
1702 left: auto;
1701 left: auto;
1703 display: block;
1702 display: block;
1704 }
1703 }
1705 }
1704 }
1706
1705
1707
1706
1708 #journal{
1707 #journal{
1709 margin-bottom: @space;
1708 margin-bottom: @space;
1710
1709
1711 .journal_day{
1710 .journal_day{
1712 margin-bottom: @textmargin/2;
1711 margin-bottom: @textmargin/2;
1713 padding-bottom: @textmargin/2;
1712 padding-bottom: @textmargin/2;
1714 font-size: @journal-fontsize;
1713 font-size: @journal-fontsize;
1715 border-bottom: @border-thickness solid @border-default-color;
1714 border-bottom: @border-thickness solid @border-default-color;
1716 }
1715 }
1717
1716
1718 .journal_container{
1717 .journal_container{
1719 margin-bottom: @space;
1718 margin-bottom: @space;
1720
1719
1721 .journal_user{
1720 .journal_user{
1722 display: inline-block;
1721 display: inline-block;
1723 }
1722 }
1724 .journal_action_container{
1723 .journal_action_container{
1725 display: block;
1724 display: block;
1726 margin-top: @textmargin;
1725 margin-top: @textmargin;
1727
1726
1728 div{
1727 div{
1729 display: inline;
1728 display: inline;
1730 }
1729 }
1731
1730
1732 div.journal_action_params{
1731 div.journal_action_params{
1733 display: block;
1732 display: block;
1734 }
1733 }
1735
1734
1736 div.journal_repo:after{
1735 div.journal_repo:after{
1737 content: "\A";
1736 content: "\A";
1738 white-space: pre;
1737 white-space: pre;
1739 }
1738 }
1740
1739
1741 div.date{
1740 div.date{
1742 display: block;
1741 display: block;
1743 margin-bottom: @textmargin;
1742 margin-bottom: @textmargin;
1744 }
1743 }
1745 }
1744 }
1746 }
1745 }
1747 }
1746 }
1748
1747
1749 // Files
1748 // Files
1750 .edit-file-title {
1749 .edit-file-title {
1751 border-bottom: @border-thickness solid @border-default-color;
1750 border-bottom: @border-thickness solid @border-default-color;
1752
1751
1753 .breadcrumbs {
1752 .breadcrumbs {
1754 margin-bottom: 0;
1753 margin-bottom: 0;
1755 }
1754 }
1756 }
1755 }
1757
1756
1758 .edit-file-fieldset {
1757 .edit-file-fieldset {
1759 margin-top: @sidebarpadding;
1758 margin-top: @sidebarpadding;
1760
1759
1761 .fieldset {
1760 .fieldset {
1762 .left-label {
1761 .left-label {
1763 width: 13%;
1762 width: 13%;
1764 }
1763 }
1765 .right-content {
1764 .right-content {
1766 width: 87%;
1765 width: 87%;
1767 max-width: 100%;
1766 max-width: 100%;
1768 }
1767 }
1769 .filename-label {
1768 .filename-label {
1770 margin-top: 13px;
1769 margin-top: 13px;
1771 }
1770 }
1772 .commit-message-label {
1771 .commit-message-label {
1773 margin-top: 4px;
1772 margin-top: 4px;
1774 }
1773 }
1775 .file-upload-input {
1774 .file-upload-input {
1776 input {
1775 input {
1777 display: none;
1776 display: none;
1778 }
1777 }
1779 }
1778 }
1780 p {
1779 p {
1781 margin-top: 5px;
1780 margin-top: 5px;
1782 }
1781 }
1783
1782
1784 }
1783 }
1785 .custom-path-link {
1784 .custom-path-link {
1786 margin-left: 5px;
1785 margin-left: 5px;
1787 }
1786 }
1788 #commit {
1787 #commit {
1789 resize: vertical;
1788 resize: vertical;
1790 }
1789 }
1791 }
1790 }
1792
1791
1793 .delete-file-preview {
1792 .delete-file-preview {
1794 max-height: 250px;
1793 max-height: 250px;
1795 }
1794 }
1796
1795
1797 .new-file,
1796 .new-file,
1798 #filter_activate,
1797 #filter_activate,
1799 #filter_deactivate {
1798 #filter_deactivate {
1800 float: left;
1799 float: left;
1801 margin: 0 0 0 15px;
1800 margin: 0 0 0 15px;
1802 }
1801 }
1803
1802
1804 h3.files_location{
1803 h3.files_location{
1805 line-height: 2.4em;
1804 line-height: 2.4em;
1806 }
1805 }
1807
1806
1808 .browser-nav {
1807 .browser-nav {
1809 display: table;
1808 display: table;
1810 margin-bottom: @space;
1809 margin-bottom: @space;
1811
1810
1812
1811
1813 .info_box {
1812 .info_box {
1814 display: inline-table;
1813 display: inline-table;
1815 height: 2.5em;
1814 height: 2.5em;
1816
1815
1817 .browser-cur-rev, .info_box_elem {
1816 .browser-cur-rev, .info_box_elem {
1818 display: table-cell;
1817 display: table-cell;
1819 vertical-align: middle;
1818 vertical-align: middle;
1820 }
1819 }
1821
1820
1822 .info_box_elem {
1821 .info_box_elem {
1823 border-top: @border-thickness solid @rcblue;
1822 border-top: @border-thickness solid @rcblue;
1824 border-bottom: @border-thickness solid @rcblue;
1823 border-bottom: @border-thickness solid @rcblue;
1825
1824
1826 #at_rev, a {
1825 #at_rev, a {
1827 padding: 0.6em 0.9em;
1826 padding: 0.6em 0.9em;
1828 margin: 0;
1827 margin: 0;
1829 .box-shadow(none);
1828 .box-shadow(none);
1830 border: 0;
1829 border: 0;
1831 height: 12px;
1830 height: 12px;
1832 }
1831 }
1833
1832
1834 input#at_rev {
1833 input#at_rev {
1835 max-width: 50px;
1834 max-width: 50px;
1836 text-align: right;
1835 text-align: right;
1837 }
1836 }
1838
1837
1839 &.previous {
1838 &.previous {
1840 border: @border-thickness solid @rcblue;
1839 border: @border-thickness solid @rcblue;
1841 .disabled {
1840 .disabled {
1842 color: @grey4;
1841 color: @grey4;
1843 cursor: not-allowed;
1842 cursor: not-allowed;
1844 }
1843 }
1845 }
1844 }
1846
1845
1847 &.next {
1846 &.next {
1848 border: @border-thickness solid @rcblue;
1847 border: @border-thickness solid @rcblue;
1849 .disabled {
1848 .disabled {
1850 color: @grey4;
1849 color: @grey4;
1851 cursor: not-allowed;
1850 cursor: not-allowed;
1852 }
1851 }
1853 }
1852 }
1854 }
1853 }
1855
1854
1856 .browser-cur-rev {
1855 .browser-cur-rev {
1857
1856
1858 span{
1857 span{
1859 margin: 0;
1858 margin: 0;
1860 color: @rcblue;
1859 color: @rcblue;
1861 height: 12px;
1860 height: 12px;
1862 display: inline-block;
1861 display: inline-block;
1863 padding: 0.7em 1em ;
1862 padding: 0.7em 1em ;
1864 border: @border-thickness solid @rcblue;
1863 border: @border-thickness solid @rcblue;
1865 margin-right: @padding;
1864 margin-right: @padding;
1866 }
1865 }
1867 }
1866 }
1868 }
1867 }
1869
1868
1870 .search_activate {
1869 .search_activate {
1871 display: table-cell;
1870 display: table-cell;
1872 vertical-align: middle;
1871 vertical-align: middle;
1873
1872
1874 input, label{
1873 input, label{
1875 margin: 0;
1874 margin: 0;
1876 padding: 0;
1875 padding: 0;
1877 }
1876 }
1878
1877
1879 input{
1878 input{
1880 margin-left: @textmargin;
1879 margin-left: @textmargin;
1881 }
1880 }
1882
1881
1883 }
1882 }
1884 }
1883 }
1885
1884
1886 .browser-cur-rev{
1885 .browser-cur-rev{
1887 margin-bottom: @textmargin;
1886 margin-bottom: @textmargin;
1888 }
1887 }
1889
1888
1890 #node_filter_box_loading{
1889 #node_filter_box_loading{
1891 .info_text;
1890 .info_text;
1892 }
1891 }
1893
1892
1894 .browser-search {
1893 .browser-search {
1895 margin: -25px 0px 5px 0px;
1894 margin: -25px 0px 5px 0px;
1896 }
1895 }
1897
1896
1898 .node-filter {
1897 .node-filter {
1899 font-size: @repo-title-fontsize;
1898 font-size: @repo-title-fontsize;
1900 padding: 4px 0px 0px 0px;
1899 padding: 4px 0px 0px 0px;
1901
1900
1902 .node-filter-path {
1901 .node-filter-path {
1903 float: left;
1902 float: left;
1904 color: @grey4;
1903 color: @grey4;
1905 }
1904 }
1906 .node-filter-input {
1905 .node-filter-input {
1907 float: left;
1906 float: left;
1908 margin: -2px 0px 0px 2px;
1907 margin: -2px 0px 0px 2px;
1909 input {
1908 input {
1910 padding: 2px;
1909 padding: 2px;
1911 border: none;
1910 border: none;
1912 font-size: @repo-title-fontsize;
1911 font-size: @repo-title-fontsize;
1913 }
1912 }
1914 }
1913 }
1915 }
1914 }
1916
1915
1917
1916
1918 .browser-result{
1917 .browser-result{
1919 td a{
1918 td a{
1920 margin-left: 0.5em;
1919 margin-left: 0.5em;
1921 display: inline-block;
1920 display: inline-block;
1922
1921
1923 em{
1922 em{
1924 font-family: @text-bold;
1923 font-family: @text-bold;
1925 }
1924 }
1926 }
1925 }
1927 }
1926 }
1928
1927
1929 .browser-highlight{
1928 .browser-highlight{
1930 background-color: @grey5-alpha;
1929 background-color: @grey5-alpha;
1931 }
1930 }
1932
1931
1933
1932
1934 // Search
1933 // Search
1935
1934
1936 .search-form{
1935 .search-form{
1937 #q {
1936 #q {
1938 width: @search-form-width;
1937 width: @search-form-width;
1939 }
1938 }
1940 .fields{
1939 .fields{
1941 margin: 0 0 @space;
1940 margin: 0 0 @space;
1942 }
1941 }
1943
1942
1944 label{
1943 label{
1945 display: inline-block;
1944 display: inline-block;
1946 margin-right: @textmargin;
1945 margin-right: @textmargin;
1947 padding-top: 0.25em;
1946 padding-top: 0.25em;
1948 }
1947 }
1949
1948
1950
1949
1951 .results{
1950 .results{
1952 clear: both;
1951 clear: both;
1953 margin: 0 0 @padding;
1952 margin: 0 0 @padding;
1954 }
1953 }
1955 }
1954 }
1956
1955
1957 div.search-feedback-items {
1956 div.search-feedback-items {
1958 display: inline-block;
1957 display: inline-block;
1959 padding:0px 0px 0px 96px;
1958 padding:0px 0px 0px 96px;
1960 }
1959 }
1961
1960
1962 div.search-code-body {
1961 div.search-code-body {
1963 background-color: #ffffff; padding: 5px 0 5px 10px;
1962 background-color: #ffffff; padding: 5px 0 5px 10px;
1964 pre {
1963 pre {
1965 .match { background-color: #faffa6;}
1964 .match { background-color: #faffa6;}
1966 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
1965 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
1967 }
1966 }
1968 }
1967 }
1969
1968
1970 .expand_commit.search {
1969 .expand_commit.search {
1971 .show_more.open {
1970 .show_more.open {
1972 height: auto;
1971 height: auto;
1973 max-height: none;
1972 max-height: none;
1974 }
1973 }
1975 }
1974 }
1976
1975
1977 .search-results {
1976 .search-results {
1978
1977
1979 h2 {
1978 h2 {
1980 margin-bottom: 0;
1979 margin-bottom: 0;
1981 }
1980 }
1982 .codeblock {
1981 .codeblock {
1983 border: none;
1982 border: none;
1984 background: transparent;
1983 background: transparent;
1985 }
1984 }
1986
1985
1987 .codeblock-header {
1986 .codeblock-header {
1988 border: none;
1987 border: none;
1989 background: transparent;
1988 background: transparent;
1990 }
1989 }
1991
1990
1992 .code-body {
1991 .code-body {
1993 border: @border-thickness solid @border-default-color;
1992 border: @border-thickness solid @border-default-color;
1994 .border-radius(@border-radius);
1993 .border-radius(@border-radius);
1995 }
1994 }
1996
1995
1997 .td-commit {
1996 .td-commit {
1998 &:extend(pre);
1997 &:extend(pre);
1999 border-bottom: @border-thickness solid @border-default-color;
1998 border-bottom: @border-thickness solid @border-default-color;
2000 }
1999 }
2001
2000
2002 .message {
2001 .message {
2003 height: auto;
2002 height: auto;
2004 max-width: 350px;
2003 max-width: 350px;
2005 white-space: normal;
2004 white-space: normal;
2006 text-overflow: initial;
2005 text-overflow: initial;
2007 overflow: visible;
2006 overflow: visible;
2008
2007
2009 .match { background-color: #faffa6;}
2008 .match { background-color: #faffa6;}
2010 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2009 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2011 }
2010 }
2012
2011
2013 }
2012 }
2014
2013
2015 table.rctable td.td-search-results div {
2014 table.rctable td.td-search-results div {
2016 max-width: 100%;
2015 max-width: 100%;
2017 }
2016 }
2018
2017
2019 #tip-box, .tip-box{
2018 #tip-box, .tip-box{
2020 padding: @menupadding/2;
2019 padding: @menupadding/2;
2021 display: block;
2020 display: block;
2022 border: @border-thickness solid @border-highlight-color;
2021 border: @border-thickness solid @border-highlight-color;
2023 .border-radius(@border-radius);
2022 .border-radius(@border-radius);
2024 background-color: white;
2023 background-color: white;
2025 z-index: 99;
2024 z-index: 99;
2026 white-space: pre-wrap;
2025 white-space: pre-wrap;
2027 }
2026 }
2028
2027
2029 #linktt {
2028 #linktt {
2030 width: 79px;
2029 width: 79px;
2031 }
2030 }
2032
2031
2033 #help_kb .modal-content{
2032 #help_kb .modal-content{
2034 max-width: 750px;
2033 max-width: 750px;
2035 margin: 10% auto;
2034 margin: 10% auto;
2036
2035
2037 table{
2036 table{
2038 td,th{
2037 td,th{
2039 border-bottom: none;
2038 border-bottom: none;
2040 line-height: 2.5em;
2039 line-height: 2.5em;
2041 }
2040 }
2042 th{
2041 th{
2043 padding-bottom: @textmargin/2;
2042 padding-bottom: @textmargin/2;
2044 }
2043 }
2045 td.keys{
2044 td.keys{
2046 text-align: center;
2045 text-align: center;
2047 }
2046 }
2048 }
2047 }
2049
2048
2050 .block-left{
2049 .block-left{
2051 width: 45%;
2050 width: 45%;
2052 margin-right: 5%;
2051 margin-right: 5%;
2053 }
2052 }
2054 .modal-footer{
2053 .modal-footer{
2055 clear: both;
2054 clear: both;
2056 }
2055 }
2057 .key.tag{
2056 .key.tag{
2058 padding: 0.5em;
2057 padding: 0.5em;
2059 background-color: @rcblue;
2058 background-color: @rcblue;
2060 color: white;
2059 color: white;
2061 border-color: @rcblue;
2060 border-color: @rcblue;
2062 .box-shadow(none);
2061 .box-shadow(none);
2063 }
2062 }
2064 }
2063 }
2065
2064
2066
2065
2067
2066
2068 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2067 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2069
2068
2070 @import 'statistics-graph';
2069 @import 'statistics-graph';
2071 @import 'tables';
2070 @import 'tables';
2072 @import 'forms';
2071 @import 'forms';
2073 @import 'diff';
2072 @import 'diff';
2074 @import 'summary';
2073 @import 'summary';
2075 @import 'navigation';
2074 @import 'navigation';
2076
2075
2077 //--- SHOW/HIDE SECTIONS --//
2076 //--- SHOW/HIDE SECTIONS --//
2078
2077
2079 .btn-collapse {
2078 .btn-collapse {
2080 float: right;
2079 float: right;
2081 text-align: right;
2080 text-align: right;
2082 font-family: @text-light;
2081 font-family: @text-light;
2083 font-size: @basefontsize;
2082 font-size: @basefontsize;
2084 cursor: pointer;
2083 cursor: pointer;
2085 border: none;
2084 border: none;
2086 color: @rcblue;
2085 color: @rcblue;
2087 }
2086 }
2088
2087
2089 table.rctable,
2088 table.rctable,
2090 table.dataTable {
2089 table.dataTable {
2091 .btn-collapse {
2090 .btn-collapse {
2092 float: right;
2091 float: right;
2093 text-align: right;
2092 text-align: right;
2094 }
2093 }
2095 }
2094 }
2096
2095
2097
2096
2098 // TODO: johbo: Fix for IE10, this avoids that we see a border
2097 // TODO: johbo: Fix for IE10, this avoids that we see a border
2099 // and padding around checkboxes and radio boxes. Move to the right place,
2098 // and padding around checkboxes and radio boxes. Move to the right place,
2100 // or better: Remove this once we did the form refactoring.
2099 // or better: Remove this once we did the form refactoring.
2101 input[type=checkbox],
2100 input[type=checkbox],
2102 input[type=radio] {
2101 input[type=radio] {
2103 padding: 0;
2102 padding: 0;
2104 border: none;
2103 border: none;
2105 }
2104 }
2105
2106 .toggle-ajax-spinner{
2107 height: 16px;
2108 width: 16px;
2109 }
@@ -1,6 +1,9 b''
1 <link rel="import" href="../../../../../bower_components/paper-toggle-button/paper-toggle-button.html">
1 <link rel="import" href="../../../../../bower_components/paper-toggle-button/paper-toggle-button.html">
2 <link rel="import" href="../../../../../bower_components/paper-toast/paper-toast.html">
2 <link rel="import" href="../../../../../bower_components/paper-toast/paper-toast.html">
3 <link rel="import" href="../../../../../bower_components/paper-tooltip/paper-tooltip.html">
3 <link rel="import" href="../../../../../bower_components/paper-tooltip/paper-tooltip.html">
4 <link rel="import" href="../../../../../bower_components/paper-button/paper-button.html">
4 <link rel="import" href="../../../../../bower_components/paper-button/paper-button.html">
5 <link rel="import" href="../../../../../bower_components/paper-spinner/paper-spinner.html">
5 <link rel="import" href="../../../../../bower_components/paper-spinner/paper-spinner.html">
6 <link rel="import" href="../../../../../bower_components/iron-ajax/iron-ajax.html">
6 <link rel="import" href="../../../../../bower_components/iron-ajax/iron-ajax.html">
7 <link rel="import" href="shared-styles.html">
8 <link rel="import" href="rhodecode-toast.html">
9 <link rel="import" href="rhodecode-unsafe-html.html">
@@ -1,59 +1,47 b''
1 "use strict";
1 "use strict";
2
2
3 toastr.options = {
4 "closeButton": true,
5 "debug": false,
6 "newestOnTop": false,
7 "progressBar": false,
8 "positionClass": "toast-top-center",
9 "preventDuplicates": false,
10 "onclick": null,
11 "showDuration": "300",
12 "hideDuration": "300",
13 "timeOut": "0",
14 "extendedTimeOut": "0",
15 "showEasing": "swing",
16 "hideEasing": "linear",
17 "showMethod": "fadeIn",
18 "hideMethod": "fadeOut"
19 };
20
3
21 function notifySystem(data) {
4 function notifySystem(data) {
22 var notification = new Notification(data.message.level + ': ' + data.message.message);
5 var notification = new Notification(data.message.level + ': ' + data.message.message);
23 };
6 };
24
7
25 function notifyToaster(data){
8 function notifyToaster(data){
26 toastr[data.message.level](data.message.message);
9 var notifications = document.getElementById('notifications');
10 notifications.push('toasts',
11 { level: data.message.level,
12 message: data.message.message
13 });
14 notifications.open();
27 }
15 }
28
16
29 function handleNotifications(data) {
17 function handleNotifications(data) {
30 if (!templateContext.rhodecode_user.notification_status && !data.message.testMessage) {
18 if (!templateContext.rhodecode_user.notification_status && !data.message.testMessage) {
31 // do not act if notifications are disabled
19 // do not act if notifications are disabled
32 return
20 return
33 }
21 }
34 // use only js notifications for now
22 // use only js notifications for now
35 var onlyJS = true;
23 var onlyJS = true;
36 if (!("Notification" in window) || onlyJS) {
24 if (!("Notification" in window) || onlyJS) {
37 // use legacy notificartion
25 // use legacy notificartion
38 notifyToaster(data);
26 notifyToaster(data);
39 }
27 }
40 else {
28 else {
41 // Let's check whether notification permissions have already been granted
29 // Let's check whether notification permissions have already been granted
42 if (Notification.permission === "granted") {
30 if (Notification.permission === "granted") {
43 notifySystem(data);
31 notifySystem(data);
44 }
32 }
45 // Otherwise, we need to ask the user for permission
33 // Otherwise, we need to ask the user for permission
46 else if (Notification.permission !== 'denied') {
34 else if (Notification.permission !== 'denied') {
47 Notification.requestPermission(function (permission) {
35 Notification.requestPermission(function (permission) {
48 if (permission === "granted") {
36 if (permission === "granted") {
49 notifySystem(data);
37 notifySystem(data);
50 }
38 }
51 });
39 });
52 }
40 }
53 else{
41 else{
54 notifyToaster(data);
42 notifyToaster(data);
55 }
43 }
56 }
44 }
57 };
45 };
58
46
59 $.Topic('/notifications').subscribe(handleNotifications);
47 $.Topic('/notifications').subscribe(handleNotifications);
@@ -1,96 +1,96 b''
1 <template is="dom-bind" id="notificationsPage">
1 <template is="dom-bind" id="notificationsPage">
2
2 <style include="shared-styles"></style>
3 <iron-ajax id="toggleNotifications"
3 <iron-ajax id="toggleNotifications"
4 method="post"
4 method="post"
5 url="${url('my_account_notifications_toggle_visibility')}"
5 url="${url('my_account_notifications_toggle_visibility')}"
6 content-type="application/json"
6 content-type="application/json"
7 loading="{{changeNotificationsLoading}}"
7 loading="{{changeNotificationsLoading}}"
8 on-response="handleNotifications"
8 on-response="handleNotifications"
9 handle-as="json"></iron-ajax>
9 handle-as="json"></iron-ajax>
10
10
11 <div class="panel panel-default">
11 <div class="panel panel-default">
12 <div class="panel-heading">
12 <div class="panel-heading">
13 <h3 class="panel-title">${_('Your live notification settings')}</h3>
13 <h3 class="panel-title">${_('Your live notification settings')}</h3>
14 </div>
14 </div>
15 <div class="panel-body">
15 <div class="panel-body">
16
16
17 <p><strong>IMPORTANT:</strong> This feature requires enabled channelstream websocket server to function correctly.</p>
17 <p><strong>IMPORTANT:</strong> This feature requires enabled channelstream websocket server to function correctly.</p>
18
18
19 <p class="hidden">Status of browser notifications permission: <strong id="browser-notification-status"></strong></p>
19 <p class="hidden">Status of browser notifications permission: <strong id="browser-notification-status"></strong></p>
20
20
21 <div class="form">
21 <div class="form">
22 <!-- fields -->
22 <!-- fields -->
23 <div class="fields">
23 <div class="fields">
24 <div class="field">
24 <div class="field">
25 <div class="label">
25 <div class="label">
26 <label for="new_email">${_('Notifications status')}:</label>
26 <label for="new_email">${_('Notifications status')}:</label>
27 </div>
27 </div>
28 <div class="checkboxes">
28 <div class="checkboxes">
29 <div style="display: inline-block">
29 <div style="display: inline-block">
30 <paper-toggle-button on-change="toggleNotifications" ${'checked' if c.rhodecode_user.get_instance().user_data.get('notification_status') else ''}></paper-toggle-button>
30 <paper-toggle-button on-change="toggleNotifications" ${'checked' if c.rhodecode_user.get_instance().user_data.get('notification_status') else ''}></paper-toggle-button>
31 <paper-tooltip>Toggle your notifications on/off globally.</paper-tooltip>
31 <paper-tooltip>Toggle your notifications on/off globally.</paper-tooltip>
32 </div>
32 </div>
33 <template is="dom-if" if="{{changeNotificationsLoading}}">
33 <template is="dom-if" if="{{changeNotificationsLoading}}">
34 <paper-spinner active style="height: 22px; width: 22px"></paper-spinner>
34 <paper-spinner active class="toggle-ajax-spinner"></paper-spinner>
35 </template>
35 </template>
36 </div>
36 </div>
37 </div>
37 </div>
38 <div class="buttons">
38 <div class="buttons">
39 <a class="btn btn-info" id="test-notification">Test notification</a>
39 <a class="btn btn-info" id="test-notification">Test notification</a>
40 </div>
40 </div>
41 </div>
41 </div>
42 </div>
42 </div>
43
43
44 </div>
44 </div>
45 </div>
45 </div>
46
46
47 <script type="application/javascript">
47 <script type="application/javascript">
48 /** because im not creating a custom element for this page
48 /** because im not creating a custom element for this page
49 * we need to push the function onto the dom-template
49 * we need to push the function onto the dom-template
50 * ideally we turn this into notification-settings elements
50 * ideally we turn this into notification-settings elements
51 * then it will be cleaner
51 * then it will be cleaner
52 */
52 */
53 var ctrlr = $('#notificationsPage')[0];
53 var ctrlr = $('#notificationsPage')[0];
54 ctrlr.toggleNotifications = function(event){
54 ctrlr.toggleNotifications = function(event){
55 var ajax = $('#toggleNotifications')[0];
55 var ajax = $('#toggleNotifications')[0];
56 ajax.headers = {"X-CSRF-Token": CSRF_TOKEN}
56 ajax.headers = {"X-CSRF-Token": CSRF_TOKEN}
57 ajax.body = {notification_status:event.target.active};
57 ajax.body = {notification_status:event.target.active};
58 ajax.generateRequest();
58 ajax.generateRequest();
59 };
59 };
60 ctrlr.handleNotifications = function(event){
60 ctrlr.handleNotifications = function(event){
61 $('paper-toggle-button')[0].active = event.detail.response;
61 $('paper-toggle-button')[0].active = event.detail.response;
62 };
62 };
63
63
64 function checkBrowserStatus(){
64 function checkBrowserStatus(){
65 var browserStatus = 'Unknown';
65 var browserStatus = 'Unknown';
66
66
67 if (!("Notification" in window)) {
67 if (!("Notification" in window)) {
68 browserStatus = 'Not supported'
68 browserStatus = 'Not supported'
69 }
69 }
70 else if(Notification.permission === 'denied'){
70 else if(Notification.permission === 'denied'){
71 browserStatus = 'Denied';
71 browserStatus = 'Denied';
72 $('.flash_msg').append('<div class="alert alert-error">Notifications are blocked on browser level - you need to enable them in your browser settings.</div>')
72 $('.flash_msg').append('<div class="alert alert-error">Notifications are blocked on browser level - you need to enable them in your browser settings.</div>')
73 }
73 }
74 else if(Notification.permission === 'granted'){
74 else if(Notification.permission === 'granted'){
75 browserStatus = 'Allowed';
75 browserStatus = 'Allowed';
76 }
76 }
77
77
78 $('#browser-notification-status').text(browserStatus);
78 $('#browser-notification-status').text(browserStatus);
79 };
79 };
80
80
81 checkBrowserStatus();
81 checkBrowserStatus();
82
82
83 $('#test-notification').on('click', function(e){
83 $('#test-notification').on('click', function(e){
84 var levels = ['info', 'error', 'warning', 'success'];
84 var levels = ['info', 'error', 'warning', 'success'];
85 var level = levels[Math.floor(Math.random()*levels.length)];
85 var level = levels[Math.floor(Math.random()*levels.length)];
86 var payload = {
86 var payload = {
87 message: {
87 message: {
88 message: 'This is a test notification.',
88 message: 'This is a test notification.',
89 level: level,
89 level: level,
90 testMessage: true
90 testMessage: true
91 }
91 }
92 };
92 };
93 $.Topic('/notifications').publish(payload);
93 $.Topic('/notifications').publish(payload);
94 })
94 })
95 </script>
95 </script>
96 </template>
96 </template>
@@ -1,158 +1,159 b''
1 ## -*- coding: utf-8 -*-
1 ## -*- coding: utf-8 -*-
2 <!DOCTYPE html>
2 <!DOCTYPE html>
3
3
4 <%
4 <%
5 c.template_context['repo_name'] = getattr(c, 'repo_name', '')
5 c.template_context['repo_name'] = getattr(c, 'repo_name', '')
6
6
7 if hasattr(c, 'rhodecode_db_repo'):
7 if hasattr(c, 'rhodecode_db_repo'):
8 c.template_context['repo_type'] = c.rhodecode_db_repo.repo_type
8 c.template_context['repo_type'] = c.rhodecode_db_repo.repo_type
9 c.template_context['repo_landing_commit'] = c.rhodecode_db_repo.landing_rev[1]
9 c.template_context['repo_landing_commit'] = c.rhodecode_db_repo.landing_rev[1]
10
10
11 if getattr(c, 'rhodecode_user', None) and c.rhodecode_user.user_id:
11 if getattr(c, 'rhodecode_user', None) and c.rhodecode_user.user_id:
12 c.template_context['rhodecode_user']['username'] = c.rhodecode_user.username
12 c.template_context['rhodecode_user']['username'] = c.rhodecode_user.username
13 c.template_context['rhodecode_user']['email'] = c.rhodecode_user.email
13 c.template_context['rhodecode_user']['email'] = c.rhodecode_user.email
14 c.template_context['rhodecode_user']['notification_status'] = c.rhodecode_user.get_instance().user_data.get('notification_status', True)
14 c.template_context['rhodecode_user']['notification_status'] = c.rhodecode_user.get_instance().user_data.get('notification_status', True)
15
15
16 c.template_context['visual']['default_renderer'] = h.get_visual_attr(c, 'default_renderer')
16 c.template_context['visual']['default_renderer'] = h.get_visual_attr(c, 'default_renderer')
17 %>
17 %>
18 <html xmlns="http://www.w3.org/1999/xhtml">
18 <html xmlns="http://www.w3.org/1999/xhtml">
19 <head>
19 <head>
20 <title>${self.title()}</title>
20 <title>${self.title()}</title>
21 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
21 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
22 <%def name="robots()">
22 <%def name="robots()">
23 <meta name="robots" content="index, nofollow"/>
23 <meta name="robots" content="index, nofollow"/>
24 </%def>
24 </%def>
25 ${self.robots()}
25 ${self.robots()}
26 <link rel="icon" href="${h.asset('images/favicon.ico', ver=c.rhodecode_version_hash)}" sizes="16x16 32x32" type="image/png" />
26 <link rel="icon" href="${h.asset('images/favicon.ico', ver=c.rhodecode_version_hash)}" sizes="16x16 32x32" type="image/png" />
27
27
28 ## CSS definitions
28 ## CSS definitions
29 <%def name="css()">
29 <%def name="css()">
30 <link rel="stylesheet" type="text/css" href="${h.asset('css/style.css', ver=c.rhodecode_version_hash)}" media="screen"/>
30 <link rel="stylesheet" type="text/css" href="${h.asset('css/style.css', ver=c.rhodecode_version_hash)}" media="screen"/>
31 <!--[if lt IE 9]>
31 <!--[if lt IE 9]>
32 <link rel="stylesheet" type="text/css" href="${h.asset('css/ie.css', ver=c.rhodecode_version_hash)}" media="screen"/>
32 <link rel="stylesheet" type="text/css" href="${h.asset('css/ie.css', ver=c.rhodecode_version_hash)}" media="screen"/>
33 <![endif]-->
33 <![endif]-->
34 ## EXTRA FOR CSS
34 ## EXTRA FOR CSS
35 ${self.css_extra()}
35 ${self.css_extra()}
36 </%def>
36 </%def>
37 ## CSS EXTRA - optionally inject some extra CSS stuff needed for specific websites
37 ## CSS EXTRA - optionally inject some extra CSS stuff needed for specific websites
38 <%def name="css_extra()">
38 <%def name="css_extra()">
39 </%def>
39 </%def>
40
40
41 ${self.css()}
41 ${self.css()}
42
42
43 ## JAVASCRIPT
43 ## JAVASCRIPT
44 <%def name="js()">
44 <%def name="js()">
45 <script>
45 <script>
46 // setup Polymer options
46 // setup Polymer options
47 window.Polymer = {lazyRegister: true, dom: 'shadow'};
47 window.Polymer = {lazyRegister: true, dom: 'shadow'};
48
48
49 // load webcomponents polyfills
49 // load webcomponents polyfills
50 (function() {
50 (function() {
51 if ('registerElement' in document
51 if ('registerElement' in document
52 && 'import' in document.createElement('link')
52 && 'import' in document.createElement('link')
53 && 'content' in document.createElement('template')) {
53 && 'content' in document.createElement('template')) {
54 // browser has web components
54 // browser has web components
55 } else {
55 } else {
56 // polyfill web components
56 // polyfill web components
57 var e = document.createElement('script');
57 var e = document.createElement('script');
58 e.src = '${h.asset('js/vendors/webcomponentsjs/webcomponents-lite.min.js', ver=c.rhodecode_version_hash)}';
58 e.src = '${h.asset('js/vendors/webcomponentsjs/webcomponents-lite.min.js', ver=c.rhodecode_version_hash)}';
59 document.head.appendChild(e);
59 document.head.appendChild(e);
60 }
60 }
61 })();
61 })();
62 </script>
62 </script>
63 <link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}" async>
63 <link rel="import" href="${h.asset('js/rhodecode-components.html', ver=c.rhodecode_version_hash)}" async>
64
64
65 <script src="${h.asset('js/rhodecode/i18n/%s.js' % c.language, ver=c.rhodecode_version_hash)}"></script>
65 <script src="${h.asset('js/rhodecode/i18n/%s.js' % c.language, ver=c.rhodecode_version_hash)}"></script>
66 <script type="text/javascript">
66 <script type="text/javascript">
67 // register templateContext to pass template variables to JS
67 // register templateContext to pass template variables to JS
68 var templateContext = ${h.json.dumps(c.template_context)|n};
68 var templateContext = ${h.json.dumps(c.template_context)|n};
69
69
70 var REPO_NAME = "${getattr(c, 'repo_name', '')}";
70 var REPO_NAME = "${getattr(c, 'repo_name', '')}";
71 %if hasattr(c, 'rhodecode_db_repo'):
71 %if hasattr(c, 'rhodecode_db_repo'):
72 var REPO_LANDING_REV = '${c.rhodecode_db_repo.landing_rev[1]}';
72 var REPO_LANDING_REV = '${c.rhodecode_db_repo.landing_rev[1]}';
73 var REPO_TYPE = '${c.rhodecode_db_repo.repo_type}';
73 var REPO_TYPE = '${c.rhodecode_db_repo.repo_type}';
74 %else:
74 %else:
75 var REPO_LANDING_REV = '';
75 var REPO_LANDING_REV = '';
76 var REPO_TYPE = '';
76 var REPO_TYPE = '';
77 %endif
77 %endif
78 var APPLICATION_URL = "${h.url('home').rstrip('/')}";
78 var APPLICATION_URL = "${h.url('home').rstrip('/')}";
79 var ASSET_URL = "${h.asset('')}";
79 var ASSET_URL = "${h.asset('')}";
80 var DEFAULT_RENDERER = "${h.get_visual_attr(c, 'default_renderer')}";
80 var DEFAULT_RENDERER = "${h.get_visual_attr(c, 'default_renderer')}";
81 var CSRF_TOKEN = "${getattr(c, 'csrf_token', '')}";
81 var CSRF_TOKEN = "${getattr(c, 'csrf_token', '')}";
82 % if getattr(c, 'rhodecode_user', None):
82 % if getattr(c, 'rhodecode_user', None):
83 var USER = {name:'${c.rhodecode_user.username}'};
83 var USER = {name:'${c.rhodecode_user.username}'};
84 % else:
84 % else:
85 var USER = {name:null};
85 var USER = {name:null};
86 % endif
86 % endif
87
87
88 var APPENLIGHT = {
88 var APPENLIGHT = {
89 enabled: ${'true' if getattr(c, 'appenlight_enabled', False) else 'false'},
89 enabled: ${'true' if getattr(c, 'appenlight_enabled', False) else 'false'},
90 key: '${getattr(c, "appenlight_api_public_key", "")}',
90 key: '${getattr(c, "appenlight_api_public_key", "")}',
91 % if getattr(c, 'appenlight_server_url', None):
91 % if getattr(c, 'appenlight_server_url', None):
92 serverUrl: '${getattr(c, "appenlight_server_url", "")}',
92 serverUrl: '${getattr(c, "appenlight_server_url", "")}',
93 % endif
93 % endif
94 requestInfo: {
94 requestInfo: {
95 % if getattr(c, 'rhodecode_user', None):
95 % if getattr(c, 'rhodecode_user', None):
96 ip: '${c.rhodecode_user.ip_addr}',
96 ip: '${c.rhodecode_user.ip_addr}',
97 username: '${c.rhodecode_user.username}'
97 username: '${c.rhodecode_user.username}'
98 % endif
98 % endif
99 }
99 }
100 };
100 };
101 </script>
101 </script>
102 <!--[if lt IE 9]>
102 <!--[if lt IE 9]>
103 <script language="javascript" type="text/javascript" src="${h.asset('js/excanvas.min.js')}"></script>
103 <script language="javascript" type="text/javascript" src="${h.asset('js/excanvas.min.js')}"></script>
104 <![endif]-->
104 <![endif]-->
105 <script language="javascript" type="text/javascript" src="${h.asset('js/rhodecode/routes.js', ver=c.rhodecode_version_hash)}"></script>
105 <script language="javascript" type="text/javascript" src="${h.asset('js/rhodecode/routes.js', ver=c.rhodecode_version_hash)}"></script>
106 <script language="javascript" type="text/javascript" src="${h.asset('js/scripts.js', ver=c.rhodecode_version_hash)}"></script>
106 <script language="javascript" type="text/javascript" src="${h.asset('js/scripts.js', ver=c.rhodecode_version_hash)}"></script>
107 ## avoide escaping the %N
107 ## avoide escaping the %N
108 <script>CodeMirror.modeURL = "${h.asset('') + 'js/mode/%N/%N.js?ver='+c.rhodecode_version_hash}";</script>
108 <script>CodeMirror.modeURL = "${h.asset('') + 'js/mode/%N/%N.js?ver='+c.rhodecode_version_hash}";</script>
109
109
110
110
111 ## JAVASCRIPT EXTRA - optionally inject some extra JS for specificed templates
111 ## JAVASCRIPT EXTRA - optionally inject some extra JS for specificed templates
112 ${self.js_extra()}
112 ${self.js_extra()}
113
113
114 <script type="text/javascript">
114 <script type="text/javascript">
115 $(document).ready(function(){
115 $(document).ready(function(){
116 show_more_event();
116 show_more_event();
117 timeagoActivate();
117 timeagoActivate();
118 })
118 })
119 </script>
119 </script>
120
120
121 </%def>
121 </%def>
122
122
123 ## JAVASCRIPT EXTRA - optionally inject some extra JS for specificed templates
123 ## JAVASCRIPT EXTRA - optionally inject some extra JS for specificed templates
124 <%def name="js_extra()"></%def>
124 <%def name="js_extra()"></%def>
125 ${self.js()}
125 ${self.js()}
126
126
127 <%def name="head_extra()"></%def>
127 <%def name="head_extra()"></%def>
128 ${self.head_extra()}
128 ${self.head_extra()}
129 <%include file="/base/plugins_base.html"/>
129 <%include file="/base/plugins_base.html"/>
130
130
131 ## extra stuff
131 ## extra stuff
132 %if c.pre_code:
132 %if c.pre_code:
133 ${c.pre_code|n}
133 ${c.pre_code|n}
134 %endif
134 %endif
135 </head>
135 </head>
136 <body id="body">
136 <body id="body">
137 <noscript>
137 <noscript>
138 <div class="noscript-error">
138 <div class="noscript-error">
139 ${_('Please enable JavaScript to use RhodeCode Enterprise')}
139 ${_('Please enable JavaScript to use RhodeCode Enterprise')}
140 </div>
140 </div>
141 </noscript>
141 </noscript>
142 ## IE hacks
142 ## IE hacks
143 <!--[if IE 7]>
143 <!--[if IE 7]>
144 <script>$(document.body).addClass('ie7')</script>
144 <script>$(document.body).addClass('ie7')</script>
145 <![endif]-->
145 <![endif]-->
146 <!--[if IE 8]>
146 <!--[if IE 8]>
147 <script>$(document.body).addClass('ie8')</script>
147 <script>$(document.body).addClass('ie8')</script>
148 <![endif]-->
148 <![endif]-->
149 <!--[if IE 9]>
149 <!--[if IE 9]>
150 <script>$(document.body).addClass('ie9')</script>
150 <script>$(document.body).addClass('ie9')</script>
151 <![endif]-->
151 <![endif]-->
152
152
153 ${next.body()}
153 ${next.body()}
154 %if c.post_code:
154 %if c.post_code:
155 ${c.post_code|n}
155 ${c.post_code|n}
156 %endif
156 %endif
157 <rhodecode-toast id="notifications"></rhodecode-toast>
157 </body>
158 </body>
158 </html>
159 </html>
1 NO CONTENT: file was removed
NO CONTENT: file was removed
1 NO CONTENT: file was removed
NO CONTENT: file was removed
General Comments 0
You need to be logged in to leave comments. Login now