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     color: ${props => props.theme.fontNormal};
  34     background-color: ${props => props.theme.backgroundColor};
  35   }
  36
  37  span {
  38         font-family: ${props => props.theme.fontFamily};
  39     font-size: ${props => props.theme.fontSize};
  40     font-weight: bold;
  41     color: ${props => props.theme.fontNormal};
  42     background-color: ${props => props.theme.backgroundColor};
  43   }
  44
  45   a {
  46         font-family: ${props => props.theme.fontFamily};
  47     font-size: ${props => props.theme.fontSize};
  48     font-weight: bold;
  49     color: ${props => props.theme.fontNormal};
  50     background-color: ${props => props.theme.backgroundColor};
  51
  52   }
  53
  54   div {
  55         font-family: ${props => props.theme.fontFamily};
  56     font-size: ${props => props.theme.fontSize};
  57         border-radius: 4px;
  58         color: ${props => props.theme.fontNormal};
  59         background-color: ${props => (props.theme.backgroundColor)};
  60         margin-top: 1px;
  61   }
  62
  63   svg {
  64         overflow: hidden;
  65         width: 100%;
  66         height: 100%;
  67   }
  68 `
  69
  70 export const DefaultClampTheme = {
  71         fontDanger: '#eb238e',
  72         fontWarning: '#eb238e',
  73         fontLight: '#ffffff',
  74         fontDark: '#888888',
  75         fontHighlight: '#ffff00',
  76         fontNormal: 'black',
  77
  78         backgroundColor: '#eeeeee',
  79         fontFamily: 'Arial, Sans-serif',
  80         fontSize: '15px',
  81
  82         loopViewerBackgroundColor: 'white',
  83         loopViewerFontColor: 'yellow',
  84         loopViewerHeaderBackgroundColor: '#337ab7',
  85         loopViewerHeaderFontColor: 'white',
  86 };