Buck9195/doesitarm
1
0
Fork 0
mirror of https://github.com/ThatGuySam/doesitarm.git synced 2026-05-18 06:44:46 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

Make Virtualization responsive

Browse source
This commit is contained in:
Sam Carlton 2022-06-12 17:13:43 -05:00
parent 4a9c7bf4c1
commit aa69119753
1 changed files with 5 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

9
src/components/listing-parts/virtualization.astro
View file

@ -44,7 +44,7 @@ const totalLinks = links.length
<div class="text-xs opacity-75 mb-4">With Virtualization you can run apps on Apple Silicon Macs even if they are normally completely unsupported, such as Windows-only Apps, at the cost of some performance drop vs Native support. </div> <div class="text-xs opacity-75 mb-4">With Virtualization you can run apps on Apple Silicon Macs even if they are normally completely unsupported, such as Windows-only Apps, at the cost of some performance drop vs Native support. </div>
<span class="relative z-0 inline-flex shadow-sm divide-x divide-gray-700 border border-gray-300 rounded-md bg-darker py-3"> <span class="relative z-0 inline-flex text-center md:flex-row flex-col shadow-sm md:divide-x md:divide-y-0 divide-y divide-gray-700 border border-gray-300 rounded-md bg-darker md:py-3 md:px-0 px-4">
{ links.map( (link, i) => { { links.map( (link, i) => {
return ( return (
@ -52,17 +52,18 @@ const totalLinks = links.length
type="button" type="button"
href={ link.href } href={ link.href }
class={ [ class={ [
'relative inline-flex items-centertext-sm font-medium focus:z-10 focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500', 'relative inline-flex justify-center items-center font-medium focus:z-10 focus:outline-none focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500',
'text-white group', 'text-white group',
].join(' ')} ].join(' ')}
> >
<div <div
class={[ class={[
'inner-link group-hover:bg-indigo-400 group-active:bg-indigo-600 rounded-md px-4 py-2 -my-3', 'inner-link group-hover:bg-indigo-400 group-active:bg-indigo-600 rounded-md px-4 md:py-2 md:mx-0 md:-my-3',
'py-3 -mx-4',
// First Link // First Link
// i === 0 && 'rounded-l-md', // i === 0 && 'rounded-l-md',
// Not first Link // Not first Link
i !== 0 ? '-ml-px' : '', i !== 0 ? 'md:-ml-px' : '',
// Last Link // Last Link
// i === totalLinks - 1 ? 'rounded-r-md' : '' // i === totalLinks - 1 ? 'rounded-r-md' : ''
].join(' ')} ].join(' ')}