@secondstaxorg/sscomp 2.0.78 → 2.0.79

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -38785,6 +38785,23 @@ const IconButton = (props) => {
38785
38785
  )
38786
38786
  };
38787
38787
 
38788
+ const containerQuery = //language=css
38789
+ `
38790
+ .vc-container{
38791
+ container-type: inline-size;
38792
+ }
38793
+
38794
+ @container (max-width:425px) {
38795
+ .card-body{
38796
+ flex-direction: column;
38797
+ }
38798
+
38799
+ .video-thumbnail{
38800
+ width: 100% !important;
38801
+ }
38802
+ }
38803
+ `;
38804
+
38788
38805
  const Card = styled.div`
38789
38806
  background: ${theme.colors.white};
38790
38807
  border-radius: 8px;
@@ -38792,17 +38809,18 @@ const Card = styled.div`
38792
38809
  gap: 8px;
38793
38810
  display: flex;
38794
38811
  cursor: pointer;
38812
+ container-type: inline-size;
38795
38813
 
38796
38814
  .card-body {
38797
38815
  width: 100%;
38798
38816
  display: flex;
38799
- flex-direction: row;
38817
+ //flex-direction: row;
38800
38818
  gap: 24px;
38801
38819
  justify-content: start;
38802
38820
 
38803
- @media (max-width: 425px) {
38821
+ /*@media (max-width: 425px) {
38804
38822
  flex-direction: column;
38805
- }
38823
+ }*/
38806
38824
  }
38807
38825
 
38808
38826
  .video-thumbnail {
@@ -38816,9 +38834,9 @@ const Card = styled.div`
38816
38834
  background-size: cover;
38817
38835
  background-repeat: no-repeat;
38818
38836
 
38819
- @media (max-width: 425px) {
38837
+ /*@media (max-width: 425px) {
38820
38838
  width: 100%;
38821
- }
38839
+ }*/
38822
38840
 
38823
38841
  div.label {
38824
38842
  color: ${theme.colors.white};
@@ -38857,24 +38875,27 @@ const Card = styled.div`
38857
38875
  const _jsxFileName = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\VideoCard\\VideoCard.tsx";
38858
38876
  const VideoCard = ({date,onClick,thumbnailUrl,videoTitle}) => {
38859
38877
  return (
38860
- React$1.createElement(Card, { onClick: onClick, role: "button", 'aria-label': videoTitle, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 8}}
38861
- , React$1.createElement('div', { className: "card-body", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 9}}
38862
- , React$1.createElement('div', { className: "video-thumbnail", style: {backgroundImage:`url(${thumbnailUrl})`}, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 10}}
38863
- , React$1.createElement('div', { className: "label", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 11}}
38864
- , React$1.createElement('svg', { width: "16", height: "17", viewBox: "0 0 16 17" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 12}}
38865
- , React$1.createElement('path', {
38866
- d: "M12.3601 6.50001L5.92014 2.80667C5.57167 2.60545 5.17614 2.50003 4.77374 2.50114C4.37134 2.50224 3.97639 2.60983 3.62903 2.81297C3.28166 3.0161 2.99425 3.30756 2.79597 3.65773C2.5977 4.00789 2.49563 4.4043 2.50014 4.80667V12.22C2.50014 12.8247 2.74036 13.4046 3.16794 13.8322C3.59552 14.2598 4.17545 14.5 4.78014 14.5C5.18043 14.4993 5.57353 14.3936 5.92014 14.1933L12.3601 10.5C12.7062 10.2997 12.9935 10.012 13.1932 9.66563C13.3929 9.31928 13.4981 8.92649 13.4981 8.52667C13.4981 8.12686 13.3929 7.73407 13.1932 7.38772C12.9935 7.04136 12.7062 6.75361 12.3601 6.55334V6.50001ZM11.6935 9.29334L5.25348 13.04C5.10913 13.1218 4.94605 13.1648 4.78014 13.1648C4.61423 13.1648 4.45115 13.1218 4.30681 13.04C4.16287 12.9569 4.04335 12.8374 3.96027 12.6934C3.87718 12.5495 3.83345 12.3862 3.83348 12.22V4.78001C3.83345 4.61381 3.87718 4.45052 3.96027 4.30658C4.04335 4.16264 4.16287 4.04311 4.30681 3.96001C4.45175 3.87944 4.61434 3.83593 4.78014 3.83334C4.94583 3.83674 5.10823 3.8802 5.25348 3.96001L11.6935 7.68001C11.8375 7.76307 11.957 7.88259 12.0402 8.02653C12.1233 8.17048 12.1671 8.33378 12.1671 8.50001C12.1671 8.66624 12.1233 8.82954 12.0402 8.97348C11.957 9.11743 11.8375 9.23694 11.6935 9.32001V9.29334Z" ,
38867
- fill: "currentColor", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 13}})
38878
+ React$1.createElement(React$1.Fragment, null
38879
+ , React$1.createElement('style', {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 9}}, containerQuery)
38880
+ , React$1.createElement(Card, { onClick: onClick, role: "button", className: "vc-container", 'aria-label': videoTitle, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 10}}
38881
+ , React$1.createElement('div', { className: "card-body", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 11}}
38882
+ , React$1.createElement('div', { className: "video-thumbnail", style: {backgroundImage:`url(${thumbnailUrl})`}, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 12}}
38883
+ , React$1.createElement('div', { className: "label", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 13}}
38884
+ , React$1.createElement('svg', { width: "16", height: "17", viewBox: "0 0 16 17" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 14}}
38885
+ , React$1.createElement('path', {
38886
+ d: "M12.3601 6.50001L5.92014 2.80667C5.57167 2.60545 5.17614 2.50003 4.77374 2.50114C4.37134 2.50224 3.97639 2.60983 3.62903 2.81297C3.28166 3.0161 2.99425 3.30756 2.79597 3.65773C2.5977 4.00789 2.49563 4.4043 2.50014 4.80667V12.22C2.50014 12.8247 2.74036 13.4046 3.16794 13.8322C3.59552 14.2598 4.17545 14.5 4.78014 14.5C5.18043 14.4993 5.57353 14.3936 5.92014 14.1933L12.3601 10.5C12.7062 10.2997 12.9935 10.012 13.1932 9.66563C13.3929 9.31928 13.4981 8.92649 13.4981 8.52667C13.4981 8.12686 13.3929 7.73407 13.1932 7.38772C12.9935 7.04136 12.7062 6.75361 12.3601 6.55334V6.50001ZM11.6935 9.29334L5.25348 13.04C5.10913 13.1218 4.94605 13.1648 4.78014 13.1648C4.61423 13.1648 4.45115 13.1218 4.30681 13.04C4.16287 12.9569 4.04335 12.8374 3.96027 12.6934C3.87718 12.5495 3.83345 12.3862 3.83348 12.22V4.78001C3.83345 4.61381 3.87718 4.45052 3.96027 4.30658C4.04335 4.16264 4.16287 4.04311 4.30681 3.96001C4.45175 3.87944 4.61434 3.83593 4.78014 3.83334C4.94583 3.83674 5.10823 3.8802 5.25348 3.96001L11.6935 7.68001C11.8375 7.76307 11.957 7.88259 12.0402 8.02653C12.1233 8.17048 12.1671 8.33378 12.1671 8.50001C12.1671 8.66624 12.1233 8.82954 12.0402 8.97348C11.957 9.11743 11.8375 9.23694 11.6935 9.32001V9.29334Z" ,
38887
+ fill: "currentColor", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 15}})
38888
+ )
38889
+ , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 19}}, "Video")
38868
38890
  )
38869
- , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 17}}, "Video")
38870
- )
38871
- )
38872
- , React$1.createElement('div', { className: "video-details", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 20}}
38873
- , React$1.createElement('div', { className: "date", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 21}}
38874
- , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 22}}, dayjs(date).format('MMM D, YYYY'))
38875
38891
  )
38876
- , React$1.createElement('div', { className: "video-title", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 24}}
38877
- , React$1.createElement('p', { className: "subheadingRegular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 25}}, videoTitle)
38892
+ , React$1.createElement('div', { className: "video-details", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 22}}
38893
+ , React$1.createElement('div', { className: "date", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 23}}
38894
+ , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 24}}, dayjs(date).format('MMM D, YYYY'))
38895
+ )
38896
+ , React$1.createElement('div', { className: "video-title", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 26}}
38897
+ , React$1.createElement('p', { className: "subheadingRegular", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 27}}, videoTitle)
38898
+ )
38878
38899
  )
38879
38900
  )
38880
38901
  )