prevent Outlook 2013/2016 from displaying empty rows

prevent Outlook 2013/2016 from displaying empty rows - html-email

I have a table with placeholder rows for disclaimers. These get populated based on number of disclaimers set in the backend. All looks good in other versions of Outlook but 2013 and 2016. Outlook 2013 & 2016 display empty rows, leaving wide gaps between the disclaimer and whatever is below it when I have only one disclaimer. Anyone knows how to make outlook 2013/2016 collapse these empty cells please?
Table snippet looks like this:
<table class="w320" width="640" cellpadding="0" cellspacing="0">
<!--Regular Disclaimers -->
<tr>
<td style="text-align:center; vertical-align:top;">
<table cellpadding="0" cellspacing="0" width="100%" border="0">
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top" ><span style="padding:2px;">*</span></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"><span style="padding:2;">Amount may change depending on available bonus offer and/or your use of coupons. </span></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size: 10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size: 10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
<tr>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" width="18" align="right" valign="top"></td>
<td style="font-family: Arial, Helvetica, sans-serif; font-size:10px; line-height: 10px; color: #000000" align="left" valign="top"></td>
</tr>
</table>
</td>
</tr>
</table>

Related

How can I split a text in 2 color vertically in Flutter

I'm new to Flutter and trying to do something similar to this :
div {
font: 40px Arial;
background: -webkit-linear-gradient(top, #0d2172 0%,#0d2172 50%,#ff2828 50%,#ff0000 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
but in Flutter.
I've tried with gradient and a shaderMask already, but it's not what I want...
Any ideas?
Thank you very much

This is what I have managed to do with flutter . Propably works for you
You first need to add the Gradient
final Gradient _gradient = const LinearGradient(
begin: Alignment(0.5, 1),
end: Alignment(0.5, 0),
colors: <Color>[
Color(0xff1f005c),
Color(0xffffb56b),
],
stops : [1,1],
tileMode: TileMode.clamp,
);
Then you change your text to this :
ShaderMask(
blendMode: BlendMode.modulate,
shaderCallback: (size) => _gradient.createShader(
Rect.fromLTWH(0, 0, size.width, size.height),
),
child: Text(
'ABCDEFGH',
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 60,
),),
)

Warning message: AdaptV4theme() is deprecated

I'm pretty new to MaterilUI and I recently upgraded my materialUI from V4 to V5. While building the react project, npm run build, I get a warning message that my adaptV4theme is being deprecated. To be honest, I don't know what that means. Would someone be able to help me get rid of this warning.
The code:
import { adaptV4Theme, createTheme } from "#mui/material/styles";
export const defaultTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#006565",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#99CBCB",
foreground: "#FFFFFF",
highlight: "#006565",
midground: "#DBEDED",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const lightTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#006565",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#ebebeb",
foreground: "#FFFFFF",
highlight: "#ffffff",
midground: "#e0e0e0",
textColor: "#000000",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const darkTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#171717",
},
secondary: {
main: "#171717",
},
},
colors: {
background: "#424242",
foreground: "#FFFFFF",
highlight: "#212121",
midground: "#e3e3e3",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#lightgray",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const greyTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#6c757d",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#8f9ba6",
foreground: "#FFFFFF",
highlight: "#6c757d",
midground: "#dadfe3",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const redTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#dc3545",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#e07e87",
foreground: "#FFFFFF",
highlight: "#dc3545",
midground: "#e3c1c4",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const orangeTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#ff6200",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#ffc380",
foreground: "#FFFFFF",
highlight: "#ff8400",
midground: "#ffdab3",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const blueTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#0059ff",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#75a1ff",
foreground: "#FFFFFF",
highlight: "#2f7beb",
midground: "#c7dcff",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
export const skyBlueTheme = createTheme(
adaptV4Theme({
palette: {
primary: {
main: "#0096ed",
},
secondary: {
main: "#99CBCB",
},
},
colors: {
background: "#81d5e6",
foreground: "#FFFFFF",
highlight: "#0dcaf0",
midground: "#daeaed",
textColor: "#ffffff",
passColor: "#3bc55f",
skipColor: "#D3D3D3",
failColor: "#fd4747",
pendingColor: "#fec540",
lightPassColor: "rgb(212, 237, 218)",
lightPendingColor: "rgb(255, 243, 205)",
lightFailColor: "rgb(248, 215, 218)",
},
})
);
Warning:
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.
MUI: adaptV4Theme() is deprecated.
Follow the upgrade guide on https://mui.com/r/migration-v4#theme.

just remove adaptV4Theme and you are good to go
export const defaultTheme = createTheme({
palette: {
primary: {
main: '#006565'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#99CBCB',
foreground: '#FFFFFF',
highlight: '#006565',
midground: '#DBEDED',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const lightTheme = createTheme({
palette: {
primary: {
main: '#006565'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#ebebeb',
foreground: '#FFFFFF',
highlight: '#ffffff',
midground: '#e0e0e0',
textColor: '#000000',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const darkTheme = createTheme({
palette: {
primary: {
main: '#171717'
},
secondary: {
main: '#171717'
}
},
colors: {
background: '#424242',
foreground: '#FFFFFF',
highlight: '#212121',
midground: '#e3e3e3',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#lightgray',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const greyTheme = createTheme({
palette: {
primary: {
main: '#6c757d'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#8f9ba6',
foreground: '#FFFFFF',
highlight: '#6c757d',
midground: '#dadfe3',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const redTheme = createTheme({
palette: {
primary: {
main: '#dc3545'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#e07e87',
foreground: '#FFFFFF',
highlight: '#dc3545',
midground: '#e3c1c4',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const orangeTheme = createTheme({
palette: {
primary: {
main: '#ff6200'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#ffc380',
foreground: '#FFFFFF',
highlight: '#ff8400',
midground: '#ffdab3',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const blueTheme = createTheme({
palette: {
primary: {
main: '#0059ff'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#75a1ff',
foreground: '#FFFFFF',
highlight: '#2f7beb',
midground: '#c7dcff',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})
export const skyBlueTheme = createTheme({
palette: {
primary: {
main: '#0096ed'
},
secondary: {
main: '#99CBCB'
}
},
colors: {
background: '#81d5e6',
foreground: '#FFFFFF',
highlight: '#0dcaf0',
midground: '#daeaed',
textColor: '#ffffff',
passColor: '#3bc55f',
skipColor: '#D3D3D3',
failColor: '#fd4747',
pendingColor: '#fec540',
lightPassColor: 'rgb(212, 237, 218)',
lightPendingColor: 'rgb(255, 243, 205)',
lightFailColor: 'rgb(248, 215, 218)'
}
})

How to add separator between leading icon and text in textfield in flutter

how to add separator or divider in between text and leading ico
TextField(
decoration: InputDecoration(
prefixIcon: Icon(Icons.perm_identity ),
labelText: 'Enter Your Name',
)
)

You can try to wrap the Icon in a container and add a border to it.
Container(
margin: const EdgeInsets.all(15.0),
padding: const EdgeInsets.all(3.0),
decoration: BoxDecoration(
border: Border(left:
BorderSide( // <--- left side
color: Colors.black,
width: 3.0,
),
),
child: Icon(Icons.perm_identity),
),
),
References
Great answer for borders
Box Decoration Cheat sheet

How can I make an InputDecoration border appear only on the left?

I'm trying to only show the pink border on the left side when focused.
This is what I currently have and it is showing on all sides:
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.pink,
width: 2.0)
)

Invalid constant value on Border

I'm trying to add a border to a container. However, when I put this code onto the border value, it trows me an Invalid constant value error.
My code goes like this:
border: new Border.all(
color: Colors.grey,
width: 0.5,
style: BorderStyle.solid
),
I've double checked everything and I don't seem to find a misstype or anything.

Container doesn't have a border property, instead use a decoration
Container(
width: 100,
height: 100,
decoration: BoxDecoration(
border: Border.all(
color: Colors.grey,
width: 0.5,
style: BorderStyle.solid
)
)
)

We Keep Coding

iphone swift flutter scala powershell matlab mongodb postgresql perl eclipse

prevent Outlook 2013/2016 from displaying empty rows - html-email

Related

How can I split a text in 2 color vertically in Flutter

Warning message: AdaptV4theme() is deprecated

How to add separator between leading icon and text in textfield in flutter

How can I make an InputDecoration border appear only on the left?

Invalid constant value on Border

Categories

Resources