ui-react/src/theme/globalStyle.js

   1 /*-
   2  * ============LICENSE_START=======================================================
   3  * ONAP CLAMP
   4  * ================================================================================
   5  * Copyright (C) 2019 AT&T Intellectual Property. All rights
   6  *                             reserved.
   7  * ================================================================================
   8  * Licensed under the Apache License, Version 2.0 (the "License");
   9  * you may not use this file except in compliance with the License.
  10  * You may obtain a copy of the License at
  11  *
  12  * http://www.apache.org/licenses/LICENSE-2.0
  13  *
  14  * Unless required by applicable law or agreed to in writing, software
  15  * distributed under the License is distributed on an "AS IS" BASIS,
  16  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  17  * See the License for the specific language governing permissions and
  18  * limitations under the License.
  19  * ============LICENSE_END============================================
  20  * ===================================================================
  21  *
  22  */
  23
  24 import { createGlobalStyle } from 'styled-components';
  25
  26 export const GlobalClampStyle = createGlobalStyle`
  27         body {
  28                 padding: 0;
  29                 margin: 0;
  30                 font-family: ${props => props.theme.fontFamily};
  31                 font-size: ${props => props.theme.fontSize};
  32                 font-weight: normal;
  33         }
  34
  35         span {
  36                 font-family: ${props => props.theme.fontFamily};
  37                 font-size: ${props => props.theme.fontSize};
  38                 font-weight: bold;
  39         }
  40
  41         a {
  42                 font-family: ${props => props.theme.fontFamily};
  43                 font-size: ${props => props.theme.fontSize};
  44                 font-weight: bold;
  45         }
  46
  47         div {
  48                 font-family: ${props => props.theme.fontFamily};
  49                 font-size: ${props => props.theme.fontSize};
  50                 border-radius: 4px;
  51                 margin-top: 1px;
  52         }
  53
  54         svg {
  55                 overflow: hidden;
  56                 width: 100%;
  57                 height: 100%;
  58         }
  59
  60         label {
  61                 font-family: ${props => props.theme.fontFamily};
  62                 font-size: ${props => props.theme.fontSize};
  63                 font-weight: bold;
  64         }
  65
  66         button {
  67                 font-family: ${props => props.theme.fontFamily};
  68                 font-size: ${props => props.theme.fontSize};
  69                 font-weight: bold;
  70         }
  71 `
  72
  73 export const DefaultClampTheme = {
  74         fontDanger: '#eb238e',
  75         fontWarning: '#eb238e',
  76         fontLight: '#ffffff',
  77         fontDark: '#888888',
  78         fontHighlight: '#ffff00',
  79         fontNormal: 'black',
  80
  81         backgroundColor: '#eeeeee',
  82         fontFamily: 'Arial, Sans-serif',
  83         fontSize: '16px',
  84
  85         loopViewerBackgroundColor: 'white',
  86         loopViewerFontColor: 'yellow',
  87         loopViewerHeaderBackgroundColor: '#337ab7',
  88         loopViewerHeaderFontColor: 'white',
  89
  90     loopLogsHeaderBackgroundColor:  'white',
  91     loopLogsHeaderFontColor: 'black',
  92
  93         menuBackgroundColor: 'white',
  94         menuFontColor: 'black',
  95         menuHighlightedBackgroundColor: '#337ab7',
  96         menuHighlightedFontColor: 'white',
  97
  98         toscaTextareaBackgroundColor: '#E8E8E8',
  99         toscaTextareaFontSize: '13px'
 100 };